猫哥课堂 ducafecat.com
开通 VIP 会员, 观看所有视频、附件、猫哥密友、猫哥 VIP 群

flutter 3.7.x woo 课件代码升级说明

前言

flutter sdk 3.7.x 已经在广大开发者中流行,woo 的课程代码也在维护迭代,这次升级变化还是很大的,并且还修复了一个之前的 bug ,切换主题功能。

flutter 环境

❯ flutter --version ─╯ Flutter 3.7.3 • channel stable • https://github.com/flutter/flutter.git Framework • revision 9944297138 (5 周前)2023-02-08 15:46:04 -0800 Engine • revision 248290d6d5 Tools • Dart 2.19.2 • DevTools 2.20.1

pubspec.yaml 设置

environment: sdk: ">=2.19.0 <3.0.0" flutter: ">=3.7.0"

Badge 冲突

问题

The name 'Badge' is defined in the libraries 'package:badges/src/badge.dart (via package:badges/badges.dart)' and 'package:flutter/src/material/badge.dart (via package:flutter/material.dart)'. Try using 'as prefix' for one of the import directives, or hiding the name from all but one of the

处理

import 'package:flutter/material.dart' hide Badge;

隐藏 material 导包的 Badge 组件,当然也可以通过改别名方式。

modal_bottom_sheet 冲突

问题

Error (Xcode): ../../../../.pub-cache/hosted/pub.flutter-io.cn/modal_bottom_sheet-2.1.2/lib/src/material_with_modal_page_route.dart:4:1: Error: 'ModalBottomSheetRoute' is imported from both 'package:flutter/src/material/bottom_sheet.dart' and 'package:modal_bottom_sheet/src/bottom_sheet_route.dart'.

处理

这个问题是 modal_bottom_sheet 三方包的 material_with_modal_page_route.dart 文件报出的,我们可以clone他的2.1.2版本进行自行修复,或者升级一个版本看看。

modal_bottom_sheet: 3.0.0-pre

pinput 报错

问题

Error (Xcode): ../../../../.pub-cache/hosted/pub.flutter-io.cn/pinput-2.2.12/lib/src/pinput_state.dart:337:14: Error: The method 'FocusTrapArea' isn't defined for the class '_PinputState'.

处理

pinput: 2.2.31

dio 5 版本升级

lib/common/services/wp_http.dart

void onInit() { super.onInit(); // 初始 dio var options = BaseOptions( baseUrl: Constants.wpApiBaseUrl, connectTimeout: const Duration(seconds: 10), // 10000, // 10秒 receiveTimeout: const Duration(seconds: 5), // 5000, // 5秒 headers: {}, contentType: 'application/json; charset=utf-8', responseType: ResponseType.json, ); _dio = Dio(options); // 拦截器 _dio.interceptors.add(RequestInterceptors()); }

connectTimeout, receiveTimeout , 参数类型 Duration

void onResponse(Response response, ResponseInterceptorHandler handler) { // 200 请求成功, 201 添加成功 if (response.statusCode != 200 && response.statusCode != 201) { handler.reject( DioError( requestOptions: response.requestOptions, response: response, type: DioErrorType.badResponse, ), true, ); } else { handler.next(response); } }

type: DioErrorType.badResponse, 指定错误类型

Future<void> onError(DioError err, ErrorInterceptorHandler handler) async { final exception = HttpException(err.message ?? "error message"); switch (err.type) { case DioErrorType.badResponse: // 服务端自定义错误体处理 { final response = err.response; final errorMessage = ErrorMessageModel.fromJson(response?.data); switch (errorMessage.statusCode) { // 401 未登录 case 401: // 注销 并跳转到登录页面 _errorNoAuthLogout(); break; case 404: break; case 500: break; case 502: break; default: break; } Loading.error(errorMessage.message); } break; case DioErrorType.unknown: break; case DioErrorType.cancel: break; case DioErrorType.connectionTimeout: break; default: break; } DioError errNext = err.copyWith( error: exception, ); handler.next(errNext); }

使用 err.copyWith 方式自定义错误体返回

changeThemeMode 修改明亮暗色模式

lib/common/services/config.dart

// 切换 theme Future<void> switchThemeModel() async { _isDarkModel.value = !_isDarkModel.value; Get.changeThemeMode( _isDarkModel.value == true ? ThemeMode.dark : ThemeMode.light, ); await Storage().setString(Constants.storageThemeCode, _isDarkModel.value == true ? "dark" : "light"); Get.offAllNamed(RouteNames.systemSplash); }
// 初始 theme void initTheme() { var themeCode = Storage().getString(Constants.storageThemeCode); _isDarkModel.value = themeCode == "dark" ? true : false; }

lib/main.dart

...GetMaterialApp( ... // 样式 theme: AppTheme.light, darkTheme: AppTheme.dark, // 主题 themeMode: ConfigService.to.isDarkModel ? ThemeMode.dark : ThemeMode.light, ...

升级到最新三方包

pubspec.yaml

dependencies: flutter: sdk: flutter flutter_localizations: sdk: flutter # The following adds the Cupertino Icons font to your application. # Use with the CupertinoIcons class for iOS style icons. cupertino_icons: ^1.0.5 # getx 框架 get: 4.6.5 intl: 0.17.0 package_info_plus: 3.0.3 shared_preferences: 2.0.18 dio: 5.0.2 flutter_svg: 1.1.4 badges: 3.0.2 extended_image: 7.0.2 flutter_screenutil: 5.7.0 flutter_native_splash: 2.2.16 carousel_slider: 4.2.1 validatorless: 1.2.3 pinput: 2.2.31 flutter_easyloading: 3.0.5 encrypt: 5.0.1 pull_to_refresh: 2.0.0 photo_view: 0.14.0 dropdown_button2: 1.7.2 another_xlider: 1.1.2 # picker 选择器 flutter_picker: 2.1.0 # 底部弹出 modal_bottom_sheet: 3.0.0-pre # permission 权限 permission_handler: 10.2.0 # 媒体选择 wechat_assets_picker: 8.4.0 wechat_camera_picker: 3.7.0 dev_dependencies: flutter_test: sdk: flutter # The "flutter_lints" package below contains a set of recommended lints to # encourage good coding practices. The lint set provided by the package is # activated in the `analysis_options.yaml` file located at the root of your # package. See that file for information about deactivating specific lint # rules and activating additional ones. flutter_lints: ^2.0.0 # 图标生成 flutter_launcher_icons_maker: 0.10.2

end


Copyright 2024 ducafecat. All rights reserved.
微信: ducafecat, line: ducafecat,京ICP备2021009050号-3