Clever Geek Handbook

Flattern 1.20 Ankündigung

Verbesserte Leistung, automatische Vervollständigung, neues Widget und mehr!



Hallo allerseits, ich bin Evgeny Saturov von Surf. Ich präsentiere die Übersetzung des offiziellen Artikels über das neueste Flutter 1.20-Update mit meinen Kommentaren. Das Framework wird mit jeder neuen Veröffentlichung mehr und mehr poliert, und heute werden wir uns ansehen, was uns der stabile Kanal Ende des Sommers gebracht hat.







Mit jeder neuen Version bemühen wir uns, Flutter schneller, ästhetischer und produktiver zu machen und sicherzustellen, dass es für jede unterstützte Plattform verfügbar ist. In Version 1.20, die zum Zeitpunkt der Veröffentlichung dieses Artikels bereits in unserem stabilen Kanal verfügbar ist, hat Flutter jedes dieser Kriterien verbessert.



Apropos Leistung : Wir haben es geschafft, die Leistung sowohl auf den niedrigsten Ebenen der Rendering-Engine als auch in der Dart-Sprache selbst zu verbessern.



Um Flutter-Apps noch ästhetischer zu gestaltenWir haben dieser Version einige Verbesserungen an der Benutzeroberfläche hinzugefügt, darunter die lang erwartete Unterstützung für die automatische Vervollständigung, eine neue Methode zum Verschieben und Skalieren von Widgets, die Unterstützung des Mauszeigers, aktualisierte Materialfavoriten (z. B. Widgets für die Auswahl von Datum und Uhrzeit) und eine neue reaktionsfähige Seite mit Lizenzen für das Info-Fenster für Desktop- und mobile Flutter-Anwendungen.



Damit Sie produktiver arbeiten können , haben wir die Flutter-Erweiterung für Visual Studio Code aktualisiert :

  • Sie können Dart DevTools direkt in Ihrer IDE verwenden.
  • Jetzt können Sie Dateien im Projekt verschieben, und die Importe werden automatisch aktualisiert.
  • Ein neuer Satz von Metadaten wurde hinzugefügt, damit Sie Ihre eigenen Tools schreiben können.


Dank der Offenheit von Flutter und der erstaunlichen Flutter-Community enthält diese Version 3.029 durchgesickerte Pull-Anfragen und 5.485 geschlossene Ausgaben von 359 Mitwirkenden aus der ganzen Welt, darunter 270 Mitwirkende aus der Flutter-Community. Darüber hinaus ist dies eine Rekordzahl an Mitwirkenden, die wir zum Zeitpunkt der nächsten Veröffentlichung hatten. Besonderer Dank geht an die Mitwirkenden CareF für 28 Pull-Anfragen, AyushBherwani1998 für 26 (einschließlich 10 Beispiele aus Google Summer of Code) und a14nfür 13 Pull-Anfragen, von denen wir viele bei der Arbeit an der Nullsicherheit in Flutter übernommen haben (wir werden bald mehr darüber schreiben). Ohne diese enorme Community-Unterstützung hätten wir Flutter nicht bauen können. Danke für deinen Beitrag!



Mit jeder neuen Version von Flutter wächst die Anzahl der Benutzer rapide. Allein im April haben wir geschrieben, dass die Anzahl der Flutter-Anwendungen bei Google Play 50.000 erreicht hat. In der Spitzenzeit betrug das Wachstum 10.000 neue Anwendungen pro Monat. Jetzt, nach nur drei Monaten, wurden mehr als 90.000 auf Google Play veröffentlicht.



Flattern Anwendungen. Wir sehen das größte Wachstum in Indien, das für Flutter-Entwickler zur Region Nummer eins geworden ist. In den letzten sechs Monaten hat sich ihre Zahl verdoppelt, was eine direkte Folge von istSteigerung der Investitionen von Google in der Region. Schließlich wäre Flutter ohne Dart kein Flutter. Es ist gut zu sehen, dass Dart in den Top 50 der Programmiersprachen des IEEE Spectrum Magazins den 12. Platz belegt , vier Plätze mehr als im Vorjahr.



Leistungsverbesserungen für Flutter und Dart



Wir bei Flutter suchen immer nach neuen Wegen, um die Größe zu reduzieren und Ihre Anwendungen zu beschleunigen. In dieser Version haben wir beispielsweise ein Leistungsproblem beim Entfernen des Schriftsymbols beim Baumschütteln behoben und dieses Verhalten standardmäßig beim Erstellen von Nicht-Webanwendungen aktiviert . Die oben genannten Verbesserungen führen dazu, dass nicht verwendete Schriftarten entfernt werden und ihre Größe verringert wird. Wir haben dies mit der Flutter Gallery-App getestet - sie wurde um 100 KB verkleinert . Dies ist jetzt das Standardverhalten für Release-Builds. Derzeit funktioniert dies nur mit TrueType-Schriftarten. Diese Einschränkung wird jedoch in zukünftigen Versionen aufgehoben.



