作者 / Chris Sells, Product Manager, Flutter developer experience

很高興為大家?guī)?Flutter 1.17，這也是我們 2020 年的第一個(gè)穩(wěn)定發(fā)布版本。

今年對每個(gè)人來說都是充滿挑戰(zhàn)的一年。我們的目標(biāo)是每季度發(fā)布一次穩(wěn)定版，由于我們一直在針對新的發(fā)布流程調(diào)整基礎(chǔ)設(shè)施，本次版本發(fā)布有所推遲。然而品質(zhì)依然是我們的第一要?jiǎng)?wù)，新的版本發(fā)布流程將提升我們?yōu)榉€(wěn)定分支提供高質(zhì)量熱修復(fù)的能力。本次發(fā)布的版本包含大量的修復(fù)，自 1.12 穩(wěn)定版發(fā)布以來，我們已經(jīng)解決了 6,339 個(gè) Issue，這是史無前例的大進(jìn)展。而這很大程度上要?dú)w功于我們與 Nevercode 的合作，在用戶提出問題時(shí)我們可以更快地響應(yīng)。截至現(xiàn)在，我們已經(jīng)解決的 bug 數(shù)量超過新增數(shù)量，報(bào)錯(cuò)總數(shù)減少了大約 800 個(gè)。這些 bug 中相當(dāng)?shù)囊徊糠忠淹ㄟ^合并 3,164 個(gè) pull request 進(jìn)行了修復(fù)，它們來自 231 位貢獻(xiàn)者。這些數(shù)據(jù)都令人振奮，我們也衷心感謝大家在這個(gè)特殊時(shí)期的勤奮工作和持續(xù)貢獻(xiàn)。

• 與 Nevercode 的合作

  https://blog.codemagic.io/flutter-and-codemagic-join-forces-on-github/

如果您想查看我們在這個(gè)版本中合并的所有 pull request，請前往 flutter.cn 了解詳情。除了品質(zhì)方面的改進(jìn)，我們還設(shè)法在這個(gè)版本中加入了一些新功能，包括 iOS 系統(tǒng)中的 Metal 支持、全新的 Material 組件、全新的網(wǎng)絡(luò)跟蹤工具等等。這個(gè)版本還包括了 Dart 2.8，請閱讀今天發(fā)布的二條文章詳細(xì)了解。

移動(dòng)端性能和文件體積優(yōu)化

性能和內(nèi)存方面的整體優(yōu)化是 1.17 版的重點(diǎn)之一。只需將您的工程升級到使用 Flutter 1.17，您的用戶就能體驗(yàn)到更快速流暢的動(dòng)畫、更小巧的應(yīng)用尺寸，以及更低的內(nèi)存占用。在默認(rèn)的導(dǎo)航場景下 (不包含透明圖層內(nèi)容的導(dǎo)航路徑) 1.17 版的速度提升了 20%-37%。簡單 iOS 動(dòng)畫的 CPU/GPU 占用可減少高達(dá) 40%，具體的減少量取決于硬件 (詳見 PR 14104 和 PR 13976)。

• 導(dǎo)航速度提升

  https://github.com/flutter/flutter/pull/48900

• PR 14104

  https://github.com/flutter/engine/pull/14104

• PR 13976

  https://github.com/flutter/engine/pull/13976

得益于我們的多項(xiàng)修復(fù)工作，新版本還在應(yīng)用體積上做出了可觀的改進(jìn)。比如 Flutter Gallery 范例應(yīng)用的 Android 版本在去年年底是 9.6MB，現(xiàn)在則是 8.1MB，體積減少了 18.5%。

• 我們做出的多項(xiàng)修復(fù)

  https://github.com/dart-lang/sdk/commit/f56b0f690789b6f0e2e5bc1340abf4eba414b7a0

  https://github.com/dart-lang/sdk/commit/a2bb7301c5795e6b28089a8dc96e6ab5ca798e22

  https://github.com/dart-lang/sdk/commit/d77f4913a18ecce8c4be95cbaa4299ff1521dc10

  https://github.com/dart-lang/sdk/commit/e2faac751e1ef3707730e6e48f4d8f22ecbf35c3

  https://github.com/dart-lang/sdk/commit/8e7ffafbafc8203361111ddcafe0e0fcc372edf8

內(nèi)存使用方面也有明顯的優(yōu)化，例如在快速滾動(dòng)大型圖片時(shí)內(nèi)存占用減少了 70%，進(jìn)而提升性能，具體提升的程度取決于設(shè)備內(nèi)存的大小。

• 優(yōu)化內(nèi)存占用

  https://github.com/flutter/engine/pull/14265

△ 測試應(yīng)用的內(nèi)存占用量隨著 PR 合并的變化 (豎條越短內(nèi)存占用越少)

不過最大的性能提升來自在 iOS 系統(tǒng)中實(shí)現(xiàn)對 Metal 的支持。

Metal 將 iOS 性能提升 50%?

Apple 的 Metal API 使開發(fā)者幾乎直接訪問底層 GPU，它也是 Apple 推薦使用的圖形 API。在支持 Metal 的 iOS 設(shè)備上，Flutter 將默認(rèn)使用 Metal，使得應(yīng)用在絕大多數(shù)情況下都運(yùn)行得更快，渲染速度平均提升約 50% (具體取決于設(shè)備的工作負(fù)載)。

• 渲染速度平均提升約 50%

  https://github.com/flutter/flutter/issues/53768

△ 測試 iOS 應(yīng)用在 OpenGL 和 Metal 下的幀渲染時(shí)間 (值越低越好)

對于那些不完全支持 Metal 的設(shè)備 (使用 A7 之前的處理器或 iOS 10 之前系統(tǒng)的設(shè)備)，Flutter 會和以前一樣使用 OpenGL，在這些設(shè)備上實(shí)現(xiàn)原生渲染速度。更多詳情，請查看 Flutter wiki 上的 iOS Metal 常見問題解答。

• iOS Metal 常見問題解答

  https://github.com/flutter/flutter/wiki/Metal-on-iOS-FAQ

Material widgets: NavigationRail, DatePicker, 以及更多

基于多方用戶的反饋，我們也在持續(xù)推進(jìn) Material 設(shè)計(jì)系統(tǒng)在 Flutter 中落地。在新版本中我們加入了 NavigationRail，這是一個(gè)新的 widget，提供了響應(yīng)式的應(yīng)用導(dǎo)航模型。它由 Google Material Design 團(tuán)隊(duì)設(shè)計(jì)并實(shí)現(xiàn)。NavigationRail 非常適合可以在移動(dòng)和桌面設(shè)備之間切換的應(yīng)用，當(dāng)您的應(yīng)用所在的屏幕尺寸增大時(shí)，您可以非常容易地從 BottomNavigator 切換成 NavigationRail。

• NavigationRail API

  https://master-api.flutter-io.cn/flutter/material/NavigationRail-class.html

• Material 組件:?NavigationRail

  https://material.io/components/navigation-rail

△ 新加入的 NavigationRail widget

您可以在 web_dashboard 樣例或者 DartPad 中實(shí)際體驗(yàn) NavigationRail。

• web_dashboard 樣例

  https://github.com/flutter/samples/tree/master/experimental/web_dashboard

• DartPad

  https://dartpad.cn/b9c6cd345fd1cff643353c1f4902f888

除了加入新的 widget 之外，新版本還更新了 Material DatePicker 以及修正了文字選擇菜單 widget 的溢出顯示問題。

• DatePicker

  https://api.flutter.dev/flutter/material/showDatePicker.html

△ 新的 Material DatePicker widget

DatePicker 基于更新過的 Material 設(shè)計(jì)指南引入了新的視覺設(shè)計(jì)，并新增了文本輸入模式。詳情請閱讀 Material DatePicker 改版文檔。

• Material 設(shè)計(jì)指南

  https://material.io/components/pickers/#mobile-pickers

• Material DatePicker 改版文檔

  https://flutter.dev/go/material-date-picker-redesign

△ Android 上新版文字選擇懸浮菜單

△ iOS 上新版文字選擇懸浮菜單

如上圖，當(dāng)按鈕總長度超過了顯示范圍時(shí)，Android 和 iOS 中的文本選擇菜單保真度也得到了提高。菜單文本越長，這項(xiàng)更新越顯著。

• Android 版文本選擇菜單

  https://github.com/flutter/flutter/pull/49391

• iOS 版文本選擇菜單

  https://github.com/flutter/flutter/pull/54140

另外，全新的 Animations Package，雖然并沒有被包含進(jìn) Flutter 1.17 版本中，但也已同期發(fā)布。它實(shí)現(xiàn)了新的 Material 動(dòng)效規(guī)范。

• 全新的 Animations Package

  https://pub.flutter-io.cn/packages/animations

• 新的 Material 動(dòng)效規(guī)范

  https://material.io/design/motion/the-motion-system.html

△ Animations Package 中的容器轉(zhuǎn)場動(dòng)畫

在《實(shí)現(xiàn)動(dòng)效太難了？試試 Material Design》一文中，Material Design 團(tuán)隊(duì)給出了組件與全屏視圖之間的四種轉(zhuǎn)場模式: 容器變換、共享軸、淡入淡出和彈出效果。雖然 Flutter 一直就可以實(shí)現(xiàn)這些動(dòng)效，但 Animations Package 讓您可以更輕松地實(shí)現(xiàn)它們。今天就在應(yīng)用里試試這些動(dòng)效，讓您的用戶們眼前一亮吧！?

Material 文字縮放:?現(xiàn)代化 Flutter 文字主題

在新版本中，Flutter 團(tuán)隊(duì)在不破壞現(xiàn)有 Flutter 應(yīng)用的同時(shí)，完成了對 2018 年 Material Design 規(guī)范文字排版縮放 (Type Scale) 的實(shí)現(xiàn)。2018 年 10 月，我們在 PR 22330 中添加了對新配置 (而不是新名稱) 的可選支持。現(xiàn)有的文本樣式名稱沒有更改，因?yàn)檫@屬于重大的 API 更改，可能會影響到大多數(shù)應(yīng)用。Flutter 1.17 更新了 TextTheme API，以遵循當(dāng)前的 Material 規(guī)范，但保留了舊的名稱，從而不影響您的代碼。由于舊的名稱已經(jīng)被廢棄，您將收到 warning 提示，建議采用新的名稱。

• Material Design: 文字縮放排版

  https://material.io/design/typography/the-type-system.html#type-scale

• PR 22330

  https://github.com/flutter/flutter/pull/22330

2018 年 Material TextStyle 的名稱和配置匯總?cè)缦卤硭尽?/p>

Material Design 規(guī)范中稱為 body1 和 body2 的 TextStyle 在 Flutter TextTheme API 中被稱為 bodyText1 和 bodyText2。同樣的，在規(guī)范中稱為 H1-H6 的 TextStyle，在 TextTheme API 中稱為 headline1-headline6。

在 Flutter 中使用 Google Fonts

文本和字體總是密不可分，如果新的 Material 文字縮放實(shí)現(xiàn)讓您眼前一亮，那么您可能也會對新的 Google Fonts for Flutter v1.0 頗感興趣。

• Google Fonts for Flutter v1.0

  https://medium.com/flutter/introducing-google-fonts-for-flutter-v-1-0-0-c0e993617118

△ 在 Flutter 應(yīng)用中輕松使用 Google Fonts

開發(fā)者可以通過 Google Fonts 在應(yīng)用中輕松嘗試和使用 fonts.google.com 中的字體。當(dāng)應(yīng)用準(zhǔn)備發(fā)布時(shí)，開發(fā)者也可以決定是通過 API 來下載字體，還是在應(yīng)用包中直接嵌入字體。

無障礙功能和國際化

最后是我們持續(xù)關(guān)注的課題——無障礙功能。我們認(rèn)為，讓 Flutter 應(yīng)用可以服務(wù)最為廣泛的受眾是我們的首要任務(wù)之一。在新版本中，我們做了全面的工作，對滾動(dòng)、文本框以及其他輸入 widget 的無障礙功能進(jìn)行了修復(fù)。GitHub 上有我們在這個(gè)版本中完成修復(fù)的無障礙功能完整列表。我們希望開發(fā)者能多多測試自己應(yīng)用的無障礙功能，并且隨著這次版本還發(fā)布了一些推薦的最佳實(shí)踐供大家參考。

• GitHub 上的無障礙修復(fù)完整列表

  https://github.com/flutter/flutter

• 無障礙功能最佳實(shí)踐

  https://flutter.dev/docs/development/accessibility-and-localization/accessibility

在國際化方面，我們一直在處理一些影響三星鍵盤 IME 的問題，這影響了許多東亞語言的文字輸入。現(xiàn)在我們很高興地宣布這個(gè)問題已經(jīng)解決。各國開發(fā)者，尤其是韓國的開發(fā)者會在這個(gè)版本中發(fā)現(xiàn)不少喜人的變化。

• 三星鍵盤問題 (已修復(fù))

  https://github.com/flutter/flutter/issues/42273

工具:?Dart DevTools 支持 Flutter

將當(dāng)前版本的 Dart DevTools 替換成新的 Flutter 版本，這一進(jìn)程通過 Flutter 1.17 已經(jīng)接近完成。如果您想試試新的 Flutter 版 Dart DevTools，請?jiān)趩?dòng) DevTools 后點(diǎn)擊右上角的 Beaker (燒瓶) 圖標(biāo)。

由 Flutter 實(shí)現(xiàn)的 Dart DevTools 預(yù)發(fā)布版本帶來了諸多改進(jìn)，其中全新的 Network (網(wǎng)絡(luò)) 選項(xiàng)卡最為重要。

如果您在 Dart DevTools 的預(yù)發(fā)布版本中沒有看到 Network 選項(xiàng)卡 (比如，您是通過命令行來使用 DevTools)，可以通過如下命令手動(dòng)更新它:

$ pub global activate devtools

在按下 Record (錄制) 按鈕后， Network 選項(xiàng)卡會顯示您的 Flutter 應(yīng)用的網(wǎng)絡(luò)流量情況。如果您想在應(yīng)用啟動(dòng)時(shí)就立即開始監(jiān)測網(wǎng)絡(luò)流量，可以在您的 main() 方法中加入這行代碼:

void?main()?{//?enable?network?traffic?loggingHttpClient.enableTimelineLogging?=?true;runApp(MyApp()); }

除了 Dart DevTools 的更新之外，這個(gè)版本還實(shí)驗(yàn)性地增加了 "快速啟動(dòng)" 選項(xiàng)，當(dāng)您調(diào)試 Android 版 Flutter 應(yīng)用時(shí)，其啟動(dòng)速度可以提升高達(dá) 70%。您可以通過 flutter run --fast-start -d <your Android device> 來啟用這個(gè)選項(xiàng)。這個(gè)選項(xiàng)會安裝一個(gè)只依賴您的插件代碼的通用 Android 應(yīng)用，而不包含任何 Dart 代碼或資源。這會讓重復(fù)運(yùn)行的 flutter run 命令更快地啟動(dòng)，因?yàn)樾薷?Dart 代碼或資源并不需要重新構(gòu)建 APK。和通常的啟動(dòng)選項(xiàng)不同，快速啟動(dòng)選項(xiàng)將您的應(yīng)用綁定到了一個(gè)通用的 Android "容器" 中，實(shí)際上并不會在您的設(shè)備上安裝。在一些情況下，比如您使用的插件訪問了后臺執(zhí)行的內(nèi)容，快速啟動(dòng)選項(xiàng)將不起作用。如果您覺得 Android 調(diào)試的啟動(dòng)時(shí)間漫長得讓人頭疼，不妨試試這個(gè)全新的選項(xiàng)吧。

• 快速啟動(dòng)選項(xiàng)

  https://github.com/flutter/flutter/pull/46140

如果您的目標(biāo)平臺是 Android，您會注意到，現(xiàn)在創(chuàng)建新的 Flutter 項(xiàng)目時(shí)只提供 AndroidX 選項(xiàng)。AndroidX 庫提供了被稱為 Android Jetpack 的高級 Android 功能。在上一個(gè)版本中，我們不再支持原先的 Android Support Library，轉(zhuǎn)而將 AndroidX 作為所有新項(xiàng)目的默認(rèn)選項(xiàng)。在 Flutter 1.17 中，flutter create 命令只有 --androidx 這一個(gè)選項(xiàng)。雖然現(xiàn)有的不使用 AndroidX 的 Flutter 應(yīng)用依然可以編譯，但是時(shí)候遷移至 AndroidX 了。

• AndroidX

  https://developer.android.google.cn/jetpack/androidx

• Android Jetpack

  https://developer.android.google.cn/jetpack/

如果您使用 Android Studio 或 IntelliJ，您會發(fā)現(xiàn) Hot Reload (熱重載) 功能的容錯(cuò)性更強(qiáng)了。在本次更新之前，如果您的應(yīng)用出現(xiàn)了任何分析錯(cuò)誤，Hot Reload 將不會重新加載您的代碼。如果分析錯(cuò)誤并不涉及您當(dāng)前正在運(yùn)行的代碼 (比如在單元測試中)，會讓人很崩潰。但通過本次更新，Hot Reload 將不再受分析錯(cuò)誤影響，而取決于 VM 中的編譯錯(cuò)誤。

• 本次更新

  https://groups.google.com/forum/m/#!topic/flutter-announce/tTgQcTgqrKg

如果您想更早地體驗(yàn) Android Studio 或 IntelliJ 的 Flutter 插件中類似的改進(jìn)，我們現(xiàn)在也為 IntelliJ 插件提供了 dev 渠道，您可以選擇加入，以更快獲取到這些更新。這個(gè) dev 渠道的目標(biāo)是在公開發(fā)布新 IDE 集成功能前通過 Flutter 開發(fā)者收集反饋。如果您希望嘗鮮并且愿意向 Flutter 工具團(tuán)隊(duì)提供早期反饋，請即刻加入我們的體驗(yàn)計(jì)劃！

• IntelliJ 插件的 dev 渠道

  https://groups.google.com/forum/m/#!topic/flutter-announce/tTgQcTgqrKg

• 加入體驗(yàn)計(jì)劃

  https://groups.google.com/forum/m/#!topic/flutter-announce/tTgQcTgqrKg

如果您使用的是 Visual Studio Code，我們推薦使用新的 Dart: List Outdated Packages 命令來運(yùn)行新的 pub outdedated 命令。詳情請見 Dart 2.8 發(fā)布 (今日微信二條文章)。

這個(gè)命令用于厘清依賴項(xiàng)中的版本問題。

最后值得一提的是，現(xiàn)在當(dāng) Flutter 崩潰時(shí)，工具會提示您上報(bào)這個(gè) bug:

我們的團(tuán)隊(duì)會密切關(guān)注這些錯(cuò)誤報(bào)告的嚴(yán)重程度和出現(xiàn)頻率，所以當(dāng)這些提示出現(xiàn)時(shí)，請?zhí)峤?bug 給我們。

案例分享:?MGM 和 Superformula

Flutter 的存在是為了實(shí)現(xiàn)精美的應(yīng)用體驗(yàn)。數(shù)字開發(fā)商 Superformula 最近就完成了一件精彩的作品:?他們最近與 MGM Resorts (美高梅酒店集團(tuán)) 合作，完全使用 Flutter 對其移動(dòng)應(yīng)用進(jìn)行了重構(gòu)。他們反饋道，"在核心產(chǎn)品中引入 Flutter，為我們的客戶和他們的用戶帶來了更快的速度和更高的靈活性，從而為他們帶來了真正的、可衡量的價(jià)值。"

• Superformula

  https://superformula.com/flutter/

• MGM Resorts 重構(gòu)移動(dòng)應(yīng)用

  https://www2.mgmresorts.com/app/

Superformula 與 MGM Resorts 設(shè)計(jì)團(tuán)隊(duì)合作，為所有主要的網(wǎng)絡(luò)、移動(dòng)和店頭體驗(yàn)打造了全新的 MGM 設(shè)計(jì)語言。這個(gè)規(guī)模不大的團(tuán)隊(duì)使用全新的 Flutter 源碼庫更快地完成了應(yīng)用改版，并在兩個(gè)應(yīng)用商店上架，使得 MGM 的預(yù)訂轉(zhuǎn)化率提高了 9%。

重要改動(dòng) (Breaking Changes)

和以往一樣，我們會盡量減少每一個(gè) Flutter 新版本中的重要改動(dòng)，我們會反復(fù)權(quán)衡利弊，確保 Flutter 能夠提供直觀、靈活的 API，能夠在新平臺上支持新的開發(fā)習(xí)慣。在去年的用戶調(diào)查中，開發(fā)者表示可以接受經(jīng)過深思熟慮的、能夠改善框架的重要改動(dòng)。因此，我們正在穩(wěn)步、審慎地更新 API。Flutter 1.17 中的重要改動(dòng)包括:

• #42100 在使用 pushReplacement 時(shí)使用之前的路徑運(yùn)行后續(xù)動(dòng)畫

• #45940 棄用 UpdateLiveRegionEvent

• #49389 在高速滾動(dòng)時(shí)推遲圖像解碼

• #49391 文本選取溢出 (Android)

• #49771 斷言緩存提示未針對空繪圖對象進(jìn)行設(shè)置

• #50318 實(shí)時(shí)圖像緩存

• #50354 使用構(gòu)造塊高度計(jì)算選區(qū)范圍，確保其維持在可視范圍內(nèi)

• #50733 在 gen_l10n 中生成消息查詢

• #51435 從 RouteSettings 中移除 isinitialroute

• #52781 將 mouse_tracking.dart 移動(dòng)到 rendering

小結(jié)

隨著移動(dòng)端支持的不斷成熟，以及 web 端逐步穩(wěn)定，Flutter 有望解決困擾行業(yè)幾十年的問題: 如何通過單一代碼庫構(gòu)建出多平臺部署的優(yōu)秀應(yīng)用？Flutter 成長至今的表現(xiàn)讓我們相信，我們正走在正確的道路上，也期待著您精彩的 Flutter 作品！

END 最后說個(gè)題外話，相信大家都知道視頻號了，隨著灰度范圍擴(kuò)大，越來越多的小伙伴都開通了視頻號。小詹也開通了一個(gè)視頻號，會分享互聯(lián)網(wǎng)那些事、讀書心得與副業(yè)經(jīng)驗(yàn)，歡迎掃碼關(guān)注，和小詹一起向上生長！「沒有開通發(fā)布權(quán)限的盡量多互動(dòng)，提升活躍度可以更快開通哦」（聽我一分鐘，生活更輕松）（掃碼回復(fù) 1024 即可領(lǐng)取IT資料包）

總結(jié)

以上是生活随笔為你收集整理的Flutter 1.17 | 2020 首个稳定版发布！的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。