将曲线应用于现有动画

时间:2019-11-16 16:52:11

标签: flutter dart

项目

嗨,我正在学习如何在Flutter中使用AnimatedList。我可以使用SizeTransition在列表中添加和删除元素:

代码

Widget _buildItem(
    BuildContext context, int index, Animation<double> animation) {
  return SizeTransition(
    sizeFactor: animation,
    axis: Axis.vertical,
    child: Padding(
      padding: const EdgeInsets.all(8.0),
      child: Container(
        height: 50,
        color: Colors.orange,
        child: SizedBox(
          child: Center(
            child: Text(displayList[index].toString()),
          ),
        ),
      ),
    ),
  );
}

现在,我不明白如何向此过渡添加自定义曲线。这有可能吗?

1 个答案:

答案 0 :(得分:2)

好问题!

如文档中提到的示例,您可以使用CurvedAnimation

CurvedAnimation(
  parent: animation,
  curve: Curves.ease,
  reverseCurve: Curves.easeOut,
),

reverseCurve参数是可选。如果未提供反向曲线,则弯曲的动画将仅在两个方向上使用curve
应用于您的代码:

return SizeTransition(
  sizeFactor: CurvedAnimation(
    parent: animation,
    curve: Curves.ease,
  ),
  ...
)