如何使标题变淡？

Question

我在此gif中做了类似的事情：

但是唯一缺少的部分是衰落标题，我不知道该如何完成。

我认为我需要知道滚动的位置，以便在某个位置，如果用户继续滚动，则标题将一直淡入淡出直到消失。我不确定，也许还有另一种方法，有什么想法吗？

这是我到目前为止所拥有的：

return Scaffold(
  backgroundColor: Colors.white,
  body: SafeArea(
    child: CustomScrollView(
      shrinkWrap: true,
      slivers: <Widget>[
        SliverAppBar(
          primary: false,
          automaticallyImplyLeading: false,
          elevation: 0,
          backgroundColor: Colors.white,
          expandedHeight: 300.0,
          //
          centerTitle: true,
          flexibleSpace: Center(
            child: FlexibleSpaceBar(
              centerTitle: true,
              titlePadding: EdgeInsets.fromLTRB(20, 10, 20, 135),
              collapseMode: CollapseMode.none,
              title: Text(
                'Set Up Your Profile',
                style: TextStyle(
                color: kAppPurple,
                fontFamily: 'NotoSans',
                fontSize: 25,
                fontWeight: FontWeight.w100,
                ),
              ),
            ),
          ),
        ),
        SliverList(
          delegate: SliverChildListDelegate(...),
        ),
      ],
    ),
  ),
);

Answer 1

您应检查此链接。

Flutter: Increase the power of your AppBar & SliverAppBar

样本2是您想要实现的，但他正在用图像完成。

它完全涵盖了您想要的内容。