入口标准代码
void main(){ runApp(MyApp()) } class MyApp extends StatelessWidget{ @override Widget build(BuildContext context){ return MaterialApp( home:Scaffold( appBar:AppBar(title:Text("flutter demo")) ), body:Center( child:Text("xxxx"), ) ); } }
Container 容器组件
选项:值
child:子组件
height: dobule类型
width:dobule类型
padding:EdgeInsets.all(10) 四边边距 EdgeInsets.fromLTRB(10,10,10,10)左上右下
margin:EdgeInsets.all(10) 四边边距 EdgeInsets.fromLTRB(10,10,10,10)左上右下
transfom:Matrix4..translationVaues(100,0,0) 偏移 x,y,z
Matrix4.rotationZ(0.3) 旋转
alignment:Alignment.bottomLeft 内容对齐 /Alignment.bottomCenter /Alignment.topCenter ........
decoration:盒子装饰
BoxDecoration()
color:盒子背景颜色
borderRadius:BorderRadius.all( 盒子圆角
Radius:circular(8)
)
border: Border.all(
color:边框颜色
边框颜色
)
text文本组件
值
textAlign:TextAlign.right 文字靠右 TextAlign.center 文字居中
overflow:TextOverflow.ellipsis 超出省略
textScaleFactor:2 字体放大
maxLines:1 一行显示
style:TextStyle:() 文字样式
fontSize:16.0 文字大小
color:文字颜色 Color.fromARGB(1,2,3,4)
fontWeight:FontWeight.w300 字体加粗
fontStyle:FontStyle.italic 字体倾斜
decoration:TextDecoration.lineThrough
decorationColor:Color.white 穿过的线的颜色
decorationStyle:TextDecorationStyle.dashed 虚线
letterSpacing:5.0 字间距
ListView 列表组件 默认水平
height:10设置高度
padding:EdgeInsets.all(10) 加边距
scrollDirection:Axis.horizontal垂直
children:<Widget>[] 子元素可以有多个
ListTile 列表的item组件 通常配合列表使用 可以做新闻列表
title:Text("ssss") 标题
leading:Icon(Icon.settings) 设置前面图标
color:Color.red 设置图标颜色
size:10 设置图标大
Image.network("url") 设置图片
trailing:Icon(Iocns.home) 在后面添加图标
subtitle:Text("二级标题") 二级标题