flutter3.0学习笔记

新功能和开发环境搭建

Preview
  • Flutter3.0的新功能介绍
  • 1、准备在所有桌面平台上进行
  • 1.1、级联菜单和对 macOS 系统菜单栏的支持
  • 1.2、全面支持所有桌面平台上的国际文本输入
  • 1.3、所有桌面平台的可访问性
  • 1.4、macOS 上默认的通用二进制文件
  • 1.5、弃用 Windows 7/8 进行开发
  • 2、移动更新
  • 2.1、可折叠手机支持
  • 2.2、iOS 可变刷新率支持
  • 2.3、简化的 iOS 版本
  • 2.4、Gradle 版本更新
  • 2.5、停用 32 位 iOS/iOS 9/iOS 10
  • 3、网络更新
  • 3.1、图像解码
  • 3.2、Web 应用程序生命周期
  • 4、工具更新
  • 4.1、更新的 lint 包
  • 4.2、性能改进
  • 5、Flutter 生态系统更新
  • 5.1、Material 3
  • 5.2、主题扩展
  • 5.3、广告
  • 5.4、已经弃用的API
  • 环境搭建
  • 安装Android Studio
  • SDK 配置
  • 安装 XCode
  • Flutter SDK
  • 环境变量
  • windows 下设置

Flutter3.0的新功能介绍

在之前的版本中,Flutter为 iOS 和 Android 添加了Web和Windows 支持,现在Flutter 3 增加了对 macOS 和 Linux 应用程序的稳定支持。添加平台支持需要的不仅仅是渲染像素:它包括新的输入和交互模型、编译和构建支持、可访问性和国际化以及特定于平台的集成。

1、准备在所有桌面平台上进行

Linux 和 macOS 已达到稳定,包括以下功能:

1.1、级联菜单和对 macOS 系统菜单栏的支持

可以使用PlatformMenuBar小部件在 macOS 上创建平台呈现的菜单栏,该小部件支持插入仅平台菜单,并控制 macOS 应用程序菜单中显示的内容。

1.2、全面支持所有桌面平台上的国际文本输入

国际文本输入,包括使用文本输入法编辑器(IME) 的语言,如中文、日文和韩文,在所有三个桌面平台上都得到完全支持,包括第三方输入法,如搜狗和谷歌日文输入法。

1.3、所有桌面平台的可访问性

Flutter for Windows、macOS 和 Linux 支持无障碍服务,例如屏幕阅读器、无障碍导航和倒置颜色。

1.4、macOS 上默认的通用二进制文件

从 Flutter 3 开始,Flutter macOS 桌面应用程序构建为通用二进制文件,原生支持现有的基于 Intel 的 Mac 和 Apple 最新的 Apple Silicon 设备。

1.5、弃用 Windows 7/8 进行开发

推荐的用于开发的 Windows 版本提升到 Windows 10

2、移动更新

对移动平台的更新包括以下内容:

2.1、可折叠手机支持

Flutter3版本支持可折叠移动设备,MediaQuery现在包含一个列表 DisplayFeatures,描述设备元素的边界和状态,如铰链、折叠和切口。此外,DisplayFeatureSubScreen小部件现在定位其子小部件而不会与 的边界重叠DisplayFeatures,并且已经与框架的默认对话框和弹出窗口集成,使 Flutter 能够立即感知和响应这些元素。

2.2、iOS 可变刷新率支持

Flutter 现在支持带有 ProMotion 显示器的 iOS 设备上的可变刷新率,包括 iPhone 13 Pro 和 iPad Pro。在这些设备上,Flutter 应用程序可以以达到 120 赫兹的刷新率进行渲染,而之前的刷新率限制为 60 赫兹。

2.3、简化的 iOS 版本

Flutter3为 flutter build ipa 命令添加了新选项,以简化发布 iOS 应用程序。当准备好分发到 TestFlight 或 App Store 时,运行flutter build ipa以构建 Xcode 存档(.xcarchive文件)和应用程序包(.ipa文件)。可以选择添加—-export-method ad-hoc、 —-export-method development—-export-method enterprise。构建应用程序包后,通过Apple Transport macOS 应用程序或在命令行上使用xcrun altool(运行man altoolApp Store Connect API 密钥身份验证说明)将其上传到 Apple 。上传后,应用即可发布到TestFlight 或 App Store。设置初始Xcode 项目设置后,例如显示名称和应用程序图标,不再需要打开 Xcode 来发布应用程序。

2.4、Gradle 版本更新

将版本升级到 Gradle 的 7.4 和 Android Gradle 插件的 7.1.2

2.5、停用 32 位 iOS/iOS 9/iOS 10

Flutter 对 32 位 iOS 设备以及 iOS 9 和 10 版本的支持即将结束。此更改影响 iPhone 4S、iPhone 5、iPhone 5C 以及第 2、3d 和第 4 代 iPad 设备。Flutter 3 是最后一个支持这些 iOS 版本和设备的稳定版本。

3、网络更新

我们的网络应用更新包括以下内容:

3.1、图像解码

Flutter web 现在会在支持它的浏览器中自动检测和使用 ImageDecoder API。截至今天,大多数基于 Chromium 的浏览器(Chrome、Edge、Opera、三星浏览器等)都添加了此 API。 新的 API 使用浏览器的内置图像编解码器从主线程异步解码图像。这将图像解码速度提高了 2 倍,并且它从不阻塞主线程,消除了以前由图像引起的所有卡顿。

3.2、Web 应用程序生命周期

Flutter Web 应用程序的新生命周期 API可以灵活地从托管 HTML 页面控制 Flutter 应用程序的引导过程,并帮助 Lighthouse 分析应用程序的性能。这个使用于许多案例场景,比如:启动动画、加载指示器、在 Flutter 应用程序之前显示的纯 HTML 交互式登录页面。

4、工具更新

对 Flutter 和 Dart 工具的更新包括:

4.1、更新的 lint 包

lint 包的 2.0 版已发布:

在 Flutter 3 中生成的应用程序会flutter create自动启用 v2.0 的 lints 集。鼓励现有的应用程序、包和插件迁移到 v2.0 以遵循 Flutter 世界中最新和最伟大的最佳实践,通过运行flutter pub upgrade --major-versions flutter_lints。

v2 中大多数新添加的 lint 警告都带有自动修复。因此,升级到应用pubspec.yaml 文件中的最新包版本后,可以运行dart fix —-apply代码库以自动修复大多数 lint 警告(某些警告仍需要一些手动工作)。

4.2、性能改进
  • 现在在 iOS 和更新的 Android 设备上都启用了当存在单个矩形脏区域时的部分重绘。
  • 改进了不透明动画在简单情况下的性能
  • 引擎的光栅和 UI 线程现在在 Android 和 iOS 上运行的优先级高于其他线程
  • 解决iOS 和其他平台上早发性卡顿的解决方案

5、Flutter 生态系统更新

5.1、Material 3

Flutter 3 支持Material Design 3,即下一代 Material Design。Flutter 3 为 Material 3 提供了可选支持;这包括 Material You 功能,如动态颜色、更新的颜色系统和排版、许多组件的更新,以及 Android 12 中引入的新视觉效果,如新的触摸波纹设计和拉伸过度滚动效果。在新的 Take your Flutter app from Boring to Beautiful codelab中尝试 Material 3 功能。

5.2、主题扩展

Flutter 现在可以使用名为Theme extensions的概念向材质库添加任何内容

5.3、广告

Google 提供了用户消息传递平台 (UMP) SDK,它取代了之前的开源Consent SDK。在即将发布的 GMA SDK for Flutter 中,我们将添加对 UMP SDK 的支持,以允许发布者获得用户同意。

5.4、已经弃用的API

在 v2.10 之后删除了已弃用的 API,列如: maxLengthEnforced->maxLengthEnforcement;

VelocityTracker->VelocityTracker.withKind(),(这允许为 PointerDeviceKind跟踪器指定一个);

DayPicker\小MonthPicker->CalendarDatePicker;

FlatButton, RaisedButton, &OutlineButton:

image.png

Scaffold->ScaffoldMessenger;

RectangularSliderTrackShape(disabledThumbGapWidth: 2.0)->RectangularSliderTrackShape();

更多更新请移步flutter文档:https://docs.flutter.dev/release/breaking-changes/2-10-deprecations

环境搭建

安装Android Studio

进入Android Studio的官网 https://developer.android.com/studio/index.html?hl=zh-cn 选择需要安装的版本。

image.png 首次安装需要去下载 sdk,一路默认就行。

SDK 配置

image.png

SDK 列表, 可以先勾选个 Android 12 的,以后根据需要再加

image.png

SDK Tools, 安装 command-line、x86 加速器

image.png

安装 XCode

Apple Store 中升级到最新的 xcode

image.png

Flutter SDK

sdk 压缩包列表 https://docs.flutter.dev/development/tools/sdk/releases?tab=macos

image.png

直接下载最新版3.3.0,放到你的目录下面/opt/flutter

环境变量

打开 vim ~/.bash_profile 或者vim ~/.zshrc 配置文件

 # flutter sdk
export PATH=${PATH}:~/opt/flutter/bin

 # dart sdk
export PATH=${PATH}:~/opt/flutter/bin/cache/dart-sdk/bin
export PATH=${PATH}:~/.pub-cache/bin

# flutter-io 国内镜像
export PUB_HOSTED_URL=[https://pub.flutter-io.cn](url)
export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn

# android
export ANDROID_HOME=~/Library/Android/sdk
export PATH=${PATH}:${ANDROID_HOME}/platform-tools
export PATH=${PATH}:${ANDROID_HOME}/tools

生效

source ~/.bash_profile
source ~/.zshrc

检查

flutter doctor
Last login: Mon Sep  5 17:27:35 on ttys000
 hedy@HedydeMacBook-Pro  ~/Desktop  flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.3.0, on macOS 12.5.1 21G83 darwin-x64, locale
    zh-Hans-CN)
[✓] Android toolchain - develop for Android devices (Android SDK version 31.0.0)
[✓] Xcode - develop for iOS and macOS (Xcode 13.4.1)
[✓] Chrome - develop for the web
[✓] Android Studio (version 2021.1)
[✓] VS Code (version 1.69.2)
[✓] Connected device (2 available)
[✓] HTTP Host Availability

windows 下设置

windows下的配置就相对简单了

image.png

image.png

image.png 按照文件存放目录

image.png