在 Flutter 中在 X 上旋转 3D

2024-04-08

我一直在研究 Flutter 旋转,

new Matrix4.identity() ..rotateX(degrees * 3.1415927 / 180),

但是,问题是,我希望它与下图类似。 我可以用 Flutter 在 x 轴上实现类似 3D 的旋转吗?

即使有从 3D 到 2D 的映射或者有替代方案 那会得到相同的结果。 提前致谢。

OpenCV 中的示例图像:如何从旋转角度计算 OpenCV 的透视变换? https://stackoverflow.com/questions/17087446/how-to-calculate-perspective-transform-for-opencv-from-rotation-angles


谢谢这次讨论 https://www.reddit.com/r/FlutterDev/comments/8i81zy/how_to_implement_perspective_projection_in_flutter/, and 这个仓库 https://github.com/wmleler/thematrix,经过一天多的寻找答案,

static Matrix4 _pmat(num pv) {
    return new Matrix4(
      1.0, 0.0, 0.0, 0.0, //
      0.0, 1.0, 0.0, 0.0, //
      0.0, 0.0, 1.0, pv * 0.001, //
      0.0, 0.0, 0.0, 1.0,
    );
}

Matrix4 perspective = _pmat(1.0);


// then use it

new Center(
      child: new Transform(
        child: new FittedBox(
          fit: BoxFit.fill,
          child: LogoWidget(),
        ),
        alignment: FractionalOffset.center,
        transform: perspective.scaled(1.0, 1.0, 1.0)
          ..rotateX(math.pi - degrees * math.pi / 180)
          ..rotateY(0.0)
          ..rotateZ(0.0)
      ),
    );

这是结果图像

请阅读小理论 https://www.scratchapixel.com/lessons/3d-basic-rendering/perspective-and-orthographic-projection-matrix/opengl-perspective-projection-matrix关于这个话题。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Flutter 中在 X 上旋转 3D 的相关文章

随机推荐