颤振：如何通过渐变动画更改容器颜色答案

【问题标题】：flutter: how can I change Container Colors by giving gradation animation颤振：如何通过渐变动画更改容器颜色
【发布时间】：2021-09-09 07:57:52
【问题描述】：

所以我想慢慢改变我的 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 但它们都没有工作......

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

【问题讨论】：

标签： flutter dart colors offset

【解决方案1】：

您可以使用AnimatedContainer，它类似于Container，但您应该使用duration。你可以看看这个文档：https://api.flutter.dev/flutter/widgets/AnimatedContainer-class.html

所以你的代码会变成这样：

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

【讨论】：