最基礎(chǔ)布局的特性和使用
| 類型 | 作用特點(diǎn) |
|---|---|
| Container | 只有一個(gè)子 Widget而叼。默認(rèn)充滿，包含了padding豹悬、margin葵陵、color、寬高瞻佛、decoration 等配置脱篙。 |
| Padding | 只有一個(gè)子 Widget。只用于設(shè)置Padding伤柄，常用于嵌套child绊困，給child設(shè)置padding。 |
| Center | 只有一個(gè)子 Widget适刀。只用于居中顯示秤朗，常用于嵌套child，給child設(shè)置居中笔喉。 |
| Stack | 可以有多個(gè)子 Widget取视。 子Widget堆疊在一起。 |
| Column | 可以有多個(gè)子 Widget常挚。垂直布局作谭。 |
| Row | 可以有多個(gè)子 Widget。水平布局奄毡。 |
| Expanded | 只有一個(gè)子 Widget折欠。在 Column 和 Row 中充滿。 |
基礎(chǔ)的widget
| 類型 | 作用特點(diǎn) |
|---|---|
| MaterialApp | 一般作為APP頂層的主頁入口，可配置主題锐秦，多語言咪奖，路由等 |
| Scaffold | 一般用戶頁面的承載Widget，包含appbar农猬、snackbar赡艰、drawer等material design的設(shè)定。 |
| Appbar | 一般用于Scaffold的appbar 斤葱，內(nèi)有標(biāo)題慷垮，二級(jí)頁面返回按鍵等，當(dāng)然不止這些揍堕，tabbar等也會(huì)需要它 料身。 |
| Appbar | 一般用于Scaffold的appbar ，內(nèi)有標(biāo)題衩茸，二級(jí)頁面返回按鍵等芹血，當(dāng)然不止這些，tabbar等也會(huì)需要它 楞慈。 |
| Text | 顯示文本幔烛，幾乎都會(huì)用到，主要是通過style設(shè)置TextStyle來設(shè)置字體樣式等囊蓝。 |
| RichText | 富文本饿悬，通過設(shè)置TextSpan，可以拼接出富文本場景聚霜。 |
| Text | 顯示文本狡恬，幾乎都會(huì)用到，主要是通過style設(shè)置TextStyle來設(shè)置字體樣式等蝎宇。 |
| TextField | 文本輸入框 ：new TextField(controller: //文本控制器, obscureText: "hint文本"); |
| Image | 圖片加載: new FadeInImage.assetNetwork( placeholder: "預(yù)覽圖", fit: BoxFit.fitWidth, image: "url"); |
| FlatButton | 按鍵點(diǎn)擊: new FlatButton(onPressed: () {},child: new Container()); |
和Android對(duì)應(yīng)關(guān)系
| Android | 內(nèi)容 | Flutter | 內(nèi)容 | IOS |
|---|---|---|---|---|
| Views | 通過invalid更新 | StateXXWidget | 通過setState來更新狀態(tài) | UIView |
| Views | addChild() 或 removeChild() 添加或者刪除子 View | StateXXWidget | 控制子 Widget 的創(chuàng)建 | UIView 可動(dòng)態(tài)修改 |
| View動(dòng)畫 | 通過 XML 文件定義動(dòng)畫弟劲，也可以調(diào)用 View 對(duì)象的 animate() 方法 | Animation<double> | AnimationController 開控制 | animate(withDuration:animations:) |
| 自定義繪制 | Canvas和Paint等 | CustomPaint | CustomPainter實(shí)現(xiàn) | CoreGraphics |
| 自定義View | 繼承 View | 自定義Widget | 通過組合更小的 Widget 來創(chuàng)建自定義 Widget | 繼承UIView |
| Intent | 組件間通信使用Intent | Navigator | Navigator 和 Route，使用intent可以用額外插件 | UINavigationController |
| 外部Intent | manifest中注冊(cè)接收 | 外部Intent | manifest中注冊(cè)接收后姥芥，使用MethodChannel通過原生發(fā)過來 | URL scheme |
| 異步 UI | runOnUiThread() Looper | Isolate | async/await兔乞，不能分享內(nèi)存，setState/SendPort&ReceivePort來更新UI | Looper |
| OkHttp | OkHttp | http包 | 'package:http/http.dart' as http | |
| ProgressBar | ProgressBar | ProgressIndicator | ProgressIndicator的子類 | UIProgressView |
| 圖片 | drawable凉唐，mipmap | 圖片 | asset | Images.xcasset |
| 字符串 | string.xml | 字符串 | 代碼中 | Localizable.strings |
| gradle | pubspec.yaml | Podfile | ||
| 組件生命周期 | ActivityLifecycleCallbacks | Widgets生命周期 | didChangeAppLifecycleState | ViewController |
| LinearLayout | Row/Column | |||
| RelativeLayout | Row/Column | Row/Column,Stack Widget,聲明孩子相對(duì)父親的布局規(guī)則 | ||
| ScrollView | ListView | 既是一個(gè) ScrollView庸追，也是一個(gè) ListView | UITableView 和 UICollectionView | |
| 事件監(jiān)聽 | XXListener | 事件監(jiān)聽 | onPressed,OnTap等 | tableView:didSelectRowAtIndexPath: |
| ListView | adapters | ListView | List<Widget>需要傳入一組widget | |
| ListView | onItemClickListener | ListView | 每個(gè)widget自我管理事件 | GestureRecognizer |
| ListView | notifyDataSetChanged | ListView | ListView.Builder | reloadData |
| 自定義字體 | FontFamily | pubspec.yaml配置 | TextStyle(fontFamily: 'MyCustomFont') | info.plist |
| EditTextView | TextField | onSubmitted,decoration | ||
| 主題 | manifest中theme | MaterialApp | ThemeData |
