1. Spinner 知识概要

Spinner下拉列表控件这样的案例。

    在实现这个案例之前,我们有必要来学习一下与 Spinner 相关的知识,查看它的api文档

android.widget.Spinner:它是一个显示子选项同时允许用户点击的视图控件。在Spinner中的这些选项都来自与这个视图关联的适配器中。


所以在这边我们需要一个关联Spinner视图的适配器,查看Spinner中的public void setAdapter (SpinnerAdapter adapter)方法[找不到往父类中找],如下所示图。

android tableLayout 下拉刷新 android下拉列表控件_控件



继续跟踪SpinnerAdapter,可以发现它是一个接口,它的直接实现类有以下几个如下图所示


android tableLayout 下拉刷新 android下拉列表控件_UI_02

所以我们只要创建一个类,继承它的子类就可以了,这里我们继承ArrayAdapter<T>适配器类:它是一个基于数组的适配器类,查看它的构造方法如下图:


android tableLayout 下拉刷新 android下拉列表控件_控件_03




在案例中我们需要选择第五种有接受一个 List<T> 泛型的对象

[说明]:适配器这个概念很像 MVC 模式特点,UI体现的就是表示层的概念,详细我们在 ListView 的使用方法中已经讲到了



2. 具体案例实现代码如下:

1) 布局文件

<?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="match_parent"
    android:orientation="vertical" >

    <Spinner
        android:id="@+id/spinner"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />

    <Spinner
        android:id="@+id/spinner2"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" />

</LinearLayout> 2) 
  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" >

    <ImageView
        android:id="@+id/imageview"
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:paddingLeft="10dp"
        android:src="@drawable/icon" />

    <TextView
        android:id="@+id/textview"
        android:layout_width="wrap_content"
        android:layout_height="fill_parent"
        android:gravity="center_vertical"
        android:paddingLeft="10dp"
        android:textSize="16dp" />

</LinearLayout> 3) 程序主要代码


SpinnerDemo.java

public class SpinnerDemo extends Activity {
    private Spinner spinner;
    private Spinner spinner2;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        initComponent();

        List<String> list = MyAdapter.getData();
        // 第二个参数表示填充的样式
        ArrayAdapter<String> adapter = new ArrayAdapter<String>(SpinnerDemo.this,
                android.R.layout.simple_spinner_item, list);
        spinner.setAdapter(adapter);

        List<Map<String, Object>> listMaps = MyAdapter.getListMap();

        // 这里面所显示内容的布局就是菜单里面第一个选项是一张图片,紧接着图片后面跟着就是一段文字
        SimpleAdapter simpleAdapter = new SimpleAdapter(SpinnerDemo.this, listMaps, R.layout.item,
                new String[] {
                        "ivLogo", "applicationName"
                }, new int[] {
                        R.id.imageview, R.id.textview
                });
        spinner2.setAdapter(simpleAdapter);

        // 当用户去点击的时候,添加一个触发事件
        spinner2.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {

            // 当用户选中的时候触发
            @Override
            public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
                // TODO Auto-generated method stub
                String appName = ((Map<String, Object>) spinner2.getItemAtPosition(position))
                        .get("applicationName").toString(); // 得到当前选中的选项的位置
                setTitle(appName);

            }

            @Override
            public void onNothingSelected(AdapterView<?> parent) {
                // TODO Auto-generated method stub

            }
        });
    }

    private void initComponent() {
        spinner = (Spinner) findViewById(R.id.spinner);
        spinner2 = (Spinner) findViewById(R.id.spinner2);
    }
} 4) 适配器类


我们再新建一个包:com.android.adapter

public class MyAdapter {

    public MyAdapter() {
        // TODO Auto-generated constructor stub
    }
    
    public static List<String> getData(){
        
        List<String> list = new ArrayList<String>();
        list.add("北京");
        list.add("上海");
        list.add("广州");
        
        return list;
        
    }
    
    public static List<Map<String, Object>> getListMap(){
        
        List<Map<String, Object>> list = new ArrayList<Map<String,Object>>();
        
        Map<String, Object> map = new HashMap<String, Object>();      
        map.put("ivLogo", R.drawable.setting);
        map.put("applicationName", "设置");
        
        Map<String, Object> map2 = new HashMap<String, Object>();      
        map2.put("ivLogo", R.drawable.mms);
        map2.put("applicationName", "信息收取");
        
        list.add(map);
        list.add(map2);
        
        return list;
        
    }

}



3. 程序说明

SimpleAdapter 的这个类,查看这个类的api文档,可以知道:
android.widget.SimpleAdapter:
这是一个简单的适配器,它可以映射静态的数据到视图中,它是在一个xml文件中定义的,它是用一个ArrayList中嵌套一个Map形式来表示的,每一个在ArrayList中的选项都关联着一行的数据。 从它的用法可以看出 SimpleAdapter 可以用来作为图形文字混排的容器来使用,所以这里我们使用这个适配器,可以查看它的构造方法如下图定义所示:

android tableLayout 下拉刷新 android下拉列表控件_Spinner_04




第一个参数 上下文对象

第二个参数 需要填充的数据类型,采用的格式是 List<? extends Map<String, ?>> 数据类型

第三个参数 是要加载在xml文件需要显示的数据

第四个参数 作为ArrayList<Map<?,?>>中显示是标题

第五个参数 标题对应的R文件


5. 案例执行结果如下:

android tableLayout 下拉刷新 android下拉列表控件_控件_05