如何在自动完成暴露的下拉菜单上设置背景颜色？

Question

目前正在使用材料设计组件和菜单指南来设置公开的下拉菜单项。但是，当显示我的自动完成文本视图时，它的背景与其他文本字段不同。

我尝试将 TextInputLayout 上的 boxBackgroundColor 属性设置为不同的颜色，并修改自动完成 TextView 上的背景。我也厌倦了看看是否可以修改菜单的弹出主题，但没有运气。

 // In the onCreateView of fragment

        ArrayAdapter<String> adapter = new ArrayAdapter<>(getContext(), R.layout.dropdown_menu_popup_item, getResources().getStringArray(R.array.down_payment_method_selection));
        monthsAtEmploymentSelection.setAdapter(adapter);

<com.google.android.material.textfield.TextInputLayout
                style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.ExposedDropdownMenu"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginStart="8dp"
                android:layout_marginEnd="8dp"
                android:hint="@string/months_at_employment_hint"
                app:boxBackgroundColor="@color/white">

                <AutoCompleteTextView
                    android:id="@+id/months_at_employment_selection"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" />

            </com.google.android.material.textfield.TextInputLayout>

<!--dropdown_menu_popup_item.xml-->
<?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="wrap_content"
    android:padding="16dp"
    android:ellipsize="end"
    android:maxLines="1"
    android:textAppearance="?attr/textAppearanceSubtitle1"
    android:background="@color/white"/>

我希望背景是透明的或与当前设置为白色的背景相匹配。目前它是与字段不匹配的灰白色。

Answer 1

感谢这个问题，我了解到这可以通过编程来完成：

val autoCompleteTv = binding.yourAutoCompleteTextView
autoCompleteTv.setDropDownBackgroundDrawable(
        ColorDrawable(ContextCompat.getColor(context, R.color.your_desired_color))
)

Answer 2

通过在布局文件中的 TextInputLayout 字段上设置属性

app:boxBackgroundColor="@color/yourcolor"

应该可以正确修改背景颜色。

您可能还需要设置子元素

android:background="@null"

，在我的例子中，AutoCompleteTextView 才能正确遵循 boxBackgroundColor 属性。根据 documentation，您唯一需要设置子元素背景颜色的是使用 edittext 字段，但是我发现由于应用程序桥主题的设置方式，我需要使用自动完成视图来设置它。

Answer 3

您在 AutoCompleteTextView 中使用了

style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.ExposedDropdownMenu"

作为样式。

将 style.xml 中的浅灰色更改为您的特定颜色。

Answer 4

在 Material Design 3 中，您可以通过更改

boxBackgroundColor

的值来设置框的背景颜色：

    <com.google.android.material.textfield.TextInputLayout
        android:id="@+id/anesthesiaTypeSelectionLayout"
        style="@style/customDropDownMenuStyle"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="24dp"
        app:boxStrokeColor="@color/transparent"
        app:boxBackgroundColor="@color/redCustom"
        app:boxStrokeWidth="0dp"
        app:expandedHintEnabled="false"
        app:hintEnabled="false">

如果您想更进一步并为下拉项拥有相同的布局，那么您必须以编程方式使用数组适配器，如文档中所示：

    val items = listOf("Item 1", "Item 2", "Item 3", "Item 4")
    val adapter = ArrayAdapter(requireContext(), R.layout.list_item, items)
    (textField.editText as? AutoCompleteTextView)?.setAdapter(adapter)

您可以根据需要定义 list_item 的布局：

<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
android:ellipsize="end"
android:maxLines="1"
android:textAppearance="?attr/textAppearanceTitleMedium"/>

额外提示：1）使用 SimpleItems 比使用 arrayAdapter 提供的对项目布局的控制更少

2. 您可以通过编程将框文本设置为当前活动项目：

YourTextInputLayoutView.editText?.setText(items[0])