Android：为Spinner设置不同的标题布局与下拉列表布局

这个需求其实很好实现，核心就是利用SpinnerAdapter的两个关键方法，分别定义选中时的标题视图和下拉展开后的条目视图。我给你一步步拆解具体实现：

1. 先准备两个布局文件 #

你需要分别创建标题布局（纯文本）和下拉项布局（带图+文字）：

标题布局 spinner_title_layout.xml #

这是ActionBar里Spinner选中时显示的纯文本布局：

<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tv_title"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="16dp"
    android:textSize="18sp"
    android:textColor="@android:color/black"
    android:gravity="center_vertical"/>

下拉项布局 spinner_dropdown_item_layout.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:padding="12dp"
    android:orientation="horizontal"
    android:gravity="center_vertical">

    <ImageView
        android:id="@+id/iv_icon"
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:marginEnd="12dp"/>

    <TextView
        android:id="@+id/tv_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textSize="16sp"/>
</LinearLayout>

2. 修改你的SpinnerAdapter #

关键是重写getView()和getDropDownView()两个方法：

• getView()：返回Spinner选中时显示的标题视图
• getDropDownView()：返回下拉列表里的每个条目视图

假设你的dummyLists是自定义数据类MyItem的列表（包含name和imageResId字段），修改后的Adapter代码如下：

private class SpinnerAdapter extends BaseAdapter {
    private Context mContext;
    private List<MyItem> mItemList;

    // 构造方法
    public SpinnerAdapter(Context context, List<MyItem> itemList) {
        mContext = context;
        mItemList = itemList;
    }

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

    @Override
    public MyItem getItem(int position) {
        return mItemList.get(position);
    }

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

    // 处理选中状态的标题视图
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        TitleViewHolder titleHolder;
        if (convertView == null) {
            // 加载标题布局
            convertView = LayoutInflater.from(mContext).inflate(R.layout.spinner_title_layout, parent, false);
            titleHolder = new TitleViewHolder();
            titleHolder.titleTv = convertView.findViewById(R.id.tv_title);
            convertView.setTag(titleHolder);
        } else {
            titleHolder = (TitleViewHolder) convertView.getTag();
        }
        // 设置标题文本
        MyItem currentItem = getItem(position);
        titleHolder.titleTv.setText(currentItem.getName());
        return convertView;
    }

    // 处理下拉列表的条目视图
    @Override
    public View getDropDownView(int position, View convertView, ViewGroup parent) {
        DropDownViewHolder dropDownHolder;
        if (convertView == null) {
            // 加载下拉项布局
            convertView = LayoutInflater.from(mContext).inflate(R.layout.spinner_dropdown_item_layout, parent, false);
            dropDownHolder = new DropDownViewHolder();
            dropDownHolder.iconIv = convertView.findViewById(R.id.iv_icon);
            dropDownHolder.nameTv = convertView.findViewById(R.id.tv_name);
            convertView.setTag(dropDownHolder);
        } else {
            dropDownHolder = (DropDownViewHolder) convertView.getTag();
        }
        // 设置下拉项的图片和文字
        MyItem currentItem = getItem(position);
        dropDownHolder.iconIv.setImageResource(currentItem.getImageResId());
        dropDownHolder.nameTv.setText(currentItem.getName());
        return convertView;
    }

    // 标题布局的ViewHolder
    private class TitleViewHolder {
        TextView titleTv;
    }

    // 下拉项布局的ViewHolder
    private class DropDownViewHolder {
        ImageView iconIv;
        TextView nameTv;
    }
}

3. 原有的使用代码保持不变 #

你在Main.java里的初始化代码不需要修改，直接用就行：

SpinnerAdapter spinnerAdapter = new SpinnerAdapter(this, dummyLists);
mMyListsSpinner.setAdapter(spinnerAdapter);

额外说明 #

如果你的Spinner是通过ActionBar的导航模式（ActionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_LIST)）设置的，这个方案同样适用，因为底层还是依赖SpinnerAdapter来渲染视图的。

内容的提问来源于stack exchange，提问作者elanonrigby