Android控件 自定义Spinner微调框

微调框提供了一种方法，可让用户从值集内快速选择一个值。默认状态下，微调框显示其当前所选的值。轻触微调框可显示下拉菜单，其中列有所有其他可用值，用户可从中选择一个新值。

一、使用 XML 代码设置 Spinner

在 values 文件夹中创建 array.xml 文件

<resources>
    <string-array name="spinner_array">
        <item>请选择</item>
        <item>动作</item>
        <item>科幻</item>
        <item>冒险</item>
		...
    </string-array>
</resources>

在布局中添加 Spinner 控件，使用 android:entries="@array/spinner_array"

        <Spinner
            android:id="@+id/spinner"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_vertical"
            android:layout_weight="3"
            android:background="@color/white"
            android:entries="@array/spinner_array" />

二、自定义 Spinner 布局和字体

Xml 代码示例，新建 spinner_item.xml 文件自定义 Spinner 内部的布局和字体。

<?xml version="1.0" encoding="utf-8"?>
<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:padding="4dp"
    android:paddingEnd="20dp"
    android:textSize="16sp"
    android:textColor="#00000F">
</TextView>

Java 代码示例，这里的mainBinding.spinner相当于findViewById的结果。

	//数据源
	String[] type = { "请选择", "动作", "科幻","冒险", "剧情", "喜剧","传记", "运动", "犯罪",
                "悬疑", "爱情", "动画", "奇幻", "惊悚", "恐怖"};
	//
	ArrayAdapter<String> adapter = new ArrayAdapter<>(this,
	        R.layout.spinner_item, type);
	
	mainBinding.spinner.setAdapter(adapter);
	//
	mainBinding.spinner.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
	    @Override
	    public void onItemSelected(AdapterView<?> parent, View view, int position, long id) {
	    	//获取按下位置的字符串
	        String str = parent.getItemAtPosition(position).toString();
	        //Toast.makeText(MainActivity.this, "" + spinnerContent, Toast.LENGTH_SHORT).show();
	    }
	
	    @Override
	    public void onNothingSelected(AdapterView<?> parent) {
	        //这里的作用就是菜单没有可选项的时候触发。例如一下操作
	        //data.removeAll(data);
	        //adapter.notifyDataSetChanged();
	    }
	});

三、自定义 Spinner 背景

在 drawble 文件夹中新建 Image Asset 作为 Spinner 的背景图片的图片。

Icon Type -> Action Bar and Tab Icons，选择自己喜欢的图片。

然后一定要把 ic_down 文件夹中的 ic_down.xml 文件给删除了！

在 drawble 中新建 style_spinner.xml 给 spinner 作为背景填充。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <layer-list>
            <item>
                <shape android:shape="rectangle">
                    <solid android:color="@color/black"/>
                    <corners android:radius="10dp"/>
                    <padding android:right="4dp"/>
                </shape>
            </item>
            <item>
                <bitmap android:src="@drawable/ic_down"
                    android:gravity="center|end"/>
            </item>
        </layer-list>
    </item>
</selector>

style_spinner.xml 文件生成的背景

然后到 layout 的 Spinner 控件引用为 background 即可

<Spinner
    ...
    android:background="@drawable/style_spinner"/>

当然，也可以参考上面给 Spinner 的弹出自定义背景图案，这里就不做示范了。简略来说就是创建 style 文件然后在 spinner_item.xml 中引用。

学习参考：Custom Spinner Android Studio
https://www.youtube.com/watchv=7MKgq1M0UEA&ab_channel=Academind

四、设置 Spinner 偏移量

使用setDropDownVerticalOffset方法设置 Spinner 弹出的位置

mainBinding.spinner.setDropDownVerticalOffset(78);
mainBinding.spinner.setDropDownHorizontalOffset(5);