Flutter相關文檔
1店量、官方文檔
2、官方Demo(Github地址)
常用基礎控件
不管在哪個前端平臺换薄，常用的基礎控件都一樣玉雾，大致包括：文本、圖片轻要、按鈕复旬、輸入框、進度條冲泥、單選框和復選框驹碍、開關切換(Switch)、提示窗凡恍、對話框志秃；布局用的控件(Layout)基本包含：橫向布局、縱向布局咳焚、格子布局洽损、重疊布局、各類包含不同約束條件的特定布局(內(nèi)外間距革半，靠邊居中碑定，相對位置等)流码；然后是一些根據(jù)常用程度封裝的控件包括：列表控件、滑動控件(橫縱方向)延刘，下拉刷新漫试，抽屜(Drawer)等。
在Flutter中碘赖，控件分為StatefulWidget和StatelessWidget(有狀態(tài)控件和無狀態(tài)控件)驾荣，無狀態(tài)控件是死的，不會動態(tài)更新普泡，所以實際使用的時候大多數(shù)情況下都是封裝自己的StatefulWidget播掷，StatefulWidget的狀態(tài)存儲在對應的State類里面，需要更新的時候可以通過調(diào)用setState()方法來刷新頁面撼班。
StatefulWidget基本代碼模板如下:
class DemoStatefulWidget extends StatefulWidget{
@override
State<StatefulWidget> createState() {
return DemoState();
}
}
class DemoState extends State<DemoStatefulWidget>{
var data;
@override
Widget build(BuildContext context) {
return Text(data);
}
void onDataChanged(newData){
setState(() {//刷新控件
data = newData;
});
}
}
接下來歧匈，按照上面梳理出的常用控件，我們一個一個來看砰嘁。
文本 Text
Widget build(BuildContext context) {
retur Text(
"A text in container",
style: new TextStyle(
color: Color(0xFF0000CD), fontStyle: FontStyle.normal, fontSize: 15),
);
}
圖片 Image
Image官方文檔
基本使用
Widget build(BuildContext context) {
return Image.network(//圖片來自網(wǎng)絡
imageUrl,
width: 200.0,
height: 150.0,
);
/// Image.asset(name);//圖片來自項目內(nèi)的資源
/// Image.file(file);//圖片來自文件
/// Image.memory(bytes);//圖片來自內(nèi)存
}
按鈕 TextButton
Widget build(BuildContext context) {
return TextButton(
child: const Text('這是個按鈕'),
onPressed: () {},
);
}
