В Android, как создать выделенное выпадающее меню (спиннер), как указано в документации по дизайну материала?
В проектной документации материала упоминается обведенное выпадающее меню, которое выглядит так:
Как создать это в моем приложении для Android? Другими словами, я хочу создать спиннер с контуром и подсказкой сверху.
Ответы
Ответ 1
Они обновили библиотеку дизайна материалов:
<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>
Это ссылка: https://material.io/develop/android/components/menu/
Ответ 2
Ну, нет официальных библиотек, выпущенных до сих пор. Итак, вы должны создать его на заказ. Мне кажется, что это прикрепленное изображение. Я сделал несколько простых шагов.
Шаг 1: Добавьте один shape_
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="@android:color/transparent"/>
<stroke android:width="1dip" 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_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@id/lyPhysicianList"
android:layout_marginLeft="@dimen/_5sdp"
android:layout_marginTop="@dimen/_5sdp"
android:layout_marginRight="@dimen/_5sdp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
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_width="match_parent"
android:layout_height="match_parent"
android:overlapAnchor="false"
android:spinnerMode="dropdown" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
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_width="wrap_content" android:layout_height="wrap_content" tools:ignore="UselessParent">
<Spinner
android:id="@+id/spinner1"
android:layout_width="wrap_content"
android:backgroundTint="#ff0000"
android:overlapAnchor="false"
android:layout_height="wrap_content"
android:spinnerMode="dropdown"/>
</LinearLayout>
Создать файл border.xml для рисования
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#80ffffff"/>
<stroke android:width="1dip" 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
Я не знаю, как поставить титр на спиннер.
Результат выглядит так.
Небольшие корректировки, и я думаю, что вы можете создать то, что вы ищете.
Ответ 4
Согласно репозиторию GitHub для проектирования материалов Android, он запланирован (что означает, что они все еще начнут работать над ним). Вы не можете найти прямой способ реализовать это.
Ответ 5
https://github.com/devdhar04/MaterialSpinner пожалуйста, используйте вышеуказанную библиотеку, вы можете достичь этого
Ответ 6
Для создания выделенного блэк-бланка меню необходимо выполнить следующие шаги:
-
Создайте файл для рисования в папке для рисования с именем drawable_spinner_border.xml
Ответ 7
Для создания выделенного блэк-бланка меню необходимо выполнить следующие шаги:
1. Создайте нарисованный файл в папке для рисования с именем drawable_spinner_border.xml
<?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:width="1dp"
android:color="#797979"/>
</shape>
2. Создайте layout_custom_spinner.xml в папке Layout, вы можете изменить текст и идентификатор в соответствии с вашими требованиями.
<?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_width="match_parent"
android:layout_height="wrap_content">
<FrameLayout
android:layout_marginTop="6dp"
android:background="@drawable/drawable_spinner_border"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Spinner
android:layout_marginTop="5dp"
android:id="@+id/fragment_qc_spSelectWorkDone"
android:layout_width="match_parent"
android:textSize="12sp"
android:spinnerMode="dropdown"
android:layout_height="30dp"/>
</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_width="wrap_content"
android:layout_height="wrap_content"/>
</FrameLayout>
Ответ 8
Добавьте это, если не работает <androidx.appcompat.widget.AppCompatAutoCompleteTextView
<com.google.android.material.textfield.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu">
<androidx.appcompat.widget.AppCompatAutoCompleteTextView
android:id="@+id/gender"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Gender"/>
</com.google.android.material.textfield.TextInputLayout>