简体   繁体   中英

How to give fixed height to a sliverList in flutter?

I am trying to make a collapsible toolbar that shrinks when scrolling the page.

For that, I am using Slivers. By using SliverList , when the data gets scrolled, it goes up in the phone screen top battery and time transparent bar. Hence, I want to give the list fixed height so that it gets scrolled in a limited area.

在此处输入图像描述

I tried putting the SliverList into a SingleChildScrollView , a SizedBox , or a Container . But none worked.

SliverList(
  delegate: SliverChildBuilderDelegate((context, index) {
    return Container(
      color: Colors.white,
      child: Text("Text"),
    );
  },
  chikdCount:100,
),

You can change the height of slivers by using itemExtend property in SliverFixedExtentList . Henceforth all the children will take the same height as 150.0. Can you check the below code?

SafeArea(
   child: CustomScrollView(
    slivers: <Widget>[
      SliverAppBar(
        title: Text('SliverAppBar'),
        backgroundColor: Colors.green,
        expandedHeight: 200.0,
        flexibleSpace: FlexibleSpaceBar(
          background: Image.asset('assets/forest.jpg', fit: BoxFit.cover),
        ),
      ),
      SliverFixedExtentList(
        itemExtent: 150.0,
        delegate: SliverChildListDelegate(
          [
            Container(color: Colors.red),
            Container(color: Colors.purple),
            Container(color: Colors.green),
            Container(color: Colors.orange),
            Container(color: Colors.yellow),
            Container(color: Colors.pink),
          ],
        ),
      ),
    ],
));

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM