使用TextInputLayout的材料设计微调器。OutlinedBox样式

Question

我目前正在使用材质设计文本InputLayout OutlineBox，如下所示：

        <android.support.design.widget.TextInputLayout
            style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <android.support.design.widget.TextInputEditText
                android:id="@+id/myEditText"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:hint="Title"
                android:inputType="text"/>

        </android.support.design.widget.TextInputLayout>

我试图添加一个下拉框微调在我的TextInputEditText下，并希望保持相同的样式：OutlinedBox。

我看到材料设计、材料设计文本字段似乎支持下拉列表。如此处显示的区域：

我目前正在使用微调器生成下拉列表。

        <Spinner
            style="@style/Widget.AppCompat.Spinner.DropDown"
            android:id="@+id/option"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:dropDownWidth="match_parent" />

在OutlinedBox设计之后添加下拉列表似乎是不可能的。有没有一个库可以让我实现这一点，或者有没有更好的方法在Materials Design中实现这一点？

Answer 1

我认为本文档根本没有显示微调器。我认为它显示了一个带有下拉图标的文本输入布局。

在解剖学部分的图标部分，它说

5.下拉图标

下拉箭头指示文本字段具有嵌套的选择组件。

现在，你如何提供“嵌套选择组件”我不确定。。。

Answer 2

只需将材质组件库中包含的TextInputLayout与style小部件一起使用即可。材料组件。文本输入布局。大纲框。ExposedDropdownMenu。

比如：

  <com.google.android.material.textfield.TextInputLayout
      style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu"
      android:hint="Hint text"
      ...>

    <AutoCompleteTextView
        android:id="@+id/outlined_exposed_dropdown_editable"
        .../>
  </com.google.android.material.textfield.TextInputLayout>

Answer 3

我假设你想在TextInputLayout中有一个公开的下拉菜单，我也有同样的问题，你可以在TextInputLayout中使用AutoCompleteTextView，如下所示在XML中。下面是我如何处理这个问题的一个例子。

<LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:paddingRight="30dp"
            android:paddingEnd="30dp"
            tools:ignore="RtlSymmetry"
            android:layout_margin="5dp">

            <ImageView
                android:layout_width="30dp"
                android:layout_margin="10dp"
                android:layout_height="match_parent"
                app:srcCompat="@drawable/ic_location_city_black_24dp"
                android:layout_gravity="center"
                />




        <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="Type"
            android:orientation="horizontal"
            >



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

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


        </LinearLayout>

    </LinearLayout>

您还需要一个项目布局资源来填充下拉式弹出窗口。下面的示例提供了遵循材质设计指南的布局。

res/布局/dropdown_menu_popup_item.xml

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

在您的类中，根据您想要的内容添加以下代码。

String[] type = new String[] {"Bed-sitter", "Single", "1- Bedroom", "2- Bedroom","3- Bedroom"};

        ArrayAdapter<String> adapter =
                new ArrayAdapter<>(
                        this,
                        R.layout.dropdown_menu_popup_item,
                        type);

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

Incase这无助于在材料设计页面中检查Expose Dropdown Menus。[https://material.io/develop/android/components/menu/][1]

这是我关于堆栈溢出的第一个答案，希望能有所帮助。