flutter - 水平翻转动画 ImageWidget Flutter
问题描述
我想为 CircularAvatar 小部件做水平翻转动画.. 像下面的动画 这样我想翻转 circularAvartar
我试过了
AnimationController _controller;
AnimatedBuilder(
animation: _controller,
builder: (context, child){
return Transform(
transform: Matrix4.rotationY((1 - _controller.value ) * pi / 2),
child: CircleAvatar(
radius: PROFILE_PIC_RADIUS,
backgroundImage: AssetImage(url),
// backgroundColor: Colors.transparent,
),
);
}
),
_controller.forward();
_controller.reverse();
但它不像下面的动画那样工作,我想要像水平方向翻转硬币这样的动画..请给出任何解决方案
解决方案
您可以使用库flip_card。
将此添加到 pubspec.yaml :
dependencies:
flip_card: ^0.4.4
然后运行
flutter packages get
要使用:
import 'package:flip_card/flip_card.dart';
FlipCard(
direction: FlipDirection.HORIZONTAL, // default
front: Container(
child: Text('Front'),
),
back: Container(
child: Text('Back'),
),
);
推荐阅读
- reactjs - 反应:条件类名称未在 DOM 中更新
- javascript - 在 ReactJS 的 textarea 中添加行号
- python - Opencv HoughCircles 内存不足)无法在函数“cv::OutOfMemoryError”中为大图像分配内存
- react-native - numberOfLines 如何在反应原生 Text 组件中工作?
- python - 如何重新采样 csv 以便它可以与我的其他 csv 完美对齐
- excel - 如何在excel电子表格列中查找连续数字的特定数据
- python - 根据有效负载大小阻止 API
- python-3.x - ValueError: 层序号_6 的输入 0 与层不兼容:预期 ndim=4,发现 ndim=3。收到的完整形状:[32、28、28]
- javascript - 更改选择选项中的选定值
- javascript - 无法在 useState 挂钩中设置数组