Android Spinner 下拉选项框

Android Spinner ( 列表选项框 ) 用于弹出一个列表让用户选择

Spinner

Spinner 继承自 AdapterView,也就是说它也通过 Adapter 来提供数据支持

Spinner 默认会选中第一个值,就是默认调用 spinner.setSection(0),我们也通过这个设置默认的选中值

另外,会触发一次 OnItemSelectedListener 事件,暂时没找到解决方法,下面折衷的处理是 添加一个boolean值,然后设置为 false,在 onItemSelected 时进行判断

  1. false 说明是默认触发的,不做任何操作
  2. true 的话则正常触发事件

创建一个 Spinner 的 XML 代码很简单

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

然后我们来看看它都有什么属性

Spinner 属性

属性 说明
android:dropDownHorizontalOffset 设置列表框的水平偏移距离
android:dropDownVerticalOffset 设置列表框的水平竖直距离
android:dropDownSelector 列表框被选中时的背景
android:dropDownWidth 设置下拉列表框的宽度
android:gravity 设置里面组件的对其方式
android:popupBackground 设置列表框的背景
android:prompt 设置对话框模式的列表框的提示信息(标题),只能够引用string.xml 中的资源id,而不能直接写字符串
android:spinnerMode 列表框的模式,有两个可选值:
dialog :对话框风格的窗口
dropdown :下拉菜单风格的窗口(默认)

可选属性

属性 说明
android:entries 使用数组资源设置下拉列表框的列表项目

现在,我们写一个 demo 来看看 Spinner 是什么运作的,对了,可以复用前面的 MsAdapter

先来看看最终效果

