Android 好用的下拉控件Spinner

一、参考

1、android Spinner控件详解
2、最新Spinner用法详解

二、实例

1、普通的spinner用法及在string-array中的数据加载，此UI是在MD风格下，在不同Theme下其实是有不同UI展示，也可选择下拉模式是：dropdown或者dialog，默认是dropdown的

1-2.png

布局：

2、接下来变化下样式：1、数据变化 2、选中后填充文字居中变红 3、下拉文字居中变绿 4、各种宽度高度控制等

注意：在ArrayAdapter中加载的自定义布局必须是textview，否则会报异常：ArrayAdapter requires the resource ID to be a TextView

1-3.png

1-4.png

代码：

/**
     * Spinner自定义样式
     * 1、Spinner内的TextView样式：item_select
     * 2、Spinner下拉中每个item的TextView样式：item_drop
     * 3、Spinner下拉框样式，属性设置
     * */
    public void ChangeSpinner(View v){
        mSpinnerSimple.setDropDownWidth(400); //下拉宽度
        mSpinnerSimple.setDropDownHorizontalOffset(100); //下拉的横向偏移
        mSpinnerSimple.setDropDownVerticalOffset(100); //下拉的纵向偏移
        //mSpinnerSimple.setBackgroundColor(AppUtil.getColor(instance,R.color.wx_bg_gray)); //下拉的背景色
        //spinner mode ： dropdown or dialog , just edit in layout xml
        //mSpinnerSimple.setPrompt("Spinner Title"); //弹出框标题，在dialog下有效


        String[] spinnerItems = {"10","200","400"};
        //自定义选择填充后的字体样式
        //只能是textview样式，否则报错：ArrayAdapter requires the resource ID to be a TextView
        ArrayAdapter spinnerAdapter = new ArrayAdapter<>(instance,
                R.layout.item_select, spinnerItems);
        //自定义下拉的字体样式
        spinnerAdapter.setDropDownViewResource(R.layout.item_drop);
        //这个在不同的Theme下，显示的效果是不同的
        //spinnerAdapter.setDropDownViewTheme(Theme.LIGHT);
        mSpinnerSimple.setAdapter(spinnerAdapter);
    }

布局：item_select.xml

布局：item_drop.xml

3、spinner布局中设置各种属性，实现效果，并增加监听，监听注意是AdapterView.OnItemSelectedListener是这个哦，监听里面的回调返回值各个意义在代码注释中，默认来说简单的加载布局就两个：android.R.layout.simple_spinner_item----android.R.layout.simple_spinner_dropdown_item

2-2.png

布局：

代码：这里会有选择监听

/**
     * 测试：加载数据列，监听选择
     * */
    private void testSpinner1(){
        //原始string数组
        final String[] spinnerItems = {"张三","李四","王二麻子"};
        //简单的string数组适配器：样式res，数组
        ArrayAdapter spinnerAdapter = new ArrayAdapter<>(instance,
                android.R.layout.simple_spinner_item, spinnerItems);
        //下拉的样式res
        spinnerAdapter.setDropDownViewResource(android.R.layout.simple_spinner_dropdown_item);
        //绑定 Adapter到控件
        mSpinner1.setAdapter(spinnerAdapter);
        //选择监听
        mSpinner1.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            //parent就是父控件spinner
            //view就是spinner内填充的textview,id=@android:id/text1
            //position是值所在数组的位置
            //id是值所在行的位置，一般来说与positin一致
            @Override
            public void onItemSelected(AdapterView parent, View view,
                                       int pos, long id) {
                LogUtil.i("onItemSelected : parent.id="+parent.getId()+
                        ",isSpinnerId="+(parent.getId() == R.id.spinner_1)+
                        ",viewid="+view.getId()+ ",pos="+pos+",id="+id);
                ToastUtil.showShort(instance,"选择了["+spinnerItems[pos]+"]");
                //设置spinner内的填充文字居中
                //((TextView)view).setGravity(Gravity.CENTER);
            }
            @Override
            public void onNothingSelected(AdapterView parent) {
                // Another interface callback
            }
        });
    }

4、完全自定义的spinner：基本上全是代码实现了，自定义adapter绑定List和dropdown布局文件，然后spinner加载adapter适配器

3-1.png

3-2.png

代码：

//CarBean就不贴出来了
/**
     * Spinner完全自定义UI和绑定数据
     * */
    private void testSpinnerSelf(){
        ArrayList cars = new ArrayList<>();
        CarBean car = new CarBean();
        car.setBrand("玛莎拉蒂");
        car.setOwner("张三");
        car.setCost("100万");
        cars.add(car);
        car = new CarBean();
        car.setBrand("宝马");
        car.setOwner("李四");
        car.setCost("53万");
        cars.add(car);

        final CarAdapter adapter = new CarAdapter(instance,cars);
        mSpinnerSelf.setAdapter(adapter);
        mSpinnerSelf.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView parent, View view, int pos, long id) {
                ToastUtil.showShort(instance,((CarBean)adapter.getItem(pos)).toString());
            }
            @Override
            public void onNothingSelected(AdapterView parent) {
            }
        });
    }

代码：CarAdapter

public class CarAdapter extends BaseAdapter {
    private Context ctx;
    private LayoutInflater li;
    private ArrayList dataList;

    public CarAdapter(Context ctx,ArrayList dataList) {
        this.ctx = ctx;
        this.li = LayoutInflater.from(ctx);
        this.dataList = dataList;
    }
    
    @Override
    public int getCount() {
        return dataList.size();
    }

    @Override
    public CarBean getItem(int position) {
        return dataList.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(final int position, View convertView, ViewGroup parent) {
        if (convertView == null) {
            convertView = View.inflate(ctx, R.layout.item_car, null);
            new ViewHolder(convertView);
        } 
        ViewHolder holder = (ViewHolder) convertView.getTag();// get convertView's holder
        
        holder.car_brand.setText(getItem(position).getBrand());
        holder.car_owner.setText(getItem(position).getOwner());
        holder.car_cost.setText(getItem(position).getCost());
        
        return convertView;
    }

     class ViewHolder {
        TextView car_brand;
        TextView car_owner;
        TextView car_cost;

        
        public ViewHolder(View convertView){
            car_brand = (TextView) convertView.findViewById(R.id.tv_car_brand);
            car_owner = (TextView) convertView.findViewById(R.id.tv_car_owner);
            car_cost = (TextView) convertView.findViewById(R.id.tv_car_cost);
            convertView.setTag(this);//set a viewholder
        }
    }


}

布局文件：item_car.xml，会发现，在spinner选中结果填充控件和dropdown下拉控件上都用的是此布局

2018年第一篇，感觉写的简单，希望各位看官喜欢。