Eine weitere Leistungsverbesserung besteht darin, die Zackigkeit der Animation bei der ersten Anzeige durch eine Aufwärmphase zu verringern. Sehen Sie, wie sich die Glätte der Animation erhöht hat (die Aufnahme wird aus Gründen der Übersichtlichkeit zweimal verlangsamt).





Vergleich von Animationen vor und nach der Einführung des SkSL-Aufwärmens



Wenn eine Flutter-Anwendung beim ersten Start eine unregelmäßige Animation anzeigt, kann dies mithilfe der Skia Shading Language korrigiert werden. Beim Vorkompilieren in der Phase der Erstellung der Anwendung kann die Animation um mehr als das Zweifache beschleunigt werden. Wenn Sie diese Funktionalität nutzen möchten, besuchen Sie die SkSL-Aufwärmseite unter flutter.dev.







, Flutter- . ? - Flutter - . 1.20 . , , .



-, Apple (, ) — - Metal. OpenGL.



-, . , flutter build. , . , .


Während wir für Desktops optimieren, arbeiten wir schließlich weiter an der Mausunterstützung. In dieser Version haben wir das Mausschlag-Testsystem überarbeitet , um eine Reihe von architektonischen Vorteilen zu bieten, die aufgrund von Leistungsproblemen nicht verfügbar waren. Dieses Refactoring hat zu einer 15-fachen Leistungsverbesserung unserer Web-Mikrobenchmarks geführt: Benutzer erhalten eine bessere, konsistentere und genauere Trefferprüfung, ohne die Leistung zu beeinträchtigen.



Zusätzlich zu den verbesserten Treffertests haben wir die Unterstützung für Mauscursor hinzugefügt, eine der am häufigsten nachgefragten Funktionen für Desktop-Computer. Einige der am häufigsten verwendeten Widgets zeigen die Cursor an, die Sie standardmäßig erwarten. Oder Sie können einen anderen aus der Liste der unterstützten Cursor auswählen.







- Flutter for Web . 1.20, . , .




Neue Mauscursor in Widgets unter Android



Diese Version von Flutter basiert auf Dart 2.9 und enthält einen neuen UTF-8-Decoder mit zwei Durchgängen. Es ist zustandsbasiert und enthält Decodierungsprimitive, die in der Dart-VM optimiert wurden und teilweise SIMD-Anweisungen nutzen.



UTF-8 ist die im Internet am häufigsten verwendete Methode zur Zeichenkodierung. Die Fähigkeit zum schnellen Dekodieren spielt eine entscheidende Rolle beim Erhalten großer Netzwerkantworten. Bei unseren UTF-8-Decodierungs-Benchmarks haben wir allgemeine Verbesserungen festgestellt. Die Geschwindigkeitssteigerung betrug fast 200% für Englisch und bis zu 400% für chinesische Texte auf ARM-Geräten mit geringer Leistung.



Autocomplete für Flutter-Apps



Die Unterstützung der automatischen Vervollständigung von Textfeldern in Flutter-Apps unter Android und iOS ist seit langem eine der begehrtesten Funktionen. Wir freuen uns , Ihnen mitteilen zu können, dass Sie Ihre Benutzer nach der Pull-Anforderung 52126 nicht mehr auffordern müssen, Daten erneut einzugeben, die das Betriebssystem bereits für sie gesammelt hat.





Autocomplete in Aktion



Darüber hinaus haben wir bereits begonnen, diese Funktionalität für das Web anzupassen.



Neues Widget für Vorlagenaktionen



In dieser Version haben wir ein neues Widget hinzugefügt - InteractiveViewer. InteractiveViewer wurde entwickelt, um Vorlagenaktionen in Ihrer Anwendung zu implementieren, z. B. Schwenken, Skalieren und Ziehen und Ablegen, die auch bei Größenänderung funktionieren. So funktioniert dieses Widget für das Board-Beispiel in Go .





Skalieren, Schwenken, Ändern der Größe, Ziehen und Ablegen mit InteractiveViewer Informationen



zum Integrieren von InteractiveViewer in Ihre Anwendung finden Sie in der API-Dokumentation . Sie können es auch in DartPad in Aktion ausprobieren. Wenn Sie mehr über die Entwicklung von InteractiveViewer erfahren möchten, lesen Sie diese Präsentation auf dem YouTube-Kanal von Chicago Flutter .



In der neuen Version haben wir auch hinzugefügtWeitere Optionen zum Ziehen und Ablegen . Wenn Sie beispielsweise genau wissen möchten, wo der Abwurf im Ziel-Widget aufgetreten ist (diese Option war bisher nur für das Draggable- Objekt verfügbar ), können Sie diese Daten jetzt mithilfe der DragTarget onAcceptDetails- Methode abrufen .