范例


  1. 创建一个 空的 Android 项目 cn.twle.android.Spinner

  2. 下载 /static/i/android/lol_hero.zip 解压并把所有的图片拖到 res/drawable 目录下

  3. 新建一个包 cn.twle.android.common 然后下载 /static/i/android/MsAdapter.java 放到该目录下

  4. 修改 strings.xml 添加几个字符串

    <resources>
        <string name="app_name">SpinnerDemo</string>
        <string name="scope_title">分段选择</string>
    </resources>
    
  5. res/values 创建一个数组文件 arrays.xml

    <?xml version="1.0" encoding="utf-8"?>
    <resources>
        <string-array name="data">
            <item>英勇青铜</item>
            <item>不屈白银</item>
            <item>荣耀黄金</item>
            <item>华贵铂金</item>
            <item>璀璨钻石</item>
            <item>超凡大师</item>
            <item>最强王者</item>
        </string-array>
    </resources>
    
  6. 修改 activity_main.xml 添加两个 Spinner

    <?xml version="1.0" encoding="utf-8" ?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:padding="5dp"
        tools:context=".MainActivity">
    
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="选择您的排位分段"
            android:textColor="#44BDED"
            android:textSize="18sp" />
    
        <Spinner
            android:id="@+id/scope"
            android:layout_width="match_parent"
            android:layout_height="64dp"
            android:entries="@array/data"
            android:prompt="@string/scope_title"
            android:spinnerMode="dialog" />
    
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            android:text="选择你的拿手英雄~"
            android:textColor="#F5684A"
            android:textSize="18sp" />
    
        <Spinner
            android:id="@+id/hero"
            android:layout_width="match_parent"
            android:layout_height="64dp" />
    
    </LinearLayout>
    
  7. 接下来添加 Spinner 的 item 的布局, 在 res/layout 目录下新建一个文件 spinner_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="match_parent"
        android:orientation="horizontal"
        android:padding="5dp">
    
        <ImageView
            android:id="@+id/icon"
            android:layout_width="48dp"
            android:layout_height="48dp"
            android:src="@drawable/lol_icon1" />
    
        <TextView
            android:id="@+id/name"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="15dp"
            android:text="德玛西亚"
            android:textSize="16sp" />
    
    </LinearLayout>
    
  8. 接着在 MainActivity.java 同一个目录下创建一个 HeroBean.java

    package cn.twle.android.spinner;
    
    public class HeroBean {
    
        private int icon;
        private String name;
    
        public HeroBean() {
        }
    
        public HeroBean(int icon, String name) {
            this.icon = icon;
            this.name = name;
        }
    
        public int getIcon() {
            return icon;
        }
    
        public String getName() {
            return name;
        }
    
        public void setIcon(int icon) {
            this.icon = icon;
        }
    
        public void seName(String name) {
            this.name = name;
        }
    }
    
  9. 修改 MainActivity.java 添加数据

    package cn.twle.android.spinner;
    
    import cn.twle.android.common.MsAdapter;
    import android.content.Context;
    import android.os.Bundle;
    import android.support.v7.app.AppCompatActivity;
    import android.view.View;
    import android.widget.AdapterView;
    import android.widget.Spinner;
    import android.widget.TextView;
    import android.widget.Toast;
    
    import java.util.ArrayList;
    
    public class MainActivity extends AppCompatActivity implements AdapterView.OnItemSelectedListener {
    
        private Spinner scope;
        private Spinner hero;
        private Context mContext;
    
        //判断是否为刚进去时触发 onItemSelected 的标志
    
        private boolean one_selected = false;
        private boolean two_selected = false;
        private ArrayList<HeroBean> mData = null;
        private MsAdapter mAdadpter = null;
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
    
            mContext = MainActivity.this;
            mData = new ArrayList<HeroBean>();
    
            bindViews();
        }
    
        private void bindViews() {
    
            scope = (Spinner) findViewById(R.id.scope);
            hero  = (Spinner) findViewById(R.id.hero);
    
            mData.add(new HeroBean(R.drawable.lol_icon1,"迅捷斥候:提莫(Teemo)"));
            mData.add(new HeroBean(R.drawable.lol_icon2,"诺克萨斯之手:德莱厄斯(Darius)"));
            mData.add(new HeroBean(R.drawable.lol_icon3,"无极剑圣:易(Yi)"));
            mData.add(new HeroBean(R.drawable.lol_icon4,"德莱厄斯:德莱文(Draven)"));
            mData.add(new HeroBean(R.drawable.lol_icon5,"德邦总管:赵信(XinZhao)"));
            mData.add(new HeroBean(R.drawable.lol_icon6,"狂战士:奥拉夫(Olaf)"));
    
            mAdadpter = new MsAdapter<HeroBean>(mData,R.layout.spinner_item) {
                @Override
                public void bindView(MsAdapter.ViewHolder holder, HeroBean obj) {
                    holder.setImageResource(R.id.icon,obj.getIcon());
                    holder.setText(R.id.name, obj.getName());
                }
            };
            hero.setAdapter(mAdadpter);
    
            scope.setOnItemSelectedListener(this);
            hero.setOnItemSelectedListener(this);
    
        }
    
        @Override
        public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
            switch (parent.getId()){
                case R.id.scope:
                    if(one_selected){
                        Toast.makeText(mContext,"您的分段是~:" + parent.getItemAtPosition(position).toString(),
                                Toast.LENGTH_SHORT).show();
                    }else
                        one_selected = true;
                    break;
                case R.id.hero:
                    if(two_selected){
                        TextView txt_name = (TextView) view.findViewById(R.id.name);
                        Toast.makeText(mContext,"您选择的英雄是~:" + txt_name.getText().toString(),
                                Toast.LENGTH_SHORT).show();
                    }else
                        two_selected = true;
                    break;
            }
        }
    
        @Override
        public void onNothingSelected(AdapterView<?> parent) {
    
        }
    }
    

Android 基础教程

关于   |   FAQ   |   我们的愿景   |   广告投放   |  博客

  简单教程,简单编程 - IT 入门首选站

Copyright © 2013-2022 简单教程 twle.cn All Rights Reserved.