Container
Container 顧名思義是容器，一個擁有繪制瑰步、定位的妖、調(diào)整大小的 widget绣檬，Container也是進行Flutter開發(fā)最常用的組件之一。
Container常用的屬性有哪些嫂粟？
child: Text(),//容器子元素
alignment: Alignment.topCenter,//對齊方式
height: 200.0,//容器高度
width: 300.0,//容器寬度
decoration: BoxDecoration(),//裝飾
padding:EdgeInsets.fromLTRB(10, 30, 5, 0),//內(nèi)邊距
margin: EdgeInsets.fromLTRB(10, 30, 5, 0),//外邊距
transform:Matrix4.skewY(0.5),//旋轉(zhuǎn)效果娇未，繞Y軸傾斜
其中， decoration赋元，以BoxDecoration()為例：
decoration: BoxDecoration(//裝飾
color: Colors.yellow,//顏色
border: Border.all(//邊框
color: Colors.deepOrange,//邊框顏色
width: 2.0,//邊框?qū)挾?br>
),
borderRadius: BorderRadius.all(//邊框半徑
Radius.circular(10),
)
),
demo
測試效果：
image.png
測試代碼：
return Center(
child: Container(
child: Text(//容器子元素
'Flutter開發(fā)之Container組件',
textAlign:TextAlign.left,
overflow:TextOverflow.ellipsis ,
maxLines: 2,
textScaleFactor: 1.8,
style:TextStyle(
fontSize: 16.0,
color:Colors.red,
)
),
alignment: Alignment.topCenter,//對齊方式
height: 300.0,//容器高度
width: 300.0,//容器寬度
decoration: BoxDecoration(//裝飾線
color: Colors.yellow,//顏色
border: Border.all(//邊框
color: Colors.deepOrange,
width: 2.0
),
borderRadius: BorderRadius.all(//邊框半徑
// Radius.circular(150), //圓形
Radius.circular(10),
)
),
padding:EdgeInsets.fromLTRB(10, 30, 5, 0),//內(nèi)邊距
margin: EdgeInsets.fromLTRB(10, 30, 5, 0),//外邊距
// transform:Matrix4.translationValues(100,0,0),//平移,x, y, z
transform:Matrix4.skewY(0.5),//繞Y軸傾斜
// transform:Matrix4.rotationZ(0.5),//z軸旋轉(zhuǎn)
// transform:Matrix4.diagonal3Values(1, 0.5, 1),//縮放,x, y, z
),
);
參考：
https://api.flutter.dev/flutter/widgets/Container-class.html