onAcceptDetails in Aktion



Schauen Sie sich dieses Beispiel mehr über diese Funktion zu erfahren. In der nächsten Version von Flutter sind diese Informationen auch per Drag & Drop verfügbar, sodass DragTarget seinen visuellen Status rechtzeitig aktualisieren kann.







InteractiveViewer , , . , : — Justin McCandless. , Flutter. Justin ChicagoFlutter , Transform GestureDetector InteractiveViewer, .


Material- Slider, RangeSlider, TimePicker DatePicker



Neben neuen Widgets enthält diese Version eine Reihe aktualisierter Widgets, die den neuen Materialdesignprinzipien entsprechen . Speziell Slider und RangeSlider. Weitere Informationen finden Sie unter Was ist neu im Slider-Widget? ...







Aktualisierter Materialschieberegler





Aktualisierter Materialbereichsschieber Der



DatePicker verfügt über ein neues kompaktes Design und Unterstützung für Datumsbereiche.





DatePicker aktualisiert



Schließlich haben wir den TimePicker komplett neu gestaltet.





Aktualisierter TimePicker



In dieser Flutter-Demo können Sie den neuen TimePicker testen .



Responsive-Lizenzseite



Wir haben eine neue reaktionsfähige Lizenzseite erstellt, die in AboutDialog verfügbar ist.





Neue Seite mit Lizenzen



Pull Request 57588 von  TonicArtos wurde gemäß den Materialdesign-Prinzipien aktualisiert. Dies machte das Widget nicht nur schöner, sondern verbesserte auch die Navigation: Jetzt ist es bequem, es auf Tablets, Desktops und Smartphones zu verwenden. Vielen Dank an TonicArtos In Anbetracht der Tatsache, dass jede Flutter-App Lizenzen für die verwendeten Pakete anzeigen muss, haben Sie alle Flutter-Apps verbessert!



Neues pubspec.yaml-Format zum Veröffentlichen von Plugins



Natürlich geht es bei Flutter nicht nur um Widgets. Sie sind auch Werkzeuge. Diese Version enthält zu viele Updates. Lassen Sie uns also über die bemerkenswertesten sprechen.



Beginnen wir mit einer Ankündigung für Autoren von Flutter-Plugins: Das alte pubspec.yaml-Format wird beim Veröffentlichen von Plugins nicht mehr unterstützt. Wenn Sie versuchen, es zu verwenden, wird beim Ausführen der Pub-Veröffentlichung eine Fehlermeldung angezeigt.





Beim Veröffentlichen eines Plugins im veralteten Pubspec-Format ist ein Fehler aufgetreten. Das



alte Format hat die Angabe der Plattformen, auf denen Ihre Plugins ausgeführt werden, nicht unterstützt. Es ist seit Flutter 1.12 veraltet. Das neue pubspec.yaml-Format ist jetzt erforderlich, um neue oder aktualisierte Plugins zu veröffentlichen .



Plugin-Benutzer können weiterhin das alte Pubspec-Format verwenden. Alle vorhandenen Plugins auf pub.dev, die die veraltete Datei pubspec.yaml verwenden, werden auf absehbare Zeit weiterhin mit Flutter-Anwendungen funktionieren.



Vorschau der integrierten Dart DevTools in Visual Studio Code



Das größte Tool-Update in dieser Version betrifft Visual Studio Code mit einer Vorschau einer neuen Funktion, die Dart DevTools direkt in den Entwicklungsbereich bringt.





Vorschau des Layout-Explorers in Visual Studio-Code



Aktivieren Sie diese Funktion mit der neuen Einstellung dart.previewEmbeddedDevTools . Der Screenshot oben zeigt den in Visual Studio Code integrierten Flutter Widget Inspector. Mit dieser Einstellung können Sie im Dart DevTools-Menü in der Statusleiste eine Lieblingsseite zuweisen.





In diesem Menü können Sie auswählen, welche Seiten angezeigt werden sollen.





Diese Funktion befindet sich noch in der Vorschau. Kontaktieren Sie uns, wenn Sie Probleme damit haben







— , , , Flutter-, VS Code ! , — -. , - , — . : VS Code. Android Studio .




Die neueste Version von Dart DevTools enthält eine aktualisierte Version des Netzwerkdienstprogramms, mit der Sie Webanforderungen profilieren können.





Dauer, Status und Inhaltstyp der Socket-Verbindungen der Dart DevTools-



Netzwerkseite Die Netzwerkseite fügt jetzt Netzwerkinformationen zu Netzwerkanrufen aus Ihrer Anwendung hinzu - zusammen mit anderen Daten wie Status und Inhaltstyp. Es wurden zusätzliche Verbesserungen an der Anforderungsdetailoberfläche vorgenommen, auf der jetzt Daten von einem Web-Socket oder einer http-Anforderung angezeigt werden. Wir haben weitere Pläne für diese Seite. Wir möchten beispielsweise die Anzeige des Hauptteils der HTTP-Anforderung und -Antwort sowie die Überwachung des gRPC-Verkehrs hinzufügen.



Aktualisieren von Importen beim Umbenennen von Dateien



Eine weitere neue Funktion von Visual Studio Code ist, dass Importe beim Verschieben oder Umbenennen von Dateien aktualisiert werden.





Aktualisieren von Dart-Dateien in Bewegung



Diese Funktion funktioniert derzeit nur für einzelne Dateien. In Kürze werden jedoch mehrere Dateien oder Ordner unterstützt.







Android Studio Kommentar , wenn ich Sie wäre, wäre ich ernsthaft besorgt. Eine der subtilsten, aber so wichtigen Funktionen Ihrer geliebten IDE ist jetzt VS Code. Jetzt können Sie Dateien beliebig umbenennen! Sie müssen nicht alle Importe manuell anpassen (ja, ich weiß, wir haben das alle durchlaufen). Oh, wie viele Mannstunden hat uns das VS Code Plugin Update gespart. Es wird interessant sein zu wissen, welche anderen erweiterten Refactoring-Funktionen Sie in VS Code verwenden. Schreiben Sie in die Kommentare.



Tools Metadaten



Ein weiteres Update richtet sich an Benutzer, die Flutter-Tools erstellen. Wir haben ein neues Projekt auf GitHub erstellt: Dort werden wir Metadaten über das Framework selbst sammeln und veröffentlichen. Darin finden Sie maschinenlesbare Dateien mit folgenden Daten:



Dies sind die Metadaten, die wir selbst für die Erweiterungen Android Studio / IntelliJ und VS Code verwenden. Wir dachten, sie könnten sich beim Erstellen neuer Tools als nützlich erweisen. In Apps der IntelliJ-Familie können Sie mit diesen Metadaten die Anzeige der in Ihrem Flutter-Code verwendeten Farbe aktivieren.







Im Zusammenhang damit steht eine neue Funktion in IntelliJ und Android Studio, mit der Farbblöcke für Color.fromARGB () und Color.fromRGBO () gerendert werden.







Wir möchten uns ganz besonders bei dratushnyy auf GitHub für den Beitrag zur Verbesserung der Farbvorschau in IntelliJ bedanken !



Typensichere Plattformkanäle für die plattformübergreifende Kommunikation



Als Antwort auf eine beliebte Anfrage von Plugin-Autoren haben wir uns entschlossen zu experimentieren, wie die Kommunikation zwischen Flutter und der Plattform für Plugins und Add-to-App sicherer und einfacher gemacht werden kann . Zu diesem Zweck haben wir Pigeon erstellt , ein Befehlszeilentool, das mithilfe der Dart-Syntax typsicheren Code über Plattform-Pipes ohne zusätzliche Laufzeitabhängigkeiten generiert. Mit Pigeon können Sie Java / Objective-C / Kotlin / Swift-Methoden aufrufen und nicht-primitive Objekte übergeben, indem Sie Dart-Methoden direkt aufrufen (und umgekehrt), anstatt Methodennamen in Plattform-Pipes manuell abzugleichen und Argumente zu serialisieren.







Trotz der Tatsache, dass sich Pigeon noch im Pre-Release-Zustand befindet, hat es sich so weit entwickelt, dass wir es in unserem video_player- Plugin verwenden können . Wenn Sie Pigeon in Ihrem Projekt ausprobieren möchten, lesen Sie die aktualisierte Plattformkanaldokumentation und dieses Beispiel .







Pigeon. , . Mobius GDG DevParty, Flutter- . «» , . -. Pigeon — .





Während der Produktion von Flutter 1.20 haben die Tools so viele großartige Updates erhalten, dass wir sie hier nicht alle auflisten können. Trotzdem werden Sie sicherlich daran interessiert sein, sie sich anzusehen:





Änderungen brechen



Wie immer versuchen wir, Änderungen auf ein Minimum zu beschränken. Hier ist eine Liste solcher Änderungen in Flutter 1.20.





Zusammenfassung



Dies ist die bisher größte Flutter-Version. In diesem Artikel haben wir nur die wichtigsten Verbesserungen bei Tools und Leistung angesprochen und über die interessantesten neuen und aktualisierten Widgets gesprochen.



Wir planen hinzufügen null Sicherheits Unterstützung (siehe Bob Nystrom der ausführlichen Artikel Legendes null Sicherheit ), neue Versionen der Anzeigen, Karten und WebView Plugins und Tool - Unterstützung zu erweitern.



Wie würden Sie neue Flutter-Funktionen auf Ihr Projekt anwenden?


More articles:


All Articles