flutter的坑,flutter难不难

Flutter遇到的坑

最近写了一个LoadingView用于页面的网络加载，使用的是StatefulWidget。由于项目是使用的Get对状态进行控制的，所以在GetBuild中对Loading进行刷新。但在使用中发现rebuild LoadingView没有刷新状态，看参数是在Widget中更新了的。

后续定位发现，StatefulWidget在rebuild的时候，并不会重新执行initState方法，而只会执行build方法，这也符合state和widget的一对多原则。知道问题所在，修改也非常简单。去掉state中的status变量，使用widget中的initStatus值即可。

在此记录，对于Get的一些注意点。

目前项目中对Widget进行了内嵌LoadingView的BaseWidget封装，对GetxController进行了LoadingStatus状态操作的BaseController封装。发现在第二个继承了BaseWidget的页面中，对绑定的Controller进行update操作无效。

阅读源码后发现，GetBuilder的global参数默认是true，在没有指定tag的情况下，会根据controller作为key进行全局map，若第二次调用时，会先通过Controller进行get，正好我们的BaseWidget使用的是BaseController导致全局只有一个Controller从而导致第二个页面无法刷新问题。我们只需要在基类中将global改为false，直接使用init的controller即可。

目前在做App的主题色切换功能，发现在部分主题色下，Appbar的标题和Action自动变成深色，查阅资料后得知，由于色值的computeLuminance值过大导致Brightness自动为Brightness.light。

知道原因后就好办了，通过设置ThemeData里面的Brightness类型的参数为Brightness.dark（注意我们只需要Appbar为深色，brightness参数控制的是整个页面，不修改）。经验证，primaryColorBrightness控制Appbar的标题和action，修改即可。

相关问答

Q1: flutter 蓝牙开发遇到的坑

flutter 蓝牙开发遇到的坑

最近在做个flutter蓝牙功能，用的flutter_blue,在iOS上没有任何问题，照着例子写完，正常运行蓝牙功能，但是在安卓上发现各种坑，用这个插件首先是有些设备拿不到设备名称，还有就是读写特征和ios上拿到的也不一样。折腾好久，最后在github上找到外国友人给出的方案，就是用flutter_bluetooth_serial这个插件可以解决以上问题，就试了一下，结果真可以解决问题，而且这个用法感觉比flutter_blue 更强大，不需要通过读写特征值进行通讯，直接就能通过connection写入和接收数据。做下记录，希望能帮到有同样问题的人。因为我在遇到问题时，百度了全是不能解决问题的办法。

Q2: Flutter 集成第三方蓝牙库踩坑记录

最近在写flutter应用，需要集成蓝牙功能，用了一个第三方的库，踩了一些坑，做一下记录。

这是库的地址 PhilipsHue/flutter_reactive_ble: Flutter library that handles BLE operations for multiple devices. (github.com)

安卓主要的坑就是，在使用蓝牙功能的时候，需要获取定位权限，这个需要动态获取。

集成之后，编译出错，提示Swift Compiler Error。

（1）首先尝试，修改对应三方库的Swift编译版本。

我这边尝试修改，没有成功。

（2） 没办法，我这边手动修改三方库的源码文件，进行修复。重新编译成功。

其他问题

Q3: win7安装flutter踩的坑记录

之前安装flutter sdk已经安装ok了，但是最近升级了一下flutter版本到1.26，发现崩了，记录一下出的错及解决方法。

提前已经安装好android studio 及 android 环境

1，运行flutter_console，输入flutter doctor 闪退问题

cmd闪退，放到PowerShell中执行，我是发现以下的错误

fix:PowerShell最低要求为5.0，

升级方案：

2：运行flutter doctor 无反应问题

第一种方案-检查环境变量配置

第二种方案-fc

3:android studio创建flutter project时间比较长问题

运行flutter

报错提示上看得执行flutter doctor --android-licenses

到此就可以正常执行了

Q4: 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内部