首页 > 解决方案 > 颤振:如何通过渐变动画更改容器颜色

问题描述

所以我想慢慢改变我的 AppColor。这是整个代码

 body: DefaultTabController(
    length: _tabs.length, // This is the number of tabs.
    child: NestedScrollView(
      controller: scrollController,
      headerSliverBuilder: (context, bool innerBoxIsScrolled) {
        return <Widget>[
          SliverOverlapAbsorber(
            handle: NestedScrollView.sliverOverlapAbsorberHandleFor(context),
            sliver: SliverSafeArea(
              top: false,
              sliver: SliverAppBar(
                pinned: true,
                titleSpacing: 0.0,
                elevation: 0.0,
                flexibleSpace: Container(
                  color: innerBoxIsScrolled ? ColorTheme().white : ColorTheme().homeSkyblue,
                ),

我想在下面更改此代码

flexibleSpace: Container(
                  color: innerBoxIsScrolled ? ColorTheme().white : ColorTheme().homeSkyblue,
                ),

好吧,我希望我的 Appbars 改变颜色,慢慢地从 homeSkyblue 到 white 。但现在它可以立即工作。所以我尝试使用 offset 或 animatedController 但它们都没有工作......

有没有人有一些好的解决方案或小部件?

标签: flutterdartcolorsoffset

解决方案


您可以使用“AnimatedContainer”,它类似于 Container,但您应该使用持续时间。你可以看看这个文档:https ://api.flutter.dev/flutter/widgets/AnimatedContainer-class.html

所以你的代码将变成这样:

flexibleSpace: AnimatedContainer(
              duration: Duration(seconds: 2),
              color: innerBoxIsScrolled ? ColorTheme().white : ColorTheme().homeSkyblue,
            ),

推荐阅读