Android Studio Spinner自定义背景及右边下拉的图标

Posted 2023-03-31 Xinmer.Francis

先上效果图：

 一、测试环境

1、android SDK版本: Android 12.0(S)  Version31

2、Gradle版本： JDK11.0.13

二、在自己的android项目中实现

1、在drawable目录下新建spinner_border.xml文件，内容如下：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 第一组item：设置Spinner背景边框 -->
    <item>
        <shape>
            <stroke
                android:width="1dp"
                android:color="#9ebdf1">
            </stroke>
            <corners android:radius="5dp" />
            <!-- 设置背景颜色 -->
            <solid android:color="#004686f2" />
            <padding
                android:bottom="5dp"
                android:left="5dp"
                android:right="5dp"
                android:top="5dp" >
            </padding>
        </shape>
    <!-- 第二组item：设置spinner箭头图片 -->
    </item>
    <item>
        <bitmap
            android:gravity="end"
            android:src="@drawable/spinner_more">
        </bitmap>
    </item>
</layer-list>

相信大家随便查找都能得到类似的代码，但是如何建立在自己的项目上却没那么容易，所以本次文章要说的关键是对于资源文件@drawable/spinner_more文件的由来，以及细节问题。

2、导入资源文件方便.xml引用

在drawable文件上右键，选择new-->Image Asset，如下图：

 打开Image Asset配置文件，如我下图进行选择：

注意：Padding基本跟图片缩放差不多，调整到适合自己控件大小的位置，请自行测试；

Name就是你在.xml文件中引用的名字，可自行修改；

完成后Next,Finished即可

三、项目中定义Spinner，直接使用     android:background="@drawable/spinner_border"
即可，如下：

<Spinner
     android:id="@+id/adb"
     android:layout_width="0dp"
     android:layout_height="42dp"
     android:background="@drawable/spinner_border"
     android:layout_weight="2"
     android:entries="@array/addressType"
     android:gravity="center"
     android:hapticFeedbackEnabled="false" />

代码源文件以及图片全部放在这里了：

AndroidStudio自定义Spinner背景图及代码文件-Android文档类资源-CSDN文库

Android中Spinner下拉列表（使用ArrayAdapter和自定义Adapter实现） .

今天学习了Spinner组件，使用Spinner相当于从下拉列表中选择项目，下面演示一下Spinner的使用(分别使用ArrayAdapter和自定义Adapter实现)

（一）:使用ArrayAdapter进行适配数据:

   ①:首先定义一个布局文件:

<span style="font-size:16px;"><?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <Spinner
        android:id="@+id/spinner1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
      />
</LinearLayout></span>

  【注意:】上面的Spinner有两个属性1:prompt是初始的时候，Spinner显示的数据，是一个引用类型   2:entries是直接在xml布局文件中绑定数据源（可以不设置，即可以在Activity中动态绑定） 

         ②:建立数据源，使用数组,这些数据将会在Spinner下来列表中进行显示:

<span style="font-size:16px;"><?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="spinnername">
        <item>北京</item>
        <item>上海 </item>
        <item>广州</item>
        <item>深圳</item>
    </string-array>
</resources></span>

  ③:接着在Activity中加入如下的代码(使用了系统定义的下拉列表的布局文件，当然也可以自定义)

               // 初始化控件
		mSpinner = (Spinner) findViewById(R.id.spinner1);
		// 建立数据源
		String[] mItems = getResources().getStringArray(R.array.spinnername);
		// 建立Adapter并且绑定数据源
		ArrayAdapter<String> _Adapter=new ArrayAdapter<String>(this,android.R.layout.simple_spinner_item, mItems);
		//绑定 Adapter到控件
		mSpinner.setAdapter(_Adapter);

以上代码初步完成，看下运行效果:

    下面是关于Spinner的点击事件(效果图如上图):

        mSpinner.setOnItemSelectedListener(new OnItemSelectedListener() {
			@Override
			public void onItemSelected(AdapterView<?> parent, View view,
					int position, long id) {
				String str=parent.getItemAtPosition(position).toString();
				Toast.makeText(SpinnerActivity.this, "你点击的是:"+str, 2000).show();
			}
			@Override
			public void onNothingSelected(AdapterView<?> parent) {
				// TODO Auto-generated method stub
			}
		});

       （二）使用自定义的Adapter(重点)

           ①:定义每一个Item的布局文件

<?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" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:drawableLeft="@drawable/ic_launcher"
        android:paddingRight="8dip"
        android:paddingTop="8dip"
        android:text="TextView"
        android:textSize="25sp" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingLeft="8dip"
        android:paddingTop="8dip"
        android:text="TextView"
        android:textSize="25sp" />

</LinearLayout>

        ②:建立Person类：

package com.jiangqq.csdn;
public class Person {
	private String personName;
	private String personAddress;
	public Person(String personName, String personAddress) {
		super();
		this.personName = personName;
		this.personAddress = personAddress;
	}
	public String getPersonName() {
		return personName;
	}
	public void setPersonName(String personName) {
		this.personName = personName;
	}
	public String getPersonAddress() {
		return personAddress;
	}
	public void setPersonAddress(String personAddress) {
		this.personAddress = personAddress;
	}

}

     ③:创建MyAdapter继承与BaseAdapter,进行适配:

package com.jiangqq.csdn;

import java.util.List;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.TextView;

/**
 * 自定义适配器类
 * @author jiangqq  <a href=http://blog.csdn.net/jiangqq781931404></a>
 *
 */
public class MyAdapter extends BaseAdapter {
	private List<Person> mList;
	private Context mContext;

	public MyAdapter(Context pContext, List<Person> pList) {
		this.mContext = pContext;
		this.mList = pList;
	}

	@Override
	public int getCount() {
		return mList.size();
	}

	@Override
	public Object getItem(int position) {
		return mList.get(position);
	}

	@Override
	public long getItemId(int position) {
		return position;
	}
    /**
     * 下面是重要代码
     */
	@Override
	public View getView(int position, View convertView, ViewGroup parent) {
		LayoutInflater _LayoutInflater=LayoutInflater.from(mContext);
		convertView=_LayoutInflater.inflate(R.layout.item, null);
		if(convertView!=null)
		{
			TextView _TextView1=(TextView)convertView.findViewById(R.id.textView1);
			TextView _TextView2=(TextView)convertView.findViewById(R.id.textView2);
			_TextView1.setText(mList.get(position).getPersonName());
			_TextView2.setText(mList.get(position).getPersonAddress());
		}
		return convertView;
	}
}

④:在Activity中加入如下代码:

                   // 初始化控件
			mSpinner = (Spinner) findViewById(R.id.spinner1);
			// 建立数据源
		    List<Person>  persons=new ArrayList<Person>();
			persons.add(new Person("张三", "上海 "));
			persons.add(new Person("李四", "上海 "));
			persons.add(new Person("王五", "北京" ));
			persons.add(new Person("赵六", "广州 "));
			//  建立Adapter绑定数据源
			MyAdapter _MyAdapter=new MyAdapter(this, persons);
			//绑定Adapter
			mSpinner.setAdapter(_MyAdapter);

运行效果如下截图: