Нижняя шторка (Bottom Sheet)

Нижний лист — это альтернатива меню или диалоговому окну. Он открывается снизу вверх и может быть удален, если провести пальцем сверху вниз. Когда он открывается, он мешает пользователю взаимодействовать с остальной частью приложения.

Нижний лист можно использовать, когда нужно выполнить небольшое действие без создания отдельного экрана.

Добавление нижнего листа включает в себя следующие шаги:

1. Создание компонента
2. Открытие нижнего листа

Нижние листы создаются с помощью компонента. Посмотрите, как создать его с нуля или использовать шаблоны.

Вы можете открыть нижний лист, добавив действие. Как это сделать, смотрите на следующей странице:

Иногда вам может понадобиться вернуть значение из нижнего листа на страницу, которая его открыла — например, передать выбранный элемент из нижнего листа на страницу и отобразить его.

Примерно так:

Вы можете сделать это, передав значение во время добавления действия увольнения.

Чтобы изменить цвет фона, найдите свойство Background Color и измените цвет.

Изменение цвета барьера позволяет изменить цвет барьера, отделяющего нижний лист от основного пространства.
Чтобы изменить цвет барьера, найдите свойство Barrier Color и измените цвет.

Чтобы добавить закругленные углы к нижнему листу:

• Выберите кнопку Button в дереве виджетов или в области холста.
• Перейдите на вкладку Действия. (Убедитесь, что у вас уже есть действие, добавленное к кнопке).
• Прокрутите вниз, чтобы найти свойство Цвет фона (необязательно).
• Щелкните на поле рядом с Unset, используйте второй ползунок (справа) и подведите ручку к началу (слева) ползунка, чтобы сделать цвет прозрачным.
• Аналогично установите цвет барьера прозрачным.
• Теперь откройте компонент для нижнего листа.
• Выберите виджет Container и перейдите в раздел редактора свойств. Прокрутите вниз, чтобы найти свойство Радиус границы и установите его TL (вверху слева) и TR (вверху справа) на 20.

Чтобы нижний лист отображался в полноэкранном режиме:

• Выберите кнопку Button в дереве виджетов или в области холста.
• Перейдите на вкладку Действия. (Убедитесь, что у вас уже есть действие, добавленное к кнопке).
• Прокрутите вниз, чтобы найти свойство Height и сделайте его бесконечным. (Нажмите на значок)

Чтобы сделать нижний лист с прозрачным фоном:

• Выберите «Цвет фона» и убедитесь, что непрозрачность установлена на 0% — это даст вам «прозрачный» вместо «не установленного».
• Установите цвет барьера по своему усмотрению, и ваш нижний лист не будет иметь заданного цвета фона.

Посмотрите наши примеры приложений HealthAI и RobinDo.