StickyHeader

StickyHeader держит шапку на виду, пока под ней прокручивается содержимое. Например, строка поиска остаётся наверху, пока пользователь листает результаты.

У виджета две секции:

  • StickyHeader Header — то, что остаётся видимым при прокрутке: строка поиска, заголовок.
  • StickyHeader Content — содержимое под шапкой, например ListView или GridView.
инфо
Прокручивает родитель

Основную прокрутку должен вести Column или ListView, внутри которого лежит StickyHeader: включите у него Primary. Если в StickyHeader Content есть свой ListView или GridView, у внутреннего Primary выключите.

Внутренний список или сетка всё равно может прокручиваться отдельно. Чтобы внутренний ListView ехал вместе со страницей, включите у него Shrink Wrap и выберите в Scroll Physics вариант без прокрутки.

Как добавить

  1. Добавьте на страницу Column или ListView и включите у него Primary, чтобы прокрутку вёл он. Для Column включите ещё и Scrollable.
  2. Из раздела Base Elements добавьте внутрь StickyHeader.
  3. В StickyHeader Header положите то, что должно оставаться на виду.
  4. В StickyHeader Content — то, что будут прокручивать. Для набора элементов подойдут ListView или GridView.

Пример: строка поиска над списком пользователей.

перевод официальной документации FlutterFlow

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

⌕ ESC