Flutter學習筆記

初學Flutter,簡單的做個筆記,實時更新

1.Flutter中進行頁面跳轉:

 onPressed: () {
    Navigator.push(context, new MaterialPageRoute(builder: (context)=> new MyScaffold(),)
       );
   }

或者,在main.dart中統一管理

 home: MyHomePage(),
 //路由
 routes: <String, WidgetBuilder> {
    '/LayoutPage':(BuildContext context) =>new LayoutPage(),
   },

在需要需要跳轉的地方

 Navigator.of(context).pushNamed('/LayoutPage');

2.類之間傳值

new MyFadeTest(title: 'Fade Demo')

接收類

   final String title;
      //帶參數的構造方法
      MyFadeTest({Key key, this.title}) : super(key: key);

使用這個值

new Text(widget.title)

或者:

final String lable;
 CustomButton(this.lable);
 @override
  Widget build(BuildContext context) {
    return new RaisedButton(onPressed: (){},child: new Text(lable));
  }

當使用CustomButton類時候

new CustomButton('Hello')

3.斷點調試
在VScode編輯器中,跟AS同樣的方式打一個斷點,之後按F5,當代碼執行到斷點處就會停止
參考資料:http://www.jintiankansha.me/t/uCAhjuWVDQ

打印日誌:print() ;結果會打印到控制檯 DEBUG CONSOLE中。

4.異步操作

@override
  Widget build(BuildContext context) {
    // 當請求完數據後調用setState()方法,會重新調用此方法
  }
  //async 相當於異步操作  await等待這個耗時操作
  void loadData() async {
   String dataURL = "https://jsonplaceholder.typicode.com/posts";
    http.Response response = await http.get(dataURL);
    // setState 會觸發build方法再次運行並更新數據
    setState(() {
     List widgets = json.decode(response.body);
    });
  }

說明:Dart是單線程語言,所以在UI線程執行網絡請求不會導致程序阻塞。但是如果太大數據時候,需要使用Isolates。

5.動態顯示隱藏View

new Offstage(
  // true:隱藏  false:顯示
  offstage: false,
  child: new RaisedButton(
    child: new Text('fff'),
    onPressed: _layout,
  ),

)6.操作符

var i;
  init() {
    i ?? 999; //如果i爲空,就返回999
    i ??= 999; // 如果i爲空,就爲i賦值999
    var result = i ~/ 99; //整除
    // result =10
  }

7.快捷操作
-.在編輯器中輸入stl時候,會自動生成無狀態控件模塊,輸入stf會成功有狀態控件模塊

8.佈局相關
1.Widget和Widget之間通過child進行嵌套。
2.有的widget只能有一個child,如果想用多個child,需要在外層包裹一個children:[]

9.ListTitle 佈局很好用
參考:https://juejin.im/post/5c88d6c4f265da2de970bc24

10.Android原生接收Flutter傳值中文亂碼問題

String decodeValue = URLDecoder.decode(value, "UTF-8");

11.原生接入Flutter熱重載
Terminal中命令行進入flutter_module目錄下, 輸入命令 flutter attach,然後 Run一次項目,之後就可以在Terminal 中輸入r(熱加載)、R(熱重啓)

12.Flutter中使用本地資源(文件、圖片)
需要先在pubspec.yaml文件中聲明需要assets,比如我的圖片路徑是assets/images

flutter:
  uses-material-design: true
  assets:
    - assets/images/class_default.png
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章