Блог

У меня есть заголовок, который состоит из:

1 — Панель приложений (заголовок кнопка возврата) 2 — строка со средством выбора данных) 3 — строка, служащая настраиваемой панелью вкладок (с двумя вкладками) 4 — строка, служащая панелью фильтров (с кнопкой и полем поиска)

Затем у меня есть «тело» со списком карточек, который можно прокручивать.

Мне нужно было убрать / скрыть номера 1-3 и оставить видимым только номер 4, когда я прокручиваю список карт вниз. Как я могу создать настраиваемый виджет, который поможет мне в этом?

Вот часть кода (он слишком длинный, чтобы привести все):

 Widget build(BuildContext context) {
    return Scaffold(
        body: CustomScrollView(
      slivers: [
        SliverAppBar(
          backgroundColor: Colors.blue,
          title: 'List of Tasks',
          elevation: 0.0,
          pinned: true,
        ),
        SliverPadding(
          padding: EdgeInsets.all(15),
          sliver: SliverToBoxAdapter(
            child: DatePicker(
              date: date,
              onChange: (newDate) {
                setState(() {});
              },
            ),
          ),
        ),
        SliverToBoxAdapter(
          child: ActivitiesTabController(
            pageController: _pageController,
            currentTab: currentTab,
            onChangedTab: (currentTab) {},
          ),
        ),
        SliverToBoxAdapter(
          child: Row(
            children: [
              SearchFilterBar(
                taskId: taskId,
                onChange: (floors, serviceName) {},
              ),
            ],
          ),
        ),
        SliverList(
          delegate: SliverChildBuilderDelegate((BuildContext context, int index) {
            return new Container(color: Colors.amberAccent, height: 150.0);
          }),
        ),
      ],
    ));
  }
  

Я думаю, вы имеете в виду две панели приложений, где первую можно прокручивать, а вторая остается постоянной.

Я думаю, что это будет что-то вроде этого:

 @override
Widget build(BuildContext context) {
  return Scaffold(
    body: CustomScrollView(slivers: [
      SliverAppBar(
        title: Text('This hides'),
      ),
      SliverAppBar(
        title: Text('This is always shown'),
        pinned: true,
        primary: false,
      ),
      SliverList(
        delegate: SliverChildBuilderDelegate(
          (_, i) {
            return ListTile(title: Text('Line $i'));
          },
          childCount: 150,
        ),
      ),
    ]),
  );
}