Question 232366 in Flutter Question posted in
The official Flutter documentation can be found here.

state does not change while using sliver appbar in flutter

I am learning sliverapp bar….

here i have used customscroll view and i want three things

  1. SliverAppBar for showing title ‘Transactions’

  2. ** SliverPersistentHeader**. for selecting based on switch value(either all or only positive numbers)

3)SliverList. to display all filtered data

I am facing problem in Switch’s onChange method..it does not change state of showAll variable eventhought i have applied setState..

Widget build(BuildContext context) {
    return SafeArea(
      child:Scaffold(
        body: CustomScrollView(
          slivers: [
            //sliver appbar
             SliverAppBar(
              expandedHeight: 300,
              flexibleSpace: FlexibleSpaceBar(
                title: Text('All'+showAll.toString()),
              ),
              pinned: true,
              floating: true,
            ),

            SliverPersistentHeader(
              delegate: _PinnedHeaderDelegate(child:  Container(
                height: 50,
                color: Colors.white,
                child: Row(children: [
                  Text('Show All Data'),
                  Switch(
                      value: showAll,
                      onChanged: (val) {
                        print(val);
                        setState(() {
                          showAll = val;
                        });
                      }),


                ],),
              )),
              pinned: true,
            ),

            //sliver list
            buildShowData(),
          ],
        ),
      ),
    );

  }

  buildShowData() {
    List<int> data;
    if(showAll==true)
    data=numbers;
    else
    data=numbers.where((element) => element>0).toList();
    return SliverList(
      delegate: SliverChildBuilderDelegate(
            (BuildContext context, int index) {
              final number=data[index];
          return Card(
            child: ListTile(
              title: Text('$number',style: TextStyle(
                color: number<0?Colors.red:Colors.green
              ),),
            ),
          );
        },
        childCount: data.length,
      ),
    );
  }
}
Tags:

2

Answers


  1. 0

    send your code of _PinnedHeaderDelegate class

    hope shouldRebuild is returning true…

    bool shouldRebuild(covariant SliverPersistentHeaderDelegate oldDelegate) {
    return true;// check this line of your class
  }
    Login or Signup to reply.
  2. 0

    Make sure that in _PinnedHeaderDelegate class shouldRebuild returns true

    class _PinnedHeaderDelegate extends SliverPersistentHeaderDelegate {
  @override
  Widget build(BuildContext context, double shrinkOffset, bool overlapsContent) {
    return Container(
      height: 50,
      color: Colors.grey,
      child: Center(child: Text('Pinned Widget')),
    );
  }

  @override
  double get maxExtent => 50; 

  @override
  double get minExtent => 50;

  @override
  bool shouldRebuild(covariant SliverPersistentHeaderDelegate oldDelegate) {
    return true; -------------------> //Make sure here it returns true
  }
}

    Output :

    Switch is off :

    enter image description here

    Switch is on :

    enter image description here

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search