在 Android 中，如何按照材料设计文档的规定创建一个概述的下拉菜单（微调器）？ [关闭]
Posted
技术标签:
【中文标题】在 Android 中，如何按照材料设计文档的规定创建一个概述的下拉菜单（微调器）？ [关闭]【英文标题】：In Android, how to create an outlined dropdown menu (spinner) as specified by the material design documentation? [closed] 【发布时间】：2019-05-29 00:29:45 【问题描述】：材料设计文档mentions 关于概述的下拉菜单，如下所示：
如何在我的 android 应用中创建它？换句话说，我想创建一个顶部有轮廓和提示的微调器。
【问题讨论】：
对不起，我最初误解了这个问题。如果您从 Material 主题继承，那么您的微调器应该自动正确。如果您正在考虑将其自定义为与上面完全相同，那么我建议您使用 this question 作为起点 也相关：***.com/questions/26798601/… @MichaelDodd 谢谢。是的，这可能是我最后的手段。但是，如果这种设计是由谷歌推广的，我的直觉是它应该很容易使用。让我尝试将默认微调器与 AppCompat 一起使用。我会更新你。 另一个潜在的选择，虽然这更适用于TextInputLayout 而不是 Spinners，但值得一看：***.com/questions/53198894/…
我试过了，香草微调器没有这个用户界面。 TextInputLayout 是我现在正在尝试的。
【参考方案1】：
他们更新了材料设计库：
<com.google.android.material.textfield.TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu"
android:layout_
android:layout_
android:hint="@string/hint_text">
<com.google.android.material.textview.MaterialAutoCompleteTextView
android:id="@+id/filled_exposed_dropdown"
android:layout_
android:layout_/>
</com.google.android.material.textfield.TextInputLayout>
这是链接：https://material.io/develop/android/components/menu/
【讨论】：
这样做的工作让任何人都放弃了这一点。将适配器放在TextInputLayout 上？ WTF，谷歌...
@Giovanne 适配器附加到 AutoCompleteTextView，而不是 TextInputLayout。
目前，您必须使用com.google.android.material.textfield.MaterialAutoCompleteTextView 而不是com.google.android.material.textview.MaterialAutoCompleteTextView【参考方案2】：
嗯，到目前为止还没有正式的库发布。所以，你必须自定义创建它。我的看起来像这个附加的图像。我已经做了一些简单的步骤。
第 1 步： 添加一个形状_
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@android:color/transparent"/>
<stroke android: android:color="#424242" />
<corners android:radius="3dip"/>
<padding android:left="0dip"
android:top="0dip"
android:right="0dip"
android:bottom="0dip" />
您可以从这里轻松更改笔触颜色。
第 2 步：设计微调器 _
<RelativeLayout
android:id="@+id/lyGiftList"
android:layout_
android:layout_
android:layout_below="@id/lyPhysicianList"
android:layout_marginLeft="@dimen/_5sdp"
android:layout_marginTop="@dimen/_5sdp"
android:layout_marginRight="@dimen/_5sdp">
<LinearLayout
android:layout_
android:layout_
android:layout_margin="@dimen/_3sdp"
android:layout_weight="8"
android:orientation="horizontal"
android:background="@drawable/border"
tools:ignore="UselessParent">
<Spinner
android:id="@+id/spnGift"
android:layout_
android:layout_
android:overlapAnchor="false"
android:spinnerMode="dropdown" />
</LinearLayout>
<TextView
android:layout_
android:layout_
android:layout_marginLeft="@dimen/_9sdp"
android:layout_marginTop="-5dp"
android:background="@color/colorLightGrey"
android:paddingLeft="@dimen/_3sdp"
android:paddingRight="@dimen/_3sdp"
android:text="@string/gift"
android:textColor="@color/colorDarkGrey" />
</RelativeLayout>
如果你想让你的微调器选择的文本颜色是别的颜色，你可以从代码中做到这一点。
@Override
public void onItemSelected(AdapterView<?> parent, View view, int position, long id)
((TextView) view).setTextColor(ContextCompat.getColor(MainActivity.this, R.color.colorAccent));
【讨论】：
【参考方案3】：我试着用下面的边框制作它。
在活动中设置微调器
<LinearLayout
android:layout_centerInParent="true"
android:background="@drawable/border"
android:layout_ android:layout_ tools:ignore="UselessParent">
<Spinner
android:id="@+id/spinner1"
android:layout_
android:backgroundTint="#ff0000"
android:overlapAnchor="false"
android:layout_
android:spinnerMode="dropdown"/>
</LinearLayout>
在drawable中创建border.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#80ffffff"/>
<stroke android: android:color="#ff0000" />
<corners android:radius="3dip"/>
<padding android:left="0dip" android:top="0dip" android:right="0dip" android:bottom="0dip" />
并以您想要的任何方式填充它。
val items = arrayOf("NM", "NY", "NC", "ND")
val adapter = ArrayAdapter(this, android.R.layout.simple_spinner_dropdown_item, items)
spinner1.adapter = adapter
我不知道如何给微调器添加标题。
结果看起来像这样。
稍作调整，我认为您可以创建您想要的内容。
【讨论】：
感谢您的回答。这是一个很好的第二个解决方案。但是，我正在寻找一种更直接的方法来做到这一点。我想依赖Android的官方支持设计库。如果你能帮助我，那就太棒了 嗯，我试试！【参考方案4】：结果：
下面的完整工作代码：
-
布局
<com.google.android.material.textfield.TextInputLayout
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox"
android:layout_
android:layout_
android:hint="Hello"
>
<EditText
android:id="@+id/editText"
android:layout_
android:layout_
android:clickable="true"
android:cursorVisible="false"
android:focusable="false"
android:focusableInTouchMode="false"
android:importantForAutofill="no"
/>
</com.google.android.material.textfield.TextInputLayout>
-
活动/片段
editText.setOnClickListener
PopupMenu(context!!, editText).apply
menuInflater.inflate(R.menu.menu_in_transaction, menu)
setOnMenuItemClickListener item ->
editText.setText(item.title)
true
show()
-
菜单
<?xml version="1.0" encoding="utf-8"?>
<menu
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/type1"
android:title="Type 1"
/>
<item
android:id="@+id/type2"
android:title="Type 2"
/>
</menu>
【讨论】：
【参考方案5】：如果不起作用，请添加此<androidx.appcompat.widget.AppCompatAutoCompleteTextView
<com.google.android.material.textfield.TextInputLayout
android:layout_
android:layout_
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu">
<androidx.appcompat.widget.AppCompatAutoCompleteTextView
android:id="@+id/gender"
android:layout_
android:layout_
android:hint="Gender"/>
</com.google.android.material.textfield.TextInputLayout>
【讨论】：
【参考方案6】：要创建轮廓框菜单微调器，您需要遵循的步骤是：
1.在名为drawable_spinner_border.xml的drawable文件夹中创建一个drawable文件
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#ffffff"/>
<corners android:radius="5dp"/>
<stroke android:
android:color="#797979"/>
</shape>
2.在Layout文件夹下创建layout_custom_spinner.xml，您可以根据需要更改文本和id。
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/fragment_qc_flSelectWorkDone"
android:layout_
android:layout_>
<FrameLayout
android:layout_marginTop="6dp"
android:background="@drawable/drawable_spinner_border"
android:layout_
android:layout_>
<Spinner
android:layout_marginTop="5dp"
android:id="@+id/fragment_qc_spSelectWorkDone"
android:layout_
android:textSize="12sp"
android:spinnerMode="dropdown"
android:layout_/>
</FrameLayout>
<TextView
android:paddingStart="2dp"
android:paddingEnd="2dp"
android:layout_marginStart="10dp"
android:layout_marginBottom="15dp"
android:textSize="9sp"
android:text="Select Work Done"
android:background="#FFFFFF"
android:layout_
android:layout_/>
</FrameLayout>
【讨论】：
暂时不支持，谢谢建议。【参考方案7】：根据android的material design github repository，这是计划中的（这意味着他们仍然会开始工作） 您找不到直接的方法来实现这一点。
【讨论】：
以上是关于在 Android 中，如何按照材料设计文档的规定创建一个概述的下拉菜单（微调器）？ [关闭]的主要内容，如果未能解决你的问题，请参考以下文章
如何在 android 中删除 EditText 材料设计底线？