简体   繁体   中英

Flutter SliverAppBar and FlexibleSpaceBar which Renders a different widget other than title param of FlexibleSpaceBar on scrolling up

I want to render some cool widget as the title for the FlexibleSpaceBar but when I scroll up this title(the named argument of FlexibleSpaceBar) becomes the title of the appbar instead of this title I want to use some other widget to be displayed in the appbar(Simply a text widget or something). Here is the GIF of the UI .In the below GIF the title of FlexibleSpaceBar is a container which can be any fancy widget that I would like But what I wish to do is that when it is scrolled up the entire widget becomes the title for the appbar I want to render a simle text widget with a different text.

这是GIF

Widget build(BuildContext context) {

return Scaffold(
  body: CustomScrollView(
    slivers: <Widget>[
      SliverAppBar(
        expandedHeight: MediaQuery.of(context).size.height * .3,
        floating: false,
        pinned: true,
        flexibleSpace: FlexibleSpaceBar(
          centerTitle: true,
          title: Container(
            color: Colors.black,
            child: Text("Some Widget Here",
                style: TextStyle(

                  fontWeight: FontWeight.bold,
                  color: Colors.white,
                  fontSize: 19.0,
                )),
          ),
          background: CachedNetworkImage(
            imageUrl: store.coverUrl,
            fit: BoxFit.cover,
          ),
        ),
      ),
      SliverToBoxAdapter(
        child: Container(
          height: 800,
          child: Center(
            child: Text("Blah Blah Blah"),
          ),
        ),
      )
    ],
  ),
);

}

class SecondPage extends StatefulWidget {
  @override
  _SecondPageState createState() => _SecondPageState();
}

class _SecondPageState extends State<SecondPage> {
  @override
  Widget build(BuildContext context) {

var top;
return CustomScrollView(
      slivers: <Widget>[
        SliverAppBar(
          expandedHeight: 150,
          flexibleSpace: LayoutBuilder(builder: (context, constraints) {
            top = constraints.biggest.height;
            print(top);
            return FlexibleSpaceBar(
              title: top < 110.14 ? Text("data") : Text("app"),
            );
          }),
          floating: true,
          pinned: true,
        ),
        SliverList(
          delegate: SliverChildBuilderDelegate(
            (BuildContext context, int index) {
                return listItem("Sliver List item: $index");
            },
          ),
        )
      ],
    );
  }
}

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