首页 > 解决方案 > 滚动时如何在Appbar上移动标题

问题描述

我想做颤振应用。

滚动时如何在appbar上制作移动标题?

我在 GIF 文件上附加了应用程序的状态。

我需要在哪里设置移动标题文本?

我只是制作像优步应用一样的应用

折断

 @override
  Widget build(BuildContext context) {
    double sliderValue = 0.0;
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            SliverOverlapAbsorber(
              handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
              child: SliverAppBar(
                forceElevated: innerBoxIsScrolled ,
                backgroundColor: Colors.transparent,
                leading: IconButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  icon: Icon(Icons.arrow_back),
                  color: Colors.black,
                ),
                elevation: 0.0,
                expandedHeight: 100.0,
                floating: false,
                pinned: true,
                flexibleSpace: FlexibleSpaceBar(
                    titlePadding: EdgeInsets.only(left: 15.0),
                    collapseMode: CollapseMode.none,
                    title: Text("Notification",
                        style: TextStyle(
                          color: Colors.black,
                          fontSize: 20.0,
                        )),
                  ),

              ),
            ),
          ];
        },
        body: Center(
          child: Text("Sample Text"),
        ),
      ),
    );
  }

标签: flutter

解决方案


必须使用CustomScrollView小部件

CustomScrollView(
      slivers: <Widget>[
        SliverAppBar(
          title: Text('Title'),
          pinned: true,
          expandedHeight: 48,
        ),
        SliverFillRemaining(
            child: Center(
          child: Text('sliver'),
        )),
      ],
    );

推荐阅读