【问题标题】:Horizontal Flip animation ImageWidget Flutter水平翻转动画 ImageWidget Flutter
【发布时间】:2020-04-28 02:38:26
【问题描述】:

我想为 CircularAvatar 小部件做水平翻转动画.. 如下动画 像这样我想翻转circumAvartar

我试过了

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();

但它不像下面的动画那样工作,我想要像水平方向翻转硬币这样的动画..请给出任何解决方案

【问题讨论】:

  • 谢谢,我会尝试更新

标签: flutter flutter-layout flutter-animation


【解决方案1】:

您可以使用库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'),
    ),
);

【讨论】:

  • 我们不能用 AnimatedContainer 小部件做到这一点吗??
猜你喜欢
  • 2021-07-17
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-09-04
  • 1970-01-01
  • 1970-01-01
  • 2016-10-08
  • 1970-01-01
相关资源
最近更新 更多