我对 Flutter 很陌生,遇到了一个问题。我必须根据给定的高度值剪辑 png。这与我制作的这个类配合得很好:
class ScaleClipper extends CustomClipper<Rect> {
double value;
@override
Rect getClip(Size size) {
Rect rect = Rect.fromLTWH(0.0, 0.0 + value, size.width, size.height);
return rect;
}
@override
bool shouldReclip(ScaleClipper oldClipper) {
return true;
}
ScaleClipper(double value) {
this.value = value;
}
}
Run Code Online (Sandbox Code Playgroud)
现在我想要为图像中的变化添加动画效果。我尝试将其包装在此处提到的小部件中: https: //flutter.io/docs/development/ui/widgets/animation 但我没有让它正常工作。这是我显示图像的小部件:
ClipRect(
clipper: ScaleClipper(value),
child: Container(
margin: new EdgeInsets.only(
left: 30.0, top: 30.0, right: 20.0, bottom: 30.0),
width: 150.0,
height: 420.0,
decoration: BoxDecoration(
image: DecorationImage(
image: AssetImage("images/image.png"),
fit: BoxFit.contain))),
),
Run Code Online (Sandbox Code Playgroud)
我是否需要改变解决问题的方法,或者我可以为图像的剪辑设置动画吗?
我为未来的新人找到了答案。您可以像这样使用简单的补间动画
controller = AnimationController(
duration: const Duration(milliseconds: 1000), vsync: this);
animation = Tween(begin: 0.0, end: 1.0).animate(controller)
..addListener(() {
setState(() {
fracturedValue = desiredClipValue * animation.value;
});
});
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1517 次 |
| 最近记录: |