折叠时，条子标题从中心向左颤动

我的目标是遵循我的设计（受到三星天气的启发），但是当您刚开始学习时，实现代码很困难。展开时标题应居中，折叠时标题应保留在左上角。

到目前为止，这是我的代码和我当前的进度。棘手的部分是将标题移到中心。

      Scaffold(
        backgroundColor: Colors.transparent,
        body: CustomScrollView(
          slivers: [
            SliverAppBar(
              actions: <Widget>[
                IconButton(
                  icon: const Icon(Icons.search),
                  onPressed: () {},
                ),
              ],
              pinned: _pinned,
              snap: _snap,
              floating: _floating,
              expandedHeight: 160,
              backgroundColor: Colors.transparent,
              elevation: 0.0,
              flexibleSpace: FlexibleSpaceBar(
                titlePadding: EdgeInsets.all(18),
                // centerTitle: true,
                title: Text('Panahon'),
              ),
            ),
            SliverToBoxAdapter(
                child: SizedBox(
              height: 800,
              child: Card(),
            ))
          ],
        ),
      ),

编辑：该应用程序根据时间动态更改主题。

您可以使用以下命令创建自定义条子应用栏SliverPersistentHeaderDelegate， 你会得到shrinkOffset可用于为应用栏元素设置动画。

Run on dartPad https://dartpad.dev/?id=b7861e5ef83db7a3ad0f04e3a0cdb81d

更换你的SliverAppBar有了这个

SliverPersistentHeader(
  pinned: true,
  delegate: MySliverHeaderDelegate(onActionTap: () {
    debugPrint("on Tap");
  }),
),

并定制SliverHeaderDelegate

class MySliverHeaderDelegate extends SliverPersistentHeaderDelegate {
  final double _maxExtent = 160;
  final VoidCallback onActionTap;

  MySliverHeaderDelegate({
    required this.onActionTap,
  });
  @override
  Widget build(
      BuildContext context, double shrinkOffset, bool overlapsContent) {
    debugPrint(shrinkOffset.toString());
    return Container(
      color: Colors.cyanAccent,
      child: Stack(
        children: [
          Align(
            alignment: Alignment(
                //little padding
                -(shrinkOffset > _maxExtent - 20
                        ? _maxExtent - 20
                        : shrinkOffset) /
                    _maxExtent,
                0),
            child: const Text('Panahon'),
          ),

          // here provide actions
          Positioned(
            top: 0,
            right: 0,
            child: IconButton(
              icon: const Icon(Icons.search),
              onPressed: onActionTap,
            ),
          ),
        ],
      ),
    );
  }

  @override
  double get maxExtent => _maxExtent;

  @override
  double get minExtent => kToolbarHeight;

  @override
  bool shouldRebuild(covariant MySliverHeaderDelegate oldDelegate) {
    return oldDelegate != this;
  }
}