Скрыть/показать панель приложений, как в стиле iOS

Я хочу показать AppBar, когда первый дочерний элемент ListVIew прокручивается, как в стиле iOS (особенно поведение в собственном приложении «Книги» в iOS). Многие приложения в iOS имеют эту функцию, поэтому я думаю, что это обычное поведение в iOS. Но я не знаю, как применить его к Flutter с помощью Material Style. Кто-нибудь знает решение этого? На приведенном ниже GIF показано поведение, которое я хочу реализовать: Поведение в стиле iOS для панели приложений


flutter flutter-listview flutter-appbar
person Quang Khải Đàm    schedule 27.02.2020    source источник
comment
Вы можете использовать SliverAppBar, например: medium.com/@diegoveloper/   -  person Selim Kundakçıoğlu    schedule 28.02.2020

Ответы (1)


arrow_upward
0
arrow_downward

Да, вы можете сделать это в MaterialApp, используя SliverAppBar с CustomScrollView в разделе тела скаффолда. Вы можете использовать SliverAppBar вместо обычного appBar. Виджеты, которые вы будете использовать, должны находиться внутри
SliverList(делегат: SliverChildListDelegate( [ ]))

return Scaffold(


  body: CustomScrollView(
    slivers: <Widget>[
      SliverAppBar(
        expandedHeight: 300,
        pinned: true,
        flexibleSpace: FlexibleSpaceBar(
          title: Text(
           "Reading Now",
            style: TextStyle(
              fontSize: 20,
              color: Colors.white,
              fontWeight: FontWeight.w500,
            ),
            textAlign: TextAlign.end,
          ),
          background: Image.network(
              https://i.stack.imgur.com/1lN0b.png,
              fit: BoxFit.fill,
            ),
        ),
      ),
      SliverList(
        delegate: SliverChildListDelegate(
          [


//widgets which you are going to use inside the listview you can use them in 
//sliverList
                ]
              ),//SliverChildListDelegate
          ),//SliverList
    ],//sliver Widgets
  ),//customScrollView
person jatinkumar    schedule 01.03.2020
comment
Он очень похож на medium.com/@diegoveloper/< /а> - person jatinkumar; 01.03.2020
comment
Но разница заключается в используемом ScorllView. Здесь я использую CustomScrollView вместо NestedScrollVIew. - person jatinkumar; 01.03.2020
comment
В качестве фона AppBar вы можете использовать любой цвет по вашему выбору или использовать изображение - person jatinkumar; 01.03.2020