美文网首页
Flutter开发中的Tips

Flutter开发中的Tips

作者: peterXpq | 来源:发表于2020-11-26 18:03 被阅读0次

    1、Container 默认是居中,可以设置方向

    alignment: Alignment.centerLeft,
    

    3、ListView 外面嵌套Expand

    4、在Row 中 添加

    Expanded(
    child: SizedBox.shrink(),
    ),
    可以使 后面的Widget 放在最后,相当于Android 的 右对齐
    
    
    mainAxisAlignment: MainAxisAlignment.spaceBetween,
     可以让 Row 中的两个子布局 分别排布在两头
    

    5、判断List 是否为空

    List list=List();
    list.isEmpty() 判断集合为空
    list.isNotEmopty()判断集合不为空
    

    6、Colum 垂直布局

    水平方向 靠左对齐===》CrossAxisAligment.start
    

    7.Dart 动态解析key-value

    1. 原始数据为Map<String,dynamic> 类型
    2.原始数据就是json字符串,需要转化为1的类型
    下面贴出来要解析的数据:
    

    8、GestureDetector 点击空白区域 没有点击效果;

    解决办法:GestureDetector(
        behavior: HitTestBehavior.opaque,
        onTap: (){
          NavigatorUtils.gotoObjectDetail(context, data.objKey);
      }
     );
    

    9.Colum 竖直布局 对齐方式

    crossAxisAlignment: CrossAxisAlignment.start,
    

    10.CustomScrollView 嵌套 ListView 如何让ListView区域不滚动?

        physics: NeverScrollableScrollPhysics()==> 不滚动
        BouncingScrollPhysics() ==>IOS 效果
        ClampingScrollPhysics() ==>Android 效果
        FixedExtentScrollPhysics () ==>固定范围内的滚动效果
    

    11、字符串中要加空格,怎么加?

      String string ='哈哈\t你好啊'
      String name='${property.name+'\t'+男生}'
    

    12、时间戳格式化?

    第三方视频播放器

    chewie: ^0.9.10

    14、记录报错:

    Cleartext HTTP traffic to 192.168.12.18 not permitted
    原因:
    Android P(9.0)及以上要求App内链接全部加密(https),使用明文链接会报以下错误:
    Cleartext HTTP traffic to 192.168.12.18 not permitted
    办法:
    在安卓的清单文件中,添加如下一行:
    android:usesCleartextTraffic="true"
    

    15、TabBarView 每次切换都会重新走initState()

    解决办法:
    with AutomatickeepAliveClientMixin 
    重写方法:
    @override
    bool get wantKeepAlive => true
    也用在保持页面状态,当新开页面返回时,页面会刷新,也可用此方法
    

    16.字符串比较

    1、Comparable.compare(str1,str2)==0  表明相等
    2、str1==str2 
    

    17.用户点击展示“水波纹”效果 InkWell

    18.Container 添加外部描边 和 圆角 ShapeDecration

    Container(
      height: 30,
      decoration: ShapeDecoration(
      color: MyColors.color_1246FF,
      shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(7),)),
      margin: EdgeInsets.only(left: 10, right: 10, bottom: 10),
      child: Center(
        child: Text(
          '复制到剪切板',
          style: TextStyle(color: MyColors.white, fontSize: 16),
         ),
      ),
    )
    

    19.粘贴板操作

     1、复制内容到粘贴板
    Clipboard.setData(ClipboardData(text: 'templateString'));
    
    2、获取粘贴板的内容 (异步调用)
    onTap: () async {
      print('获取粘贴板的数据');
      ClipboardData data =
        await Clipboard.getData(Clipboard.kTextPlain);
      if (data != null) {
            setState(() {
              this.barcode = data.text;
        });
      }
    },
    

    3、清除粘贴板的内容

    因为不像Android那样,有clear 方法,所以只能赋值空字符串:
    Clipboard.setData(ClipboardData(text: ''));
    

    20、限制输入框为数字

    TextField(
          inputFormatters: [
                           WhitelistingTextInputFormatter(RegExp("[a-zA-Z]")),//只允许输入字母
          ],
     ),
     TextField(
          inputFormatters:[WhitelistingTextInputFormatter.digitsOnly],//只允许输入数字
     ),
    TextField(
          inputFormatters: [
                            WhitelistingTextInputFormatter(RegExp("[0-9.]")),//只允许输入小数
                          ],
    )
      keyboardType: TextInputType.number,/// 数字   结合上面 
      /// 不显示下面的横线
     decoration: InputDecoration(border: InputBorder.none),
    

    21、as is

    as  类型转换
    is  当对象是相应类型时返回true;  相当于java => instance of 
    is! 当对象不是相应类型时返回true
    
    示例:
    if(user is User){
        user.name='Flutter'
     }
    /// 如果确定user 是User的实例,则可以通过as 直接简化代码
    (user as User).name='Flutter';、
    
    注意:上面两段代码并不相等,当user的值为null 或者不是User 对象,
    第一段不会做任何事情,但第二段会报错;
    

    22、退出栈中的多个路由

    PopUtil
    

    23、Eventbus 的应用 相互传值

    24、控制显示的控件

    bool isVisibily=true;
    Offstage(
      offstage:isVisibily,
      child:Widget()
    )
    * 默认是不显示
    

    26、GridView 图文上下排列 宽高的问题?
    暂时还没解决办法,都是写死的宽高比例,不能像Android 那样,wrap_content ,高度自适应

    28、调用相机 IOS 需要添加权限 勿忘

    29、Future<int> 转化为 int

    Future<int> Function()' can't be assigned to the parameter type 'num'
    比如:Future<int> length =file.length;
    num size = await length; 
    

    30、上传文件,二进制传输

    一般: 'application/x-www-form-urlencoded' 
    要变为:需要使用multipart/form-data格式来上传文件
    结论:已实现,后续补充Demo
    

    32、解决SmartRefresher +ListView / GridView 图片闪烁的问题

    1、首先 需要在主页面 继承 AutomaticKeepAliveClientMixin,
     复写: @override
    bool get wantKeepAlive => true;
    2、将Item 作为一个单独组件封装起来,并 重复上面的步骤 
    3、展示图片的控件需要用 Cache的NetworkImage 
    

    完成上面3步,在列表滚动的时候,可见item再次可见的时候图片不会重新加载,
    打开新页面返回的时候图片也能保持住状态,不会重新加载了!

    33、Hero 动画 包裹的组件不能是整个列表的Item,

    1、如果全部包裹,返回当前页面会报页面越界的报错
    2、正确的做法是 只包裹需要动画的组件,比如说只包裹图片
    

    34、Flex 布局 中 Expand 如何添加间距(Margin)?

    相关文章

      网友评论

          本文标题:Flutter开发中的Tips

          本文链接:https://www.haomeiwen.com/subject/garziktx.html