正文
flutter每次import好麻烦 flutter onresume
小程序:扫一扫查出行
【扫一扫了解最新限行尾号】
复制小程序
【扫一扫了解最新限行尾号】
复制小程序
原生iOS工程引入Flutter
1.首先将flutter和原生项目放在同一级文件下面
2.接下来要在原生的oc工程中引入cocoapod来做管理,打开podfile文件
3.执行pod install命令,flutter就引入进来了
4.从原生跳转flutter页面
引入头文件 import Flutter
Flutter踩坑之旅
记录下自己踩过的坑,怕忘了
一.TextField:
1.去掉输入数字的计数:decoration中的counterStyle: TextStyle(color: Colors.transparent).
2.去掉获取和失去焦点时边框改变颜色的效果:decoration内border: InputBorder.none,
3.去边框时设置BorderSide的width为0或color: Colors.transparent后依然存在边框时,需要设置为borderSide: BorderSide.none
4.设置背景色需要在decoration内 filled:true, fillColor: Colors.blue同时设置才会显示
二.Uint8List类型和string类型,Listint的转换
连续两次base64解码时,参数只能使用string类型,但是base64解码后是Uint8List类型,此时需要将Uint8List类型转换为string类型,使用:utf8.decode(Uint8List)即可,需要import 'dart:convert';
Listint转Uint8List:读取接口时获取的数据是Listint的图片数据,想显示时需要转成Uint8List,然后使用Image.memory(),使用:Uint8List.fromList(Listint)即可
三.报错:DioError [DioErrorType.DEFAULT]: FormatException: Unexpected character (at character 1)MGFlMFo0NEZ3RWNMbE5YbGNGOXZGcUlJdUhIS2x2Q3NlckxqWXlEeG5JWndZdXIrSUpLN3ZOczR...
这是因为dio请求返回的数据默认是以json的格式读取的,而返回的数据是密文形式,需要修改dio的Options的responseType为ResponseType.PLAIN,这样返回的数据就以字符串形式处理.
四.去掉点击控件背景出现的水波纹效果,即去掉md的效果:
在main.dart的MaterialApp内的theme加上splashColor: Colors.transparent
五.布局去掉沉浸式效果和布局设置占满全屏却无效的问题
使用Scaffold的body的布局默认是沉浸式的,将状态栏一起包含了,可以通过在body后添加一层SafeArea即可.
布局设置double.infinity占满全屏高度却无效,大部分情况都是因为某一级的父布局的高度已经有了限制,所以设置充满屏幕只会充满父布局,有些widget默认是按内容填充类似wrap_content就会导致写布局的过程中自己没有限制高度但最后的布局不是自己想要的,可以给各个父布局设置不同背景颜色来查看是从哪儿开始被限制了高度来排查问题.
六.占满剩余空间,类似android的match_parent可以使用double.infinity
七.LinearProgressIndicator
1.LinearProgressIndicator设置进度值的颜色为单一颜色:valueColor : new AlwaysStoppedAnimation(Color(JColor.blue))
2.给LinearProgressIndicator设置圆角:ClipRRect(
borderRadius:BorderRadius.circular(60.0),
child:LinearProgressIndicator(value:0.2,backgroundColor:Color(JColor.grayBg),valueColor:new AlwaysStoppedAnimation(Color(JColor.blue)),
)
八.Expanded:
1.若嵌套多层column且内容的高度都不确定需要占满剩余空间,需要每层的column的内容都嵌套一层expanded来申明每层都占满剩余的空间,否则最里面的内容层需要指定高度,不然会报错
九.Container设置最小/大宽度或高度:
constraints:BoxConstraints(minHeight:56),
十.滑动的widget嵌套:
1.解决滑动冲突:内层嵌套的滑动widget设置physics:NeverScrollableScrollPhysics()
2.解决滑动嵌套ui显示不出来或者报错,内层的滑动widget设置shrinkWrap:true
十一.使用multi_image_picker: ^4.3.4安卓运行报错Didn't find class "com.sangcomz.fishbun.FishBunFileProvider"
1.需要android工程支持androidx,需要在android工程的gradle.properties内添加android.enableJetifier=true和android.useAndroidX=true并点击右上角的open for editing in android studio,运行成功后就可以了
十二.使用textfield时的文字ui总是很高
使用了maxlength且只是在textfield的InputDecoration设置counterStyle的颜色为透明使下面的计数文字消失会导致文字ui很高,counter的计数文字只是颜色是透明但依然在布局中占了位置所以导致文字很高,直接使用counterText:""即可
十三.使用ListView报错Vertical viewport was given unbounded height
需要将ListView放入Expanded内部
Flutter开发性能提升之:如何避免Widget重复Build
问题描述:
在Flutter开发的过程中,当我们获取到新的数据或者数据发生变化,需要去执行setState进行页面刷新的时候,经常会出现不必要的子节点Widget也进行了build,但实际上我们是不想让它再次build,出现这些问题的典型情况是在使用FutureBuilder的时候,例如:
在上面这个示例中,如果再次调用Build方法,则会触发httpCall()的方法。
那么怎样才能避免不必要的部件构建呢?
分析:
在Flutter中,Build方法的设计方式是pure/without side effects,书面意思是无副作用的/纯粹的,简单点理解我们可以将其含义看作不会对外部的方法或者变量产生影响的。这是因为许多外部因素能够触发新的小部件的构建,例如这些情况:
但是,这也意味着Build方法可以不去触发httpCall()的方法或者不修改任何状态。
解决
回归问题,当前我们面临的问题是Build方法造成了副作用,也就是造成了无关的Build调用麻烦。
所以,只要我们使Build方法保持纯粹/无副作用,这样就算多少次调用它,也不会对其他Widget的Build方法产生影响。
在上面的示例中,我们将Widget转换为StatefulWidget,然后提取httpCall()到initState中,这样问题就解决了
另外,还可以使一个Widget能够在不强迫其子部件也构建的情况下进行重新构建。
在Widget的实例保持不变时;Flutter会有意识的不去重建子部件。这意味着我们可以缓存Widget树的某些部分,以防止不必要的重新构建。
最简单的方法是使用const修饰构造函数:
由于const的修饰,即使调用了数百次build,DecoratedBox的实例也将保持不变。
或者你可以这样使用以达到相同的结果:
在这个例子中,当StreamBuilder收到新值的通知时,即使StreamBuilder的Column进行了重构,subtree也不会进行重构。这是因为由于闭包,MyWidget的实例没有改变。
这种模式在动画中经常使用。典型的是使用AnimatedBuilder和所有的*Transition时,例如AlignTransition。
我们还可以将subtree存储到类的一个字段中,但是并不推荐你这样做,因为它会破坏Flutter的热重载。
Flutter跨组建传递数据的三种方式
背景:flutter组件嵌套都很深,依次传递数据很麻烦,所以最好是能够跨组件传递。有三张跨组件的方式:InheritedWidget、Notification、Eventbus.
是一种自上而下的传递数据的方式。
使用步骤:
它的数据流动方式和InheritedWidget刚好相反,从子控件向上面传递。
具体使用
跟android 原生的eventbus原理和使用一样。
Flutter 升级空安全攻略
1、升级依赖的插件版本pubspec.yaml(包括example),pub get 解决依赖冲突
2、pubspec.yaml所在路径下执行 dart pub upgrade --null-safety 检查是否所在flutter工程依赖库是否都升级到了空安全版本
example示例需要进入example路径下检查
1、List默认构造方法删除,改用[];
main.dart文件main方法第一行增加CustomFlutterBinding();
2、flutter clean,删除所有 pubspec.lock文件 ,pub get
3、FutureOr报错引入头文件、import 'dart:async';
4、属性用优先用late 或者 ?声明,在确定不为空情况才用!
【Flutter】引入包import的各种含义,及常用命名规则
import 'dart:xxx'; 引入Dart标准库
import 'xxx/xxx.dart'; 引入相对路径的Dart文件
import 'package:xxx/xxx.dart'; 引入Pub仓库pub.dev(或者pub.flutter-io.cn)中的第三方库
import 'package:project/xxx/xxx.dart'; 引入自定义的dart文件
import 'xxx' show compute1,compute2 只导入compute1,compute2
import 'xxx' hide compute3 除了compute都引入
import 'xxx' as compute4 将库重命名,当有名字冲突时
library compute5; 定义库名称
part of compute6; 表示文件属于某个库
文件导入顺序(从上到下依次)
dart sdk 内的库
flutter内的库
第三方库
自己的库(文件)
相对路径引用
命名规范:
文件夹:小写 下划线 lowercase_with_underscores
文件:小写 下划线 lowercase_with_underscores
类名:大写开头的驼峰命名法 UpperCamelCase
变量名:小写开头的驼峰命名法 lowerCamelCase
常量:小写开头的驼峰命名法 lowerCamelCase
首字母缩写词长度不超过两个字母的,首字母大写,比如 HttpRequest
长度两个字母的首字母缩写词可完全大写,比如 IOStream , DBUtils
但单个单词缩写仍然仅首字母大写,比如 Id
关于flutter每次import好麻烦和flutter onresume的介绍到此就结束了,不知道你从中找到你需要的信息了吗 ?如果你还想了解更多这方面的信息,记得收藏关注本站。