Transform介紹
窗口小部件(Widget)可以在Paint之前應(yīng)用Transform進行轉(zhuǎn)換，通過Transform可以對widget進行平移丰榴、旋轉(zhuǎn)货邓、縮放等矩陣變換。不像RotatedBox在layout前就對Widget進行旋轉(zhuǎn)操作四濒，Transform是在Widget繪制前進行轉(zhuǎn)換换况，這意味著在計算Widget的顯示需要占用多少空間時，不會去考慮Transform變換盗蟆。
Transform使用
-
平移
方法
// 創(chuàng)建一個widget戈二，并且對他進行平移變換
//offset 偏移量，水平向右為正向姆涩，豎直向下為正向
// 子widget
Transform.translate({Key key, @required Offset offset, bool transformHitTests: true, Widget child })
例子
在垂直方向移動15個單位距離
Transform.translate(
offset: const Offset(0.0, 15.0),
child: Container(
padding: const EdgeInsets.all(8.0),
color: const Color(0xFF7F7F7F),
child: const Text('Quarter'),
),
)
-
旋轉(zhuǎn)
方法
//創(chuàng)建一個widget挽拂，并且對他進行旋轉(zhuǎn)變換
//angle 旋轉(zhuǎn)角度
//origin 偏移量
//alignment 對齊方式
//子widget
Transform.rotate({ Key key, @required double angle, Offset origin, AlignmentGeometry alignment: Alignment.center, bool transformHitTests: true, Widget child })
例子
順時針旋轉(zhuǎn)45°
Transform.rotate(
angle: math.pi / 4, // 旋轉(zhuǎn)45°
child: Container(
padding: const EdgeInsets.all(8.0),
color: const Color(0xFFE8581C),
child: const Text('Apartment for rent!'),
),
)
使用math.pi時需要引入math包 import 'dart:math' as math;
-
縮放
方法
//scale 縮放多少倍
//origin 偏移量
//alignment 對齊方式
//子widget
Transform.scale({ Key key, @required double scale, Offset origin, AlignmentGeometry alignment: Alignment.center, bool transformHitTests: true, Widget child })
例子
放大1.5倍
Transform.scale(
scale: 1.5,
child: Container(
padding: const EdgeInsets.all(8.0),
color: const Color(0xFFE8581C),
child: const Text('Bad Ideas'),
),
)
