使用 MDC 在 android 中创建 material 微调器下拉菜单

Creating a material spinner dropdown in android using MDC

我正在研究 Material 设计 Material.io 的 material 组件,一切都很好,我正在尝试使用 MDC 的 TextField 组件 创建一个 material 下拉微调器,但我似乎找不到任何相关文档,是否可以使用 MDC 创建一个微调器?如果是这样,我在哪里可以找到它的文档?

我在 TextField 的目录中看到了一个微调器,我可以做这样的事情吗?:

在 Material 设计网站上,它被标记为 Android 计划(Material Menus) I also noticed Material Design's Twitter feed 它刚刚针对 Web 发布。因此希望很快就会发布实际的实现。

这正是您所需要的

https://material.io/develop/android/components/menu/#exposed-dropdown-menus

首先在 Textinputlayout 中添加 AutocompleteTextView

<com.google.android.material.textfield.TextInputLayout
    style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.ExposedDropdownMenu"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:hint="@string/hint_text">

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

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

然后你可以这样设计菜单项:

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

初始化 java 中的适配器,例如:

String[] COUNTRIES = new String[] {"Item 1", "Item 2", "Item 3", "Item 4"};

ArrayAdapter<String> adapter =
        new ArrayAdapter<>(
            getContext(),
            R.layout.dropdown_menu_popup_item,
            COUNTRIES);

AutoCompleteTextView editTextFilledExposedDropdown =
    view.findViewById(R.id.filled_exposed_dropdown);
editTextFilledExposedDropdown.setAdapter(adapter);

您可以更改样式以满足各种变化,例如:

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

概述

将此样式应用于您的 TextInputLayout:

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

密集填充

将此样式应用于您的 TextInputLayout:

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

密集轮廓

将此样式应用于您的 TextInputLayout:

style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense.ExposedDropdownMenu"