Flutter学习笔记

初学Flutter，简单的做个笔记，实时更新

1.Flutter中进行页面跳转：

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

或者，在main.dart中统一管理

 home: MyHomePage(),
 //路由
 routes:  {
    '/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

13.异步请求和等待，实现onActivityResult功能

打开新页面，并等待新页面返回值

void getResult() async {
    var result = await Navigator.push(
        context, MaterialPageRoute(builder: (context) => ResultTest()));
    print("返回值===$result");
  }

关闭页面，返回Result

 Navigator.pop(context, "返回值");

14.右滑关闭页面

只要使用CupertinoPageRoute打开的子页面，就可以实现右滑返回上一级功能

   Navigator.of(context)
            .push(CupertinoPageRoute(builder: (BuildContext context) {
          return BottomAppBarDemo();
        }));
   

15.ScrollView(ListVIdw)嵌套ListView问题
1).Listview显示不全
解决：在内部ListView添加 shrinkWrap: true

2).外层滚动控件滑动监听被内部ListVIew窃取
解决：

 Widget getListView(List data) {
    //sizeBox可以解决横向滑动列表展示问题
    return SizedBox(
      child: ListView.builder(
        // 解决ScrollView嵌套ListView时，ListView不显示问题
        shrinkWrap: true,
        // 解决滑动冲突
        physics: NeverScrollableScrollPhysics(),
        itemCount: data.length,
        itemBuilder: (BuildContext context, int position) {
          ...
        },
      ),
    );
  }