Transform 可以在其子组件绘制时对其应用一些矩阵变换来实现一些特效。Matrix4 是一个 4D 矩阵，通过它我们可以实现各种矩阵操作。

一、平移

Transform.translate 接收一个 offset 参数，可以在绘制时沿 x、y 轴对子组件平移指定的距离。
002.png

  1. DecoratedBox(
  2.   decoration:BoxDecoration(color: Colors.red),
  3.   // 默认原点为左上角，左移20像素，向上平移5像素
  4.   child: Transform.translate(
  5.     offset: Offset(-20.0, -5.0),
  6.     child: Text("Hello world"),
  7.   )
  8. )

二、缩放

Transform.scale 可以对子组件进行缩小或放大，如：
003.png

  1. DecoratedBox(
  2.   decoration:BoxDecoration(color: Colors.red),
  3.   child: Transform.scale(
  4.     scale: 1.5, // 放大到1.5倍
  5.     child: Text("Hello world")
  6.   )
  7. )

三、旋转

Transform.rotate 可以对子组件进行旋转变换，如：
004.png

  1. DecoratedBox(
  2.   decoration:BoxDecoration(color: Colors.red),
  3.   child: Transform.rotate(
  4.     //旋转90度
  5.     angle:math.pi/2 ,
  6.     child: Text("Hello world"),
  7.   ),
  8. )

注意：要使用 math.pi 需先进行如下导包。

  1. import 'dart:math' as math;

四、RotatedBox

RotatedBox 和 Transform.rotate 功能相似，它们都可以对子组件进行旋转变换，但是有一点不同：RotatedBox 的变换是在 layout 阶段，会影响在子组件的位置和大小。我们将上面介绍 Transform.rotate 时的示例改一下：
005.png

  1. Row(
  2.   mainAxisAlignment: MainAxisAlignment.center,
  3.   children: <Widget>[
  4.     DecoratedBox(
  5.       decoration: BoxDecoration(color: Colors.red),
  6.       // 将Transform.rotate换成RotatedBox
  7.       child: RotatedBox(
  8.         quarterTurns: 1, // 旋转90度(1/4圈)
  9.         child: Text("Hello world"),
  10.       ),
  11.     ),
  12.     Text(
  13.       "你好",
  14.       style: TextStyle(color: Colors.green, fontSize: 18.0),
  15.     )
  16.   ],
  17. )