Android-Spinner之有图下拉列表

本文例子是对从服务器获取下来的数据进行动态展示。

先祭图：

使用SimpleAdapter

源码方法：

public SimpleAdapter(Context context, List<? extends Map<String, ?>> data,
            @LayoutRes int resource, String[] from, @IdRes int[] to) {
        mData = data;
        mResource = mDropDownResource = resource;
        mFrom = from;
        mTo = to;
        mInflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
    }

如何实现

原理很简单，源码方法所需：列表展示的数据--data，展示到哪里--resource（xml），展示数据名字---from，展示填充位置--to

首先，定义展示spinner

你写个demo试试可以不用加那么多东西，要个spinner即可。我这个是上图中的样式：

<RelativeLayout
                    android:id="@+id/rl_car_color"
                    android:layout_width="match_parent"
                    android:layout_height="60dp">

                    <TextView
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_centerVertical="true"
                        android:layout_marginTop="@dimen/margin_min"
                        android:text="*"
                        android:textColor="@color/red" />

                    <TextView
                        android:id="@+id/tv_handle_type"
                        style="@style/breakLawBillFormTitleStyleCenterVertical"
                        android:text="@string/car_color" />

                    <ImageView
                        android:id="@+id/iv_choice"
                        android:layout_width="12dp"
                        android:layout_height="12dp"
                        android:layout_alignParentRight="true"
                        android:layout_centerVertical="true"
                        android:src="@drawable/list_open" />

                    <Spinner
                        android:id="@+id/sp_car_color"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_centerVertical="true"
                        android:layout_marginRight="@dimen/margin_med"
                        android:layout_toLeftOf="@+id/iv_choice"
                        android:background="@null"
                        android:entries="@array/car_body_color"
                        android:gravity="right"
                        android:spinnerMode="dialog" />

                </RelativeLayout>


//因为有很多相同字体，所以提取出来
<style name="breakLawBillFormTitleStyleCenterVertical">
        <item name="android:layout_centerVertical">true</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
        <item name="android:layout_marginLeft">10dp</item>
        <item name="android:textColor">@color/black</item>
        <item name="android:textSize">16sp</item>
    </style>

所用的图片：
@drawable/list_open

然后，activity绑定Spinner

public Spinner mCarColorSp;
//绑定
mCarColorSp = (Spinner) findViewById(R.id.sp_car_color);
//onCreate中init：
setSimpleSpinnerAdapter(mCarColorSp,mCarColorStrList);

//List<String> data为动态数据源,如果写死的列表，可以不要此参数
protected void setSimpleSpinnerAdapter(Spinner spinner,List<String> data){
    //声明一个SimpleAdapter独享，设置数据与对应关系
    SimpleAdapter simpleAdapter = new SimpleAdapter(mActivity, CarColorUtil.getData(data), R.layout.simple_simpleadapter_item,
            new String[] { "ivLogo", "carColor" }, new int[] {R.id.colorview, R.id.textview });
    spinner.setAdapter(simpleAdapter);
}

R.layout.simple_simpleadapter_item.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:gravity="center">

    <ImageView
        android:id="@+id/colorview"
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:layout_marginLeft="10dp"
        android:src="@drawable/car_bai" />

    <TextView
        android:id="@+id/textview"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:gravity="center|left"
        android:paddingLeft="10dp"
        android:textSize="15dp" />

</LinearLayout>

CarColorUtil

CarColorUtil.getData(data)主要是数据填充，简单例子如下：

//数据源
    private List<Map<String,Object>> getDat() {
        Map<String, Object> map = new HashMap<>();
        map.put("image", R.mipmap.ic_launcher);
        map.put("text", "北京");
        data.add(map);
        Map<String, Object> map1 = new HashMap<>();
        map1.put("image", R.mipmap.ic_launcher);
        map1.put("text", "上海");
        data.add(map1);
        Map<String, Object> map2 = new HashMap<>();
        map2.put("image", R.mipmap.ic_launcher);
        map2.put("text", "廣州");
        data.add(map2);
        Map<String, Object> map3 = new HashMap<>();
        map3.put("image", R.mipmap.ic_launcher);
        map3.put("text", "深圳");
        data.add(map3);
        return data;
    }

通过获取动态的数据

import java.util.ArrayList;
import java.util.Arrays;
import java.util.HashMap;
import java.util.List;
import java.util.Map;

public class CarColorUtil {

//    private static List<Integer> emoji  = new ArrayList<>(Arrays.asList(R.drawable.car_bai,R.drawable.car_hui,R.drawable.car_fen,R.drawable.car_hong,R.drawable.car_zi,R.drawable.car_lv,R.drawable.car_lan,R.drawable.car_zong,R.drawable.car_hei));
//    private static List<String> color  = new ArrayList<>(Arrays.asList("白","灰","粉","红","紫","绿","蓝","棕","黑"));
    private static final String BAI_SE = "白色";
    private static final String HUI_SE = "灰色";
    private static final String HUANG_SE = "黄色";
    private static final String FEN_SE = "粉色";
    private static final String HONG_SE = "红色";
    private static final String ZI_SE = "紫色";
    private static final String LV_SE = "绿色";
    private static final String LAN_SE = "蓝色";
    private static final String ZONG_SE = "棕色";
    private static final String HEI_SE = "黑色";

    private static final String BAI = "白";
    private static final String HEI = "黑";
    private static final String LAN = "蓝";
    private static final String HUANG = "黄";


    public static List<Map<String,Object>> getData(List<String> data){

        List<Map<String,Object>> list = new ArrayList<>();
        
        for (int i=0;i<data.size();i++){
            list.add(getMap(data.get(i)));
        }

        return list;
    }
    
    private static Map<String,Object> getMap(String data){
        Map<String, Object> map = new HashMap<>();
        switch (data){
            case BAI_SE:
                map.put("ivLogo", R.drawable.car_bai);
                break;
            case BAI:
                map.put("ivLogo", R.drawable.car_bai);
                break;
            case HUI_SE:
                map.put("ivLogo", R.drawable.car_hui);
                break;
            case HUANG_SE:
                map.put("ivLogo", R.drawable.car_huang);
                break;
            case HUANG:
                map.put("ivLogo", R.drawable.car_huang);
                break;
            case FEN_SE:
                map.put("ivLogo", R.drawable.car_fen);
                break;
            case HONG_SE:
                map.put("ivLogo", R.drawable.car_hong);
                break;
            case ZI_SE:
                map.put("ivLogo", R.drawable.car_zi);
                break;
            case LV_SE:
                map.put("ivLogo", R.drawable.car_lv);
                break;
            case LAN_SE:
                map.put("ivLogo", R.drawable.car_lan);
                break;
            case LAN:
                map.put("ivLogo", R.drawable.car_lan);
                break;
            case ZONG_SE:
                map.put("ivLogo", R.drawable.car_zong);
                break;
            case HEI_SE:
                map.put("ivLogo", R.drawable.car_hei);
                break;
            case HEI:
                map.put("ivLogo", R.drawable.car_hei);
                break;
                default:
                    map.put("ivLogo",R.drawable.car_bai);
        }

        map.put("carColor", data);
        return map;
    }

}

OK,到这里应该没什么遗漏的了，网上的spinner基本都是写死的数据展示。

这里写个动态填充数据算是自己对知识的一种整理。