Сборщики

Средство выбора помогает пользователям выбирать и устанавливать определенные данные.

Сборщик

Средства выбора следует использовать, чтобы пользователи могли выбирать среди ограниченного числа элементов.

По умолчанию элементы будут зацикливаться бесконечно в обоих направлениях. Рассмотрите возможность отключения этого поведения, если порядок в списке важен или чтобы пользователи могли быстро добраться до первого и последнего элемента.

Анатомия

Анатомия

А. Неактивный столбец
Б. Разрушитель толстой кишки
C. Столбец выбора
D. Самый популярный контент
E. Средний контент
F. Нижнее содержимое

Ширина и высота

Группа выбора заполняет доступную высоту и ширину. Существует четыре варианта макета столбцов выбора. Каждый макет центрируется и заполняет доступную высоту. Ширина столбца определяется шириной, необходимой для размещения количества цифр, необходимых в шрифте. Средство выбора даты является исключением: по горизонтали оно заполняет экран и выходит за края.

Например, числа определяют ширину «00», а затем устанавливают ширину. Для текстовых полей, например, для поля месяца, ширина будет равна «МММ» (самой широкой букве латинского алфавита). Таким образом, ширина и высота (которая представляет собой высоту строки используемого стиля шрифта) будет зависеть от используемого шрифта.

Элементы выбора различаются по размеру в зависимости от точки останова.

Применение

См. следующие примеры средств выбора даты и времени.

Чтобы узнать о готовой реализации средства выбора даты и времени, посетите библиотеку часового искусства на Github.

Если вы хотите создать аналогичный опыт, когда пользователи выбирают значение, состоящее из нескольких частей, с помощью нескольких средств выбора, используйте встроенный компонент PickerGroup . Этот объект использует объект координатора фокуса для назначения фокуса правильному элементу Picker.

Адаптивные макеты

Таймпикер 24 часа

Таймпикер 12ч

Выбор даты

Отзывчивое поведение

Увеличение размера текста

После точки останова 225+ размер шрифта элемента Picker изменяется. Верхняя и нижняя копии в столбце с отложенной прокруткой корректируются (A), как и средняя копия. Ниже приведены некоторые примеры этого:

Макет в две колонки

Ниже точки останова 225 dp

Шрифт: Дисплей 2

Точка останова выше 225 dp

Шрифт: Дисплей 1

Расположение трех столбцов

Ниже точки останова 225 dp

Шрифт: Дисплей 3

Выше точки прерывания 225 dp

Шрифт: Дисплей 2

Увеличение размера градиента

Градиент в столбце выбора определяется по высоте доступным пространством. Верхний и нижний градиенты установлены на треть (33%) доступной высоты. Это означает, что для каждого доступного размера экрана градиент масштабируется пропорционально. Сидение независимо от расположения колонн.

Ниже точки останова 225 dp

Размер: 33 % высоты столбца.

Выше точки прерывания 225 dp

Размер: 33% высоты столбца

Увеличение интервала между колоннами

Интервал между столбцами масштабируется после точки останова 225+, начиная с 2 dp или 4 dp и увеличиваясь до 6 dp. Это зависит от того, какой макет вы выбрали; макеты с 2 или 3 столбцами

Макет в две колонки

Ниже точки останова 225 dp

зазор между столбцами 4 dp

Выше точки останова 225 dp

зазор между столбцами 6 dp

Расположение трех столбцов

Ниже точки останова 225 dp

зазор между столбцами 2 dp

Выше точки останова 225 dp

зазор между столбцами 6 dp