Description:

您好,我正在try 设置对象旋转的动画.


Problem :

为什么我的绿色方块在动画中不保持围绕其中心旋转?

enter image description here


The code :

class NodeV3View extends StatefulWidget {
  const NodeV3View({
    Key? key,
  }) : super(key: key);

  @override
  State<NodeV3View> createState() => _NodeV3ViewState();
}

class _NodeV3ViewState extends State<NodeV3View> {
  
  bool isExpand = false;

  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    var controller = Provider.of<CompteurProvider2>(context);

    return Scaffold(
        body: LayoutBuilder(
          builder: (context, constraints){
            return Consumer<CompteurProvider2>(builder :(ctx , provider , child){
              return GestureDetector(
                onTap: () => setState(() {}),
                child: Container(
                  color: Colors.yellow,
                  width: 300,
                  height: 300,
                  child: Stack(
                    children: [
                      Positioned(
                        left: 150 - 50,// => Yellow Square / 2 - Green Square / 2
                        top : 150 - 50,
                        child: InkWell(
                          onTap: (){
                            setState(() {
                              isExpand = !isExpand;
                            });
                          },
                          child: AnimatedContainer(
                            duration: const Duration(milliseconds: 500),
                            width: 100,
                            height: 100,
                            decoration: BoxDecoration(
                              color: Colors.green,
                            ),
                          transform: Matrix4Transform()
                              .rotateDegrees(
                                  isExpand == true
                                      ? 180
                                      : 0,
                                  origin: Offset(50, 50)
                              )
                              .matrix4,
                          ),
                        ),
                      )
                    ],
                  ),
                )
              );
            });
          },
        )
    );
  }
}

Any guidance on the best way to accomplish this would be appreciated.

推荐答案

transformAlignment: FractionalOffset.center添加到动画容器中.

Flutter相关问答推荐

使用自定义控制器将项插入到ListView中时行为不正确

Flutter 图标记移动

如何从RealmResults获取Flutter Flutter 流?

Flutter-Riverpod:如何只从提供者读取一次值

在flutter中从图库或相机中 Select 图像的方法

什么最接近 Dart 的 List.asMap().forEach() 返回列表?

如何解决需要一个标识符,但得到的是:.try 在:之前插入一个标识符.dart 错误

小部件堆栈未显示顶层

我的第一个 flutter 项目出错,启动时为空值?

flutter 在文本字段中更改部分文本选定 colored颜色

底部工作表顶部的一块 Flutter

alert 对话框内的 ListView 显示空的透明窗口

在 flutter 的另一个类中使用变量值

无效的 depfile: C:\xxx\xxx\Flutter\project_name\.dart_tool\flutter_build\df4b308df1ee4bce22c56c71751554d1\kernel_snapshot.d 无效

如何在 flutter 中创建渐变按钮

如何获取 android 和 Ios (flutter) 的 CircularProgress 指示器?

NoSuchMethodError:方法 '[]' 在 null 上被调用.我的信息流中的错误

使用 Chaquopy 插件后 Gradle Sync 无法正常工作

阴影效果只出现在一张卡片的左边 在Flutter 中?

单击列表视图导航到 Flutter 中的另一个页面