1. ホーム
  2. dart

[解決済み] Flutterで何かを15度回転させるには?

2023-04-27 12:52:35

質問

Flutterのドキュメントには、HTML/CSSとFlutterのコードの両方で、"div"を15度ずつ回転させる例が紹介されています。

Flutterのコードは

var container = new Container( // gray box
  child: new Center(
    child:  new Transform(
      child:  new Text(
        "Lorem ipsum",
      ),
      alignment: FractionalOffset.center,
      transform: new Matrix4.identity()
        ..rotateZ(15 * 3.1415927 / 180),
    ), 
  ),
);

そして、該当箇所は new Transform であり alignment: FractionalOffset.center そして transform: new Matrix4.identity()..rotateZ(15 * 3.1415927 / 180)

を回転させるより簡単な方法はないでしょうか? Container を回転させる簡単な方法はありますか?15度の場合のショートハンドはあるのでしょうか?

ありがとうございます。

どのように解決するのですか?

モバイルアプリでは、最初に15度回転させたものをずっとそのままにしておくというのは、ちょっと珍しいと思います。そのため、時間をかけて回転を調整することを計画している場合、Flutterの回転のサポートが優れている理由かもしれません。

やりすぎな気もしますが RotationTransition AlwaysStoppedAnimation であれば、まさにお望みのものが実現できます。

new RotationTransition(
  turns: new AlwaysStoppedAnimation(15 / 360),
  child: new Text("Lorem ipsum"),
)

何かを90度、180度、270度回転させたい場合は RotatedBox .

new RotatedBox(
  quarterTurns: 1,
  child: new Text("Lorem ipsum")
)