Flutter升级至3.0.0版本问题记录

1.Stack组件的 overflow 属性被废弃,需改为使用 clipBehavior 属性

原有属性报错截图:


image.png

解决方案:


image.png
overflow: Overflow.visible   
改为   
clipBehavior: Clip.none
2.原有flutter package里面的FlatButton组件被废弃,需要用其他按钮组件代替(这里我用自定义按钮组件代替)

原有组件使用报错截图:


image.png

image.png

解决方案:


image.png
其中,initInkWellBtn的实现为:
/// 全局自定义按钮 - 放在公共文件下,可供项目任意处调用
Widget initInkWellBtn(Widget widget, Function action) {
  return InkWell(
    onTap: () {
      debounce(action);
    },
    child: widget,
  );
}
3.Scaffold.of(context)showSnackBar属性被废弃

原有属性报错截图:

image.png

解决方案:将Scaffold替换为ScaffoldMessenger,即:

image.png
4.WhitelistingTextInputFormatter属性被废弃

原有属性报错截图:

image.png

解决方案:WhitelistingTextInputFormatter属性替换为:FilteringTextInputFormatter

image.png
5.RaisedButton组件被废弃,改为使用ElevatedButton

原有组件报错截图:


image.png

解决方案:


image.png
ElevatedButton(style: ButtonStyle(
  shape: MaterialStateProperty.all(RoundedRectangleBorder(
      borderRadius: BorderRadius.circular(this.borderRadius))),
  backgroundColor: MaterialStateProperty.all(
      isGradient ? Colors.transparent : color),
  // 设为透明色
  elevation: MaterialStateProperty.all(0),
 ))
6.flutter升级至3.0.0版本之后,运行flutter doctor正常,再运行flutter pub get报错:

image.png

暂时删除flutter_test组件,后续需要的时候再引入

7.运行成功之后,报警告:
image.png
Warning: Operand of null-aware operation '!' has type 'WidgetsBinding' which excludes null

指的是Flutter3.0.0之后,WidgetsBinding的实例instance不能为空,所以不需要!

解决方案:

1、本地的语法如果用到WidgetsBinding.instance,则手动去掉!
2、第三方库需要去 pub.dev 检查当前版本是否适配Flutter 3.0.0,以下是本人整理的需要升级至匹配Flutter 3.0.0的库:

`provider`的版本由`5.0.0`升级至`6.0.0`
`wechat_assets_picker`的版本由`5.5.8`升级至`6.0.0`
`percent_indicator`的版本由`3.0.1`升级至`4.2.0`
`qr_code_scanner`的版本由`0.6.1`升级至`1.0.0`
`get`的版本由`4.3.8`升级至`4.6.2`
8.下拉刷新pull_to_refresh组件已不支持Flutter 3.0.0,需替换为pull_to_refresh_flutter3 ^2.0.1,语法基本一致,手动修改下文件引用即可
image.png

解决方案:


image.png

image.png
9.dropdown_search的版本由1.0.0升级至4.0.0
(1)修改DropdownSearch类型为menu
image.png

解决方案如下:


image.png
/// 菜单选中配置
popupProps: PopupProps.menu(
  showSelectedItems: true,
  itemBuilder: customPopupItemBuilderExample,
),
/// hint文案
dropdownSearchDecoration: InputDecoration(
  hintText: '请选择改价原因'
),
(2)修改DropdownSearch类型为bottomSheet

报错如图:


image.png

解决方案如图:


image.png
popupProps: PopupProps.modalBottomSheet(
                showSelectedItems: true,
                itemBuilder: customPopupItemBuilderExample,
                modalBottomSheetProps: ModalBottomSheetProps(
                    shape: RoundedRectangleBorder(
                        borderRadius: BorderRadius.only(
                            topLeft: Radius.circular(12),
                            topRight: Radius.circular(12))))),

(3)修改DropdownSearch类型为dialog
报错如图示:

image.png

解决方案如图:


image.png
asyncItems: (filter) => logic
                                              .getBuyerList(filter),
                                        popupProps: PopupProps.dialog(
                                          showSearchBox: true,
                                          dialogProps: DialogProps(
                                            constraints: BoxConstraints(maxHeight: 300)
                                          )
                                        )
10.图表charts_flutter组件已不支持Flutter 3.0.0,需替换为charts_flutter_new ^0.12.0,语法基本一致,手动修改下文件引用即可

报错截图如下:


image.png

解决方案修改:


image.png
import 'package:charts_flutter_new/flutter.dart' as charts;
11.图片多选组件multi_image_picker已不支持Flutter 3.0.0,删除,更换为wechat_assets_picker ^7.3.0及以上版本

报错如下:


image.png

解决方案如下:


image.png
/// 必要的时候调用`clickIconFromPlatform `方法即可
CommonUtil.clickIconFromPlatform(5).then(data) {
  /// 选中的图片数据data
 console.log(data);
}
static Future<List<MultipartFile>> clickIconFromPlatform(count) async {
    List<MultipartFile> files = [];
    try {
      List<AssetEntity>? result = await AssetPicker.pickAssets(getCurContext(),
          pickerConfig: AssetPickerConfig(
            maxAssets: count,
            requestType: RequestType.image,
            themeColor: ColorConfig.main
          )
          );
      List<AssetEntity> resultList = result ?? [];
      if (resultList.length > 0) {
        for (int i = 0; i < resultList.length; i++) {
          AssetEntity entity = resultList[i];
          Uint8List? imageData = await entity.thumbnailDataWithSize(ThumbnailSize((entity.width*0.7).toInt(), (entity.height*0.7).toInt()), quality: 70);
          if(imageData!=null){
            //获得一个uuud码用于给图片命名
            final String uuid = Uuid().v1();
            //获得应用临时目录路径
            final Directory _directory = await getTemporaryDirectory();
            final Directory _imageDirectory =
            await new Directory('${_directory.path}/image/')
                .create(recursive: true);
            var path = _imageDirectory.path;
            print('本次获得路径:${_imageDirectory.path}');
            //将压缩的图片暂时存入应用缓存目录
            File imageFile = new File('${path}originalImage_$uuid.png')
              ..writeAsBytesSync(imageData.toList());
            print(imageFile.path);

            var file = MultipartFile.fromFileSync(imageFile.path,
                filename: 'originalImage_${uuid}.png');
            files.add(file);
          }
        }
      }
      return files;
    } catch (e) {}
    return [];
  }
12.点击某些页面,报错如下:
Unhandled Exception: This widget has been unmounted, so the State no longer has a context (and should be considered defunct).
Consider canceling any active work during "dispose" or using the "mounted" getter to determine if the State is still active

image.png

解决方案:
在当前StatefulWidgetinitState的方法里完成初始化操作

@override
  void initState() {
    super.initState();
    /// 完成初始化操作
  }
13.A页面跳转B页面(B页面为预览图片页),再从B页面返回时,报错如下:
[VERBOSE-2:dart_vm_initializer.cc(41)] Unhandled Exception: Looking up a deactivated widget's ancestor is unsafe.
At this point the state of the widget's element tree is no longer stable.
To safely refer to a widget's ancestor in its dispose() method, save a reference to the ancestor by calling dependOnInheritedWidgetOfExactType() in the widget's didChangeDependencies() method.

解决方案:上面说的意思是不是安全的引用小部件,就是已经销毁的界面然后重复销毁,会报上面错误

方案1:
// 只需在报错代码行外层加个判断,关键代码如下所示:
// 当mounted为true时才可以调用context的属性或方法
if (context.mounted) {
   // 报错的代码
}

方案2:
// 项目中用到`photo_view `组件库,当前版本为`0.13.0`,升级为`0.14.0`,版本更新中有组件已解决
image.png
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 219,427评论 6 508
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 93,551评论 3 395
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 165,747评论 0 356
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 58,939评论 1 295
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 67,955评论 6 392
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 51,737评论 1 305
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 40,448评论 3 420
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 39,352评论 0 276
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 45,834评论 1 317
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,992评论 3 338
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 40,133评论 1 351
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 35,815评论 5 346
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 41,477评论 3 331
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 32,022评论 0 22
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 33,147评论 1 272
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 48,398评论 3 373
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 45,077评论 2 355

推荐阅读更多精彩内容