【譯】Flutter 1.20 正式版前瞻、新更新發布

Flutter 1.20 正式版前瞻、新更新發布

原文地址:https://medium.com/flutter/an...html

性能改進,移動自動填充,一個新的小組件和更多!

咱們對Flutter的持續願景是提供一個便攜式工具箱,用於構建使人驚歎的體驗,不管您在哪裏均可以在屏幕上畫出像素。每一次發佈,咱們都會繼續努力,確保Flutter對咱們支持的每一個平臺都是快速、美觀、高效和開放的。在今天發佈到咱們穩定頻道的Flutter 1.20中,Flutter對這四大支柱中的每個都有改進。git

的類別中,咱們從渲染引擎的最底層和Dart語言自己,都有多項性能改進。github

爲了使您可以構建更加美麗的Flutter應用程序,這個版本有幾個UI加強功能,包括期待已久的自動填充支持,一種新的方式來分層您的組件以支持平移和縮放,新的鼠標光標支持,更新舊的最喜歡的Material組件(如時間和日期選擇器/),以及一個全新的響應式許可頁面,用於桌面和移動形式因素Flutter應用程序中的關於框。web

爲了確保你繼續保持更高的生產力,咱們已經更新了Visual Studio Code的Flutter擴展,它將Dart DevTools直接帶入你的IDE中,當你移動你的文件時自動更新你的導入語句,以及一套新的元數據用於構建你本身的工具。spring

而正是由於Flutter的_開放性和驚人的社區貢獻者,這個版本包含了來自世界各地359位貢獻者的3,029個合併PR和5,485個已關閉問題,其中包括270位來自Flutter社區的貢獻者。事實上,這標誌着咱們有史以來對Flutter版本的最大貢獻者數量。特別鳴謝社區貢獻者CareF的28個PR,AyushBherwani1998的26個PR,其中包括10個做爲他的Google Summer of Code項目的一部分對Flutter樣本的貢獻,以及a14n的13個PR,其中許可能是爲Flutter的空安全落地服務的(更多關於這個話題很快就會有!)。若是沒有普遍的社區貢獻者團隊,咱們沒法建立Flutter,因此感謝大家/!json

Flutter的每一個新版本都會帶來更多的使用量和動力。事實上,在4月份,咱們報道,Google Play商店中的Flutter應用數量已經達到了5萬個,峯值速度爲10000個新應用/月。如今,僅僅過了三個多月,Google Play中的Flutter應用已經超過了9萬個。咱們在印度看到了不少這樣的增加,印度如今是Flutter開發者的第一大地區,在過去的6個月裏翻了一番,這與谷歌加大對該地區的投資很是吻合。最後,沒有Dart,Flutter就不是Flutter,因此很高興看到IEEE報告說,Dart自去年以來已經上升了4位,在他們追蹤的前50種語言中排名第12api

Flutter和Dart的性能改進

在Flutter團隊中,咱們一直在尋找新的方法來下降你的應用的大小和延遲。做爲前者的一個例子,這個版本修復了圖標字體樹搖動的工具性能問題使字體樹搖動成爲默認行爲,當構建您的非Web應用程序時。圖標字體樹搖動會移除你的應用中不使用的圖標,從而減少尺寸。對Flutter Gallery應用使用這個功能,咱們發現它將應用大小減小了100kb。如今,當你在進行發佈構建時,你的移動應用中默認會有這種行爲。目前它僅限於TrueType Fonts,但這一限制將在將來的版本中被取消。瀏覽器

咱們在這個版本中作的另外一項性能改進是使用預熱階段減小了動畫初始顯示時的抖動。你能夠在這個動畫中看到一個改善抖動的例子 (slowed down to half speed)。安全

在這裏插入圖片描述

無SkSL熱身和有SkSL熱身的動畫

若是一個Flutter應用在第一次運行時有卡頓的動畫,Skia Shading Language shader提供了預編譯做爲你的應用構建的一部分,能夠將其速度提升2倍以上。若是你想利用這個高級功能,請看flutter.dev上的SkSL預熱頁面websocket

最後,在咱們針對桌面形式因素進行優化的同時,咱們繼續完善咱們的鼠標支持。在這個版本中,咱們重構了鼠標命中測試系統,提供了許多因爲性能問題而被屏蔽的架構優點。重構使咱們在基於Web的微基準中的性能提升了15倍! 這對您來講意味着,您能夠在不放棄性能的前提下,得到更好、更一致、更準確的測試結果:共贏!

有了這個更好、更快、更強的鼠標點擊測試,咱們增長了對鼠標光標的支持--這也是最受好評的桌面功能之一。一些經常使用的小組件將默認顯示你所指望的光標,或者你能夠從支持的光標列表中指定另外一個。

在這裏插入圖片描述

在Android上現有的小組件上添加新的鼠標指針。

Flutter的這個版本是創建在Dart的2.9版本上的。它的特色是採用了新的基於狀態的雙通UTF-8解碼器,解碼基元在Dart虛擬機中進行了優化,部分利用了SIMD指令。UTF-8是目前互聯網上使用最普遍的字符編碼方法,在接收大型網絡響應時,可以快速解碼是相當重要的。在咱們的UTF-8解碼基準測試中,咱們發如今低端ARM設備上,從英文文本的近200%到中文文本的400%,都獲得了全面的改進。

移動文本字段的自動填充

一段時間以來,最要求的Flutter功能之一就是支持底層的Android和iOS支持Flutter程序中的文本自動填充。隨着PR 52126,咱們很高興地說,等待已經結束了--不用再要求你的用戶從新輸入操做系統已經爲他們收集的數據。

在這裏插入圖片描述

自動填寫的行動

你會很高興地聽到,咱們已經開始爲網絡添加這一功能。

一個新的小組件,用於常見的互動模式。

這個版本引入了一個新的widget--"InteractiveViewer"。InteractiveViewer是爲在你的應用程序中構建常見的交互性而設計的,好比平移、縮放和拖放,甚至在調整大小的狀況下也是如此,這個簡單的圍棋棋盤示例演示了這一點。

在這裏插入圖片描述

使用 "交互式查看器 "進行縮放、平移、調整大小、拖放等操做。

要查看如何將InteractiveViewer集成到你本身的應用程序中,查看API文檔,你能夠在DartPad中玩它。另外,若是你想了解InteractiveViewer是如何設計和開發的,你能夠在YouTube上看到做者爲Chicago Flutter作的演示

若是你有興趣在你的Flutter應用中加入InteractiveViewer所實現的那種交互性,那麼你可能也會很高興地聽到咱們在這個版本中增長了更多的拖放功能。具體來講,若是你想知道在目標組件上發生的精確的拖放位置(它老是對_Draggable_對象自己可用),如今你能夠經過_DragTarget onAcceptDetails_方法得到該信息。

在這裏插入圖片描述

新的拖動目標接受細節的行動

查看此示例以瞭解詳情,並期待將來的版本能在拖動過程當中提供這些信息,以便_DragTarget_能更容易地在拖動操做中提供視覺更新。

更新了材質滑塊、範圍滑塊、時間選擇器和日期選擇器。

除了新的widget,這個版本還包括一些更新的widget,以符合最新的材料準則。其中包括SliderRangeSlider。更多信息,請參見Slider widget有什麼新變化?

在這裏插入圖片描述

更新的材料滑塊

在這裏插入圖片描述

更新材料範圍滑塊

更新了 "DatePicker",加入了新的緊湊設計以及對日期範圍的支持。

在這裏插入圖片描述

更新的DatePicker

最後,TimePicker有了全新的風格。

在這裏插入圖片描述

更新的TimePicker

若是你想玩一玩,這裏有一個用Flutter搭建的有趣的網頁演示

響應式許可證頁面

本次發佈的另外一個更新是在 "AboutDialog "中新增了響應式受權頁面。

在這裏插入圖片描述

新許可證頁面

PR 57588,來自社區貢獻者TonicArtos,不只更新了Material指南,讓它看起來更漂亮,並且它更容易導航,而且設計成在平板電腦和桌面上和手機上同樣好用。謝謝,TonicArtos! 由於每一個Flutter應用都應該顯示他們使用的包的許可證,你只是讓每一個Flutter應用都變得更好!

發佈插件須要新的pubspec.yaml格式。

固然,Flutter不只僅是小組件,還有工具,這個版本的更新太多,沒法一一說起。不過,這裏有一些亮點。

首先是一個公益聲明:若是你是Flutter插件做者,那麼傳統的pubspec.yaml格式再也不支持發佈插件。若是你嘗試,在執行_pub publish_時,你會獲得如下錯誤信息。

在這裏插入圖片描述

插件發佈時遺留的pubspec格式錯誤信息。

舊的格式不支持指定你的插件支持哪些平臺,而且從Flutter 1.12開始就被廢棄了。 新的pubspec.yaml格式如今須要發佈新的或更新的插件。

對於插件的客戶端,這些工具仍然可以理解舊的pubspec格式,而且在可預見的將來也將如此。pub.dev上全部使用傳統pubspec.yaml格式的現有插件在可預見的將來將繼續與Flutter應用程序一塊兒工做。

在Visual Studio代碼中預覽嵌入式Dart DevTools。

這個版本中最大的工具更新來自於Visual Studio Code擴展,它提供了一個新功能的預覽,使你可以將Dart DevTools屏幕直接帶入你的編碼工做區。
在這裏插入圖片描述

嵌入到Visual Studio代碼中的Dart DevTools佈局瀏覽器的預覽。

使用新的_dart.previewEmbeddedDevTools_設置啓用此功能。上面的截圖顯示了Flutter Widget Inspector直接嵌入到Visual Studio Code中,可是啓用了這個新的設置,你可使用狀態欄上的Dart DevTools菜單選擇你喜歡的頁面嵌入。

在這裏插入圖片描述

這個菜單可讓你選擇要顯示的頁面。

在這裏插入圖片描述

這個功能還在預覽中,因此若是你有任何問題請告訴咱們

更新網絡跟蹤

最新版本的Dart DevTools自帶了一個更新版本的網絡頁面,能夠實現網絡套接字剖析。

在這裏插入圖片描述

Dart DevTools的網絡頁面上的套接字鏈接的時間、狀態和內容類型。

網絡頁面如今爲您的應用程序的網絡呼叫添加了定時信息,以及狀態和內容類型等其餘信息。對詳細信息UI進行了額外的改進,以提供websocket或http請求中數據的概述。咱們還爲這個頁面制定了更多的計劃,包括HTTP請求/響應體和監控gRPC流量。

更新文件重命名的導入語句

Visual Studio Code的另外一個新功能是在重命名時更新導入,當文件被移動或重命名時,它會自動更新_import_語句。

在這裏插入圖片描述

在Visual Studio代碼中移動Dart文件,更新導入語句。

該功能目前只適用於單個文件,而不是多個文件或文件夾,但該支持即將到來。

每一個工具製造者的工具元數據。

還有一個須要說起的更新是針對構建Flutter工具的人。咱們在GitHub上建立了一個新的項目來捕獲和發佈關於Flutter框架自己的元數據。它爲如下內容提供了機器可讀的數據文件。

這與咱們本身在Android Studio / IntelliJ和VS Code擴展中使用的元數據相同;咱們認爲在構建本身的工具時,你可能會發現它頗有用。事實上,這個元數據使IntelliJ系列IDE中的功能可以顯示你的Flutter代碼中使用的顏色。

在這裏插入圖片描述

與此相關的是IntelliJ和Android Studio中的一個新功能,它能夠顯示Color.fromARGB()和Color.fromRGBO()的色塊。
在這裏插入圖片描述

特別感謝GitHub上的dratushnyy,感謝他對IntelliJ中顏色預覽的改進。

平臺互操做的類型安全平臺通道

爲了響應插件做者在用戶調查中的廣泛需求,最近咱們一直在嘗試如何讓Flutter和主機平臺之間的通訊更安全,更方便插件Add-to-App。爲了知足這一需求,咱們建立了Pigeon,這是一個命令行工具,它使用Dart語法在平臺通道之上生成類型安全的消息代碼,而不須要添加額外的運行時依賴。經過Pigeon,你能夠調用Java/Objective-C/Kotlin/Swift類方法,並經過直接調用Dart方法(反之亦然)來傳遞非原生數據對象,而不是手動匹配平臺通道上的方法字符串和序列化參數。

在這裏插入圖片描述

雖然還在預發佈階段,但Pigeon已經足夠成熟,以致於咱們本身在video_player插件中使用它。若是你有興趣測試一下Pigeon,請看更新後的平臺頻道文檔以及這個示例項目

工具更新太多,沒法一一列舉

在Flutter 1.20的時間框架內發生了這麼多偉大的事情,咱們不能在這裏列出全部的工具。然而,你可能想看看更新公告自己。

Breaking Changes

和以往同樣,咱們儘可能保持較低的中斷修改數量。如下是Flutter 1.20版本的列表。

Summary

但願你和咱們同樣,對這個版本感到興奮。從不少角度來看,這是Flutter最大的版本。隨着性能的提升,新的和更新的小組件,以及工具的改進,咱們只能擊中亮點。咱們要感謝您,強大的和不斷增加的社區貢獻者,使每個Flutter版本都比以前的版本更大、更快、更強。還有更多的內容,對null安全的支持,新版本的Ads、Maps和WebView插件,以及更多的工具支持正在進行中。(事實上,你可能會對Bob Nystrom關於理解null安全的深刻研究感興趣)。

有了Flutter和工具中全部這些額外的力量,你打算構建什麼?

在這裏插入圖片描述

相關文章
相關標籤/搜索