RatingBar

RatingBar показывает оценку или даёт её поставить: средний рейтинг товара, оценка заказа покупателем.

Слева RatingBar только для чтения со средней оценкой 4,5, справа интерактивный, где курсор выбирает четвёртую звезду

Как добавить

  1. Добавьте RatingBar из раздела Form Elements в Widget Palette или через дерево виджетов.
  2. Выделите виджет и откройте Rating Bar Properties на панели свойств.
  3. Interactive по умолчанию включён — пользователь может выбрать оценку. Выключите, чтобы только показывать её.

Показ оценки

При выключенном Interactive задайте Rating числом или через Set from Variable — из ваших данных. Например, привяжите Rating к средней оценке курса, и её нельзя будет изменить.

Дробные значения поддерживаются: при пяти значках оценка 1.5 закрасит один значок и часть следующего. Держите значение в пределах Icon Count.

Сбор оценки

При включённом Interactive пользователь выбирает оценку, а текущий выбор хранится в состоянии виджета. Взять его можно через Set from Variable > Widget State > [имя RatingBar].

инфо
Оценку нужно сохранить самому

Interactive позволяет выбрать оценку, но в источник данных она сама не попадёт. Чтобы она пережила следующий визит, добавьте действие, которое запишет значение в запись — например, в документ отзыва в Firestore. А чтобы интерактивный RatingBar показывал сохранённую оценку, задайте Initial Rating из этой записи.

Настройка

Выделите RatingBar и откройте Rating Bar Properties:

  • Rating — при выключенном Interactive задаёт показываемую оценку: числом или через Set from Variable.
  • Initial Rating — при включённом Interactive оценка до выбора пользователя; он может её изменить.
  • Interactive — можно ли выбирать оценку. При включении поле Rating меняется на Initial Rating.
  • Icon Count — число значков. Для десятибалльной шкалы поставьте 10.
  • Icon Size — размер значка.
  • Icon Selector — какой значок использовать: Star Rounded или любой подходящий.
  • Rated Color — цвет закрашенной части.
  • Unrated Color — цвет незакрашенной части.
  • Icon Padding — отступы вокруг значков: одинаковые или отдельно сверху, снизу, слева и справа.
  • Axis — значки в ряд или столбиком.
перевод официальной документации FlutterFlow

обновлено · перевод от

⌕ ESC