Flutter新手坑点详解

Flutter新手坑点详解

记录一下从零开始的Flutter遇到的坑点，可能会长期更新
原文链接：https://blog.csdn.net/weixin_44259356/article/details/104905384
由浅入深

Container设置自定义圆角

效果图

代码

注：颜色不能与Container color同时设置，会冲突。

decoration: new BoxDecoration(
 //设置颜色
 color: Color(0xFFCE9F76),
 //设置四周圆角 角度 这里 设置了下面两个角为圆
 borderRadius: BorderRadius.only(bottomRight: Radius.circular(10),bottomLeft:Radius.circular(10)),
 ),

Flutter颜色

格式

color: Color(0xFFCE9F76)

或者

color:Colors.red

说明

第一种为rgba设置放松，0x后两位为透明度，后四位为16位颜色，另外还有RGBO和ARGB设置方式可自行查阅。

TabBar自定义菜单栏

用TabBar自定义菜单切换时如果提示为定义部件宽度，无法显示则应该在Expanded外面嵌套Container

SliverList设置页面滑动效果

效果图

代码

@override
Widget build(BuildContext context) {
  return CustomScrollView(
    shrinkWrap: true,
    // 内容
    slivers: <Widget>[
      new SliverPadding(
        padding: const EdgeInsets.all(0.0),
        sliver: new SliverList(
          delegate: new SliverChildListDelegate(
            <Widget>[


            ],
          ),
        ),
      ),
    ],
  );
}

异步请求消除地狱回调

async/await

//登陆异步执行流程
  loginStream(String mobile, String pwd) async {
    try{
      User user=await loginByPwd(mobile,pwd);
      //获取团队信息
      await getAgentInfo();
      //执行接下来的操作
      print("登陆成功");
      Provider
          .of<UserModel>(context, listen: false)
          .user = user;
    } catch(e){
      //错误处理
      print("错误");
      print(e);
    }
  }

Json转model

使用json_model

导入包

dev_dependencies:
  json_model: #latest version
  build_runner: ^1.0.0
  json_serializable: ^2.0.0

执行

flutter packages pub run json_model

就能在model目录下看到mod类了，每次修改json都必须执行此命令，不然数据无法持久化保存