如何更改 Material 外露下拉菜单图标的位置和背景？

Question

我正在使用 Exposed 下拉菜单作为微调器，并且想修改图标的各个方面。因为它是一个小微调器，所以箭头图标非常居中，我想将它移到右边。我也想改变它的背景，目前它就像“selectableItemBackgroundBorderless”，我想将它设置为空。

这是我的代码：

            <com.google.android.material.textfield.TextInputLayout
                android:id="@+id/myTeamFormationSpinner"
                style="@style/CustomExposedDropMenu"
                android:layout_width="80sp"
                android:layout_height="30sp"
                android:layout_below="@id/myTeamTableData"
                android:layout_alignParentEnd="true">

                <AutoCompleteTextView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:inputType="none" />
            </com.google.android.material.textfield.TextInputLayout>

    <style name="CustomExposedDropMenu" parent="Widget.MaterialComponents.TextInputLayout.FilledBox.ExposedDropdownMenu">
        <item name="boxBackgroundColor">@color/black</item>
        <item name="counterTextColor">@color/grayish_white</item>
        <item name="boxStrokeColor">@null</item>
        <item name="endIconTint">@color/grayish_white</item>
        <item name="boxCornerRadiusTopStart">7sp</item>
        <item name="boxCornerRadiusBottomStart">7sp</item>
        <item name="boxCornerRadiusTopEnd">7sp</item>
        <item name="boxCornerRadiusBottomEnd">7sp</item>
        <item name="boxStrokeWidth">0sp</item>
        <item name="boxStrokeWidthFocused">0sp</item>
    </style>

Answer 1

位置

您无法控制原始下拉列表 icon 的位置，唯一的方法是禁用默认 icon 并将您自己的添加到下拉列表中。

首先，通过将 Spinner 的 background 设置为 @null 来禁用默认下拉图标：

<Spinner
     android:id="@+id/spinner_main"
     android:spinnerMode="dropdown"
     android:background="@null"
     android:layout_width="wrap_content"
     android:layout_height="match_parent"/>

然后创建布局资源spinner_item_main.xml，只有一个TextView，我们可以在其右侧设置一个drawable（从here下载箭头图片或使用你自己的。):

<TextView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textSize="20sp"
    android:textStyle="bold"
    android:gravity="left"
    android:textColor="@color/colorWhite"
    android:drawableRight="@drawable/ic_arrow_drop_down_white_24dp"
    />

最后在初始化Spinner时设置这个layout resource，你也可以提供一个resource作为dropdownView（就像我所做的那样）：

ArrayAdapter adapter = new ArrayAdapter<Category>(this,R.layout.spinner_item_main,objects); // creates new ArrayAdapter with custom textviews for all elements including the first one (which is what we want)
    adapter.setDropDownViewResource(R.layout.spinner_dropdown_view_main); // Modifies all the elements when you click on the dropdown
    spinner.setAdapter(adapter); // sets the adapter to the spinner

使用 TextView 中的属性 padding 可以调整箭头和文本之间的 space。还有你的 image resource 尺码本身。

背景颜色

在您的 spinner_item_main.xml 中定义 RelativeLayout 的 background:color，例如包括 Spinner。因此，您可以尽可能自定义调整所有内容。

如何更改 Material 外露下拉菜单图标的位置和背景？

How can I change the position and background of the Material Exposed dropdown menu icon?

android

android-layout