目錄
Flutter學習（一）
Flutter學習（二）-FlutterGo學習
FlutterGo是阿里拍賣前端團隊針對於時下很火的跨平臺移動解決方案推出的實例APP項目，對於Flutter初學者，學習掌握此項目是極其有益的。
github地址：https://github.com/alibaba/flutter-go
目錄結構
-lib dart源文件
----routers router路由文件
----views 存放UI文件，文件以_page結尾
fluro
Flutter本身提供了路由機制，作個人的小型項目，完全足夠了。但是如果你要作企業級開發，可能就會把入口文件變得臃腫不堪。而再Flutter問世之初，就已經了企業級路由方案fluro。
github地址：https://github.com/theyakka/fluro
這邊文章寫的比較詳細：Flutter路由_fluro引入配置和使用
接着Flutter 開發文檔中的demo繼續學習fluro。
在mai.dart中點擊右上角，會打開已經收藏的名字，原文demo中使用flutter自帶的路由實現，現在我用fluro來實現。
目錄結構如下：
1、先寫收藏列表，這個業務界面很簡單，就把傳過來的名字展示一下（suggestion_page.dart）：
import 'package:flutter/material.dart';
class SuggestionPage extends StatefulWidget {
String suggestions;
SuggestionPage(String suggestions) {
this.suggestions = suggestions;
}
@override
State<StatefulWidget> createState() {
return SuggestionWidget();
}
}
class SuggestionWidget extends State<SuggestionPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
body: new Center(
child: Text(widget.suggestions),
),
);
}
}
2、處理router跳轉的handle（router_handle.dart）：
import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
import 'package:flutter_app/views/suggestion_page.dart';
var suggestionHandle = new Handler(
handlerFunc: (BuildContext context, Map<String, List<String>> params) {
var suggestions = params['suggestions'].first; // router參數
return new SuggestionPage(suggestions); // 收藏界面
}
);
申明一個handle，由handle跳轉到相應的業務界面，並且傳遞參數。
3、定義路由文件（routers.dart）：
import 'package:fluro/fluro.dart';
import 'package:flutter/material.dart';
import 'router_handle.dart';
class Routers {
static String root = '/'; // 根目錄
static String suggestion = '/suggestion'; // 收藏界面
static void configRouters(Router router) {
router.notFoundHandler = new Handler(
handlerFunc: (BuildContext context, Map<String, List<String>> params) {
print('ERROR====>ROUTE WAS NOT FONUND!!!');
}
);
router.define(suggestion, handler: suggestionHandle);// 收藏界面
}
}
定義router路徑與對應的handle，這樣使用路徑進行路由時，可以找到對應的handle處理。
4、全局管理router文件（application.dart），這樣不用每次都去new router：
import 'package:fluro/fluro.dart';
class Application {
static Router router;
}
5、在main.dart中初始化路由：
class MyApp extends StatelessWidget {
MyApp() {
final router = Router();
Routers.configRouters(router);
Application.router = router;
}
// ...........
//調用路由跳轉
Application.router.navigateTo(context, '${Routers.suggestion}?suggestions=${strJson}');
}
配置全局路由。
參數好像只能是String類型的？？？
Future異步
參考：Flutter進階篇（4）-- Flutter的Future異步詳解
Flutter中的異步其實就是用的Dart裏面的Future，then函數，回調catchError這些東西。
創建Future
void testFuture(){
Future future = new Future(() => null);
future.then((_){
print("then");
}).then((){
print("whenComplete");
}).catchError((_){
print("catchError");
});
}
這裏的執行結果是：
then
whenComplete
future裏面有幾個函數：
- then：異步操作邏輯在這裏寫。
- whenComplete：異步完成時的回調。
- catchError：捕獲異常或者異步出錯時的回調。因爲這裏面的異步操作過程中沒有遇到什麼錯誤，所以catchError回調不會調用。
在我們平時開發中我們是這樣用的，首先給我們的函數後面加上async關鍵字，表示異步操作，然後函數返回值寫成Future，然後我們可以new一個Future，邏輯前面加上一個await關鍵字，然後可以使用future.then等操作。下面是一個示例操作，爲了方便演示，這裏的返回值的null。平時開發中如果請求網絡返回的是json，我們可以把泛型寫成String；泛型也可能是實體類（entity/domain），不過要做json轉實體類相關操作。
在flutterGo中的示例：
Future<SharedPreferences> _prefs = SharedPreferences.getInstance();
Future<bool> _unKnow;
//獲取sharePre
_unKnow = _prefs.then((SharedPreferences prefs) {
return (prefs.getBool('disclaimer::Boolean') ?? false);
});
/// 判斷是否需要彈出免責聲明,已經勾選過不在顯示,就不會主動彈
_unKnow.then((bool value) {
new Future.delayed(const Duration(seconds: 1), () {
if (!value &&
key.currentState is DisclaimerMsgState &&
key.currentState.showAlertDialog is Function) {
key.currentState.showAlertDialog(context);
}
});
});
_prefs 是SharedPreferences的異步，_unKnow是bool的異步，_unKnow由_prefs 獲取到。
SharedPreferences.getInstance()的實現方式如下，用了async 字段修飾：
static Future<SharedPreferences> getInstance() async {
if (_instance == null) {
// ...
}
return _instance;
}