Flutter pre vývojárov Jetpack Compose: Kompletný praktický sprievodca

Domov » Pytón » Flutter pre vývojárov Jetpack Compose: Kompletný praktický sprievodca

Ak sa už cítite ako doma pri písaní používateľských rozhraní s Jetpack Compose a premýšľate, aké ťažké je prejsť na Flutter, ste vo výbornej pozícii. Obe sady nástrojov sú deklaratívne, reaktívne a vytvorené spoločnosťou Google, takže veľká časť vášho mentálneho modelu sa prenáša takmer jednotlivo. Hlavné rozdiely spočívajú v jazyku (Kotlin vs. Dart), štruktúre projektu a v tom, ako každý framework komunikuje so základnými vrstvami Androidu (a v prípade Flutteru aj iOS, webu a desktopu).

Táto príručka je napísaná špeciálne pre vývojárov Jetpack Compose, ktorí chcú hlbšie porozumieť Flutteru bez marketingových zbytočných zmien. Uvidíte, ako sa základné koncepty prelínajú medzi týmito dvoma svetmi: komponovateľné objekty vs. widgety, modifikátory vs. parametre konštruktora, lenivé rozloženia vs. ListView/GridView, Canvas vs. CustomPainter, navigácia Compose vs. Navigator, remember vs. StatefulWidget a ďalšie. Taktiež prepojíme vaše širšie znalosti Androidu (zobrazenia, životný cyklus, zdroje, zámery, práca na pozadí) s ich ekvivalentmi vo Flutteri, takže krivka učenia sa bude zdať skôr ako krok do strany než ako výstup.

Od Jetpack Compose po Flutter: kde sa vaše zručnosti prenesú

Flutter je UI framework od spoločnosti Google na vytváranie multiplatformových aplikácií pomocou jazyka Dart, zatiaľ čo Jetpack Compose je moderná sada nástrojov pre UI od spoločnosti Google pre natívny Android s využitím Kotlin. V podstate sa zameriavajú na rôzne behové prostredia, ale architektonicky zdieľajú rovnakú hlavnú myšlienku: popísať používateľské rozhranie ako funkciu stavu a nechať framework, aby zistil, kedy a ako ho prekresliť.

V Jetpack Compose uvažujete v pojmoch kompozovateľných funkcií, modifikátorov a rekompozície; vo Flutteri uvažujete v pojmoch widgetov, parametrov konštruktora a prestavieb. Napriek odlišnému pomenovaniu je správanie nápadne podobné: vytvoríte strom prvkov používateľského rozhrania, každý uzol je nemenný a keď sa stav zmení, framework znova prejde tento strom, aby vytvoril aktualizované rozhranie.

Jedným kľúčovým rozdielom je, že Flutter je svojou konštrukciou multiplatformový. Rovnaká kódová základňa Dart je cieliteľná na Android, iOS, web, Windows, macOS a Linux. Compose sa rozširuje aj za hranice Androidu (napríklad s Compose Multiplatform), ale príbeh Flutteru pre viacero zariadení je v súčasnosti oveľa zrelší a súdržnejší, a preto sa naň mnoho tímov zameraných na Android zameriava, keď chcú vyvíjať aplikácie pre iOS alebo desktop.

Vaše pochopenie samotnej platformy Android je stále mimoriadne cenné v projektoch Flutter. Zatiaľ čo vrstva používateľského rozhrania je čisto Dart a widgety, Flutter sa spolieha na Android (a iOS) pre povolenia, konfiguráciu systému, platformové API, upozornenia, prácu na pozadí a mnoho ďalších funkcií, ku ktorým je prístup prostredníctvom pluginov a platformových kanálov. To znamená, že všetka intuícia, ktorú ste si vybudovali o tom, ako sa Android správa, nevyjde nazmar – iba sa posunie o jednu vrstvu nižšie.

Deklaratívny model používateľského rozhrania: kompozovateľné prvky vs. widgety

Jetpack Compose aj Flutter implementujú deklaratívny model používateľského rozhrania: popisujete „ako“ by malo používateľské rozhranie vyzerať pre daný stav, nie „ako“ krok za krokom meniť pohľady. Namiesto volania setterov na zobrazeniach prestavíte strom pri zmene stavu a necháte framework efektívne porovnávať a prekresľovať.

V Jetpack Compose sú prvky používateľského rozhrania kompozičné funkcie anotované pomocou @Composable, často konfigurovaný s Modifier. Tlačidlo by mohlo byť Button(onClick = ..., modifier = Modifier.padding(16.dp))Reťazec modifikátorov dekoruje alebo rozvrhuje kompozovateľný objekt bez zmeny jeho podkladového typu a Compose používa rekompozíciu na obnovenie iba tých častí stromu, ktorých vstupy sa zmenili.

Vo Flutteri sú prvky používateľského rozhrania widgety – obyčajné objekty Dart, ktoré popisujú konfiguráciu. Sú tiež nemenné a usporiadané v stromovej štruktúre, ale namiesto odovzdávania modifikátora zvyčajne odovzdávate argumenty rozloženia alebo štýlu priamo prostredníctvom parametrov konštruktora alebo obalíte widget do iných widgetov rozloženia. Môžete napríklad napísať Padding(padding: EdgeInsets.all(16), child: ElevatedButton(...)) dosiahnuť podobný výsledok.

Životný cyklus kompozovateľných prvkov aj widgetov je zámerne krátky a nemenný. Žijú len dovtedy, kým si nový vstup nevyžiada ich nahradenie; ani jeden sa nepokúša riadiť svoju vlastnú životnosť ani sa priamo mutovať. To je koncepčný posun oproti starému svetu Android View, kde sú pohľady objekty s dlhou životnosťou, ktoré sa časom opätovne používajú a mutujú, a preto sa váš spôsob myslenia Compose vo Flutteri zdá taký prirodzený.

V podstate sa rozloženie v oboch frameworkoch riadi rovnakým vzorom riadeným rodičmi a založeným na obmedzeniach. Rodič sa meria sám, odovzdáva obmedzenia ďalej, deti si vyberajú veľkosť s ohľadom na tieto obmedzenia a rodič umiestňuje svoje deti. Vo Flutteri to uvidíte priamo zobrazené ako BoxConstraints; v Compose sa to rieši v implementáciách MeasurePolicy. V oboch prípadoch môžu rodičia obmedziť deti – widgety si nemôžu jednoducho vybrať ľubovoľnú veľkosť alebo polohu.

Štruktúrovanie aplikácie: vstupný bod, scaffolding a rozloženia

V systéme Android s funkciou Compose je vaším vstupným bodom zvyčajne Activity (často a ComponentActivity) kam voláte setContent na hosťovanie vašich kompozovateľných prvkov. Odtiaľ zostavíte kompozičný strom, zvyčajne začínajúc s MaterialTheme a povrch alebo lešenie, ktoré definuje vaše rozloženie na vysokej úrovni.

Vo Flutteri je vstupným bodom Dart. main funkcia, ktorá volá runApp s koreňovým widgetom vašej aplikácie. Tento koreň je bežne MaterialApp or WidgetsApp widget, ktorý nastavuje smerovanie, témy, lokalizáciu a základný navigátor. Prvá „obrazovka“, ktorú zobrazíte, často používa Scaffold widget, ktorý hrá veľmi podobnú úlohu ako Scaffold v Material 3 Compose: poskytuje vám panel aplikácií, telo, plávajúce tlačidlo akcie, zásuvky atď.

V prípade jednoduchého textu a statického obsahu môže Compose predvolene zalamovať obsah – prispôsobovať veľkosť vnútornému obsahu – zatiaľ čo mnohé widgety Flutter predvolene zaberajú viac dostupného priestoru, pokiaľ nie sú obmedzené. Napríklad, ak umiestnite Text kompozibilný vo vnútri stĺpca, automaticky nevyplní šírku. Vo Flutteri, Text vnútri a Column sa môže správať rôzne v závislosti od obmedzení rodičovského objektu. Na vycentrovanie obsahu vo Flutteri budete často zabaľovať veci do Center widget alebo použite widgety rozloženia ako napríklad Align, Row, Columna Expanded v kombinácii s vlastnosťami zarovnania.

Lineárne rozloženia sa mapujú takmer dokonale: Compose má Row a Column, a rovnako aj Flutter. Vo Flutteri pasujete deti ako List<Widget> a ovládať rozstupy a zarovnanie pomocou vlastností ako MainAxisAlignment a CrossAxisAlignmentV aplikácii Compose sa spoliehate na horizontalArrangement, verticalArrangement, horizontalAlignment a verticalAlignmentUžitočný spôsob, ako o tom premýšľať: vlastnosti končiace na „Usporiadanie“ sa mapujú na hlavnú os Flutteru a tie, ktoré končia na „Zarovnanie“, sa mapujú na priečnu os.

Keď potrebujete relatívne alebo prekrývajúce sa rozloženia, prístupy sú tiež koncepčne zosúladené. V systéme Android XML môžete siahnuť po RelativeLayout alebo vnorenú zmes LinearLayout a FrameLayoutV aplikácii Compose by ste písali Row, Column a Box (alebo napíšte vlastné rozloženie). Vo Flutteri je analógom Row, Column a Stack v kombinácii s umiestnenými podradenými prvkami a možnosťami zarovnania. Váš mentálny model pre usporiadanie prvkov voči sebe sa pohybuje takmer bez zmeny.

Tlačidlá, vstup a interakcia

V Jetpack Compose vytvorenie tlačidla zvyčajne znamená použitie Button alebo jeden z jeho variantov Material, ktorý v rámci Material 3 zodpovedá špecifickej implementácii, ako napríklad FilledTonalButton. Poskytnete onClick lambda a voliteľný štýl, často prostredníctvom parametrov ako colors alebo modifikátory pre odsadenie, šírku a zarovnanie.

Vo Flutteri je ekvivalentom použitie widgetov ako FilledButton, ElevatedButton, TextButton or OutlinedButton. Každý si vezme onPressed spätné volanie a child widget – najčastejšie TextMôžete ich prispôsobiť odovzdaním style via ButtonStyle alebo pomocou globálneho prepísania témy, ktoré vám umožňuje centrálne upraviť farbu, tvar, výšku a veľkosť pre celú rodinu tlačidiel.

Na spracovanie gest sa Compose spolieha na modifikátory ako napríklad Modifier.clickable v mnohých prípadoch, ale v prípade potreby môžete prejsť aj na špecializované detektory gest. Dlhé stlačenia, ťahania a vlastné gestá sa zvyčajne vytvárajú prostredníctvom špecializovaných modifikátorových API a zdrojov interakcie.

Flutter odhaľuje explicitný GestureDetector widget, ktorý obalíte okolo čohokoľvek, čo nemá vstavanú podporu gest. Ponúka širokú škálu spätných volaní: onTap, onDoubleTap, onLongPress, onVerticalDragStart, onVerticalDragUpdate, onHorizontalDragEnd a mnoho ďalších. Widgety ako ElevatedButton už odhaliť onPressed vlastnosť, ale pre úplne vlastné prvky používateľského rozhrania môžete použiť GestureDetector alebo widgety vyššej úrovne, ako napríklad InkWell pre spätnú väzbu zvlnenia materiálu.

Vkladanie textu vo Flutteri sa spravuje pomocou TextField or TextFormField, ktorého štýl sa vyrovnáva s Composeovým TextField a OutlinedTextField kompozovateľné materiály. Tipy, popisky, chyby a orámovanie konfigurujete pomocou InputDecoration podobne ako používate vy TextFieldDefaults alebo parametre v textových poliach pri písaní. Podobne ako v režime písania, chybové hlásenia sa zvyčajne zobrazujú reaktívne zmenou stavu a prebudovaním dekorácie, a nie manuálnou manipuláciou so zobrazeniami.

Zoznamy, mriežky a posúvateľný obsah

Jetpack Compose ponúka dve hlavné stratégie pre zoznamy: jednoduché Column/Row s iteráciou pre malé kolekcie a LazyColumn/LazyRow/LazyVerticalGrid/LazyHorizontalGrid pre veľké alebo dynamické zoznamy. Lenivé kontajnery zostavujú iba to, čo je viditeľné, čo udržiava vysoký výkon pri práci s tisíckami položiek.

Flutter sa riadi rovnakým prístupom malých verzus veľkých, ale s rôznymi widgetmi. Pre malý zoznam, ktorý sa zmestí na obrazovku, môžete použiť Column a namapujte svoje údaje na childrenPo všetkom, čo sa posúva, siahnete ListView or GridView, s konštruktormi, ktoré lenivo vytvárajú potomky iba vtedy, keď je to potrebné.

Bežný vzorec vo Flutteri je ListView.builder, čo odráža lenivé položky zoznamu DSL v Compose. Dodávate itemCount a itemBuilder spätné volanie; Flutter volá tento builder s indexom od 0 do itemCount - 1 vždy, keď sa zobrazí nová položka. V rámci nástroja na tvorbu môžete vrátiť takmer akýkoľvek widget – od jednoduchého ListTile s textom a ikonou až po zložité, vlastné riadky zoznamu.

Pre mriežky, Compose LazyVerticalGrid a LazyHorizontalGrid mapa k Flutteru GridView widgetu. Namiesto priameho odovzdávania počtu stĺpcov do mriežky Flutter často používa delegáta, ako napríklad SliverGridDelegateWithFixedCrossAxisCount or SliverGridDelegateWithMaxCrossAxisExtent na ovládanie rozloženia buniek. Tieto delegáty zapuzdrujú pravidlá ako „počet stĺpcov“ alebo „maximálna šírka bunky“, podobné parametrom veľkosti mriežky, ktoré používate v aplikácii Compose.

Správanie pri rolovaní je tiež analogické v oboch súpravách nástrojov. Lenivé zoznamy v Compose majú zabudované rolovanie; neobalujete ich do ďalších kontajnerov na rolovanie. Vo Flutteri je veľa widgetov zoznamov a mriežok samých o sebe rolovateľných, ale pre jeden, neopakujúci sa obsah, ktorý by sa mal rolovať, môžete použiť SingleChildScrollViewVytváranie vlastných posúvateľných stránok sa potom stáva záležitosťou vnorenia alebo skladania segmentov pre pokročilejšie prípady použitia.

Adaptívne a responzívne vzory používateľského rozhrania

Compose vám ponúka niekoľko stratégií pre responzívny dizajn: vlastné rozloženia, BoxWithConstraints, WindowSizeClass a adaptívnu knižnicu Material 3. Tieto vám umožňujú zmeniť kompozíciu na základe dostupného priestoru, polohy a kategórie zariadenia a môžete ich kombinovať v závislosti od zložitosti projektu.

Flutter sa nepokúša priamo kopírovať tieto API, ale základná myšlienka je rovnaká: skontrolovať obmedzenia a charakteristiky obrazovky a potom rozvetviť rozloženie. Dva hlavné nástroje sú LayoutBuilder a MediaQuery. LayoutBuilder priechody BoxConstraints nadol, aby ste mohli vymieňať alebo meniť poradie widgetov nad určitou šírkou alebo výškou. MediaQuery zobrazuje veľkosť obrazovky, orientáciu, odsadenie a hustotu pixelov pre body prerušenia na vysokej úrovni.

Namiesto snahy o jednoznačné mapovanie medzi adaptívnymi riešeniami Compose a Flutteru je efektívnejšie premýšľať z hľadiska vašich dizajnových požiadaviek. Keď viete, ako by sa malo vaše používateľské rozhranie prispôsobiť telefónom, tabletom a počítačom, môžete túto logiku vyjadriť buď prostredníctvom nástroja Compose WindowSizeClass a adaptívne rozloženia alebo Flutterove vetvenie riadené obmedzeniami a médiami. Rovnaké dizajnové myslenie – rôzne API.

Správa stavu: pamätajte vs StatefulWidget a ďalšie

Jetpack Compose ukladá dočasný stav používateľského rozhrania pomocou remember a držitelia štátnych príslušníkov ako mutableStateOf, často kombinované s ViewModel a architektonické komponenty pre dlhšie trvajúci stav. Keď sa stav zmení, dôjde k rekompozícii a príslušné kompozovateľné prvky získajú nové hodnoty.

Príbeh o nízkoúrovňovom stave vo Flutteri sa točí okolo StatefulWidget a s ním spojené State objekt. Widget, ktorý chce uchovávať stav, definujete rozšírením StatefulWidget, potom implementujte samostatný State<MyWidget> trieda na ukladanie meniteľných polí. Vždy, keď tieto polia aktualizujete, zavoláte setState(), čo označí danú časť stromu widgetov ako nečistú a spustí prestavbu. Na tejto úrovni je to veľmi podobné ukladaniu stavu kompozície pomocou remember a zneplatnenie kompozovateľných prvkov pri zmene hodnôt.

V prípade zložitejších aplikácií sa Flutter vo veľkej miere opiera o komunitné a vlastné vzory: Provider, Riverpod, Bloc, obchody v štýle Redux a ďalšie. Tieto fungujú ako analógy vašich architektonických stackov Androidu: ViewModel + LiveData/Flow + repozitáre v projektoch Compose. Centralizujú obchodnú logiku a sprístupňujú reaktívne toky údajov, ktoré riadia prestavby widgetov. Z prostredia Compose vám mnohé z týchto vzorov budú známe, aj keď sa rozhrania API líšia.

Jeden bod, ktorý často prekvapuje vývojárov systému Android, je, že widgety bez stavovej hodnoty aj so stavovou hodnotou vo Flutteri sa často prestavujú – potenciálne každý snímok počas animácií. Rozdiel nie je vo frekvencii prestavby, ale v tom, kde je uložený meniteľný stav: StatefulWidget vám dá spoločníka State objekt, ktorý prežije prestavby, podobne ako remember umožňuje hodnotám prežiť rekompozíciu v Compose.

Kreslenie, animácia a vizuálna prepracovanosť

Ak ste niekedy pracovali priamo s Androidom Canvas a Drawable, Napíšte Canvas kompozovateľné sa pravdepodobne zdalo jednoduché. Poskytuje deklaratívny spôsob kreslenia tvarov, obrázkov a textu v Kotline, pričom skrýva veľa z imperatívnej ceremónie tradičných vlastných zobrazení.

Flutter odhaľuje podobnú kresliacu plochu cez Canvas API, prístupné cez CustomPaint a CustomPainter. Implementujete CustomPainter trieda, kde prepíšete paint metóda kreslenia na plátno pomocou Paint objekty, cesty, transformácie a tak ďalej. Potom tento nástroj na kreslenie pripojíte k CustomPaint widget. V podstate sa Compose aj Flutter opierajú o engine Skia, takže primitívy – čiary, cesty, shadery – vyzerajú veľmi dobre známe z 2D vykresľovania v Androide.

V prípade animácií sa Flutter opiera o explicitný animačný systém postavený okolo AnimationController, Animation<T> a doplnenia, plus bohatú sadu animovaných widgetov. Vytvoríte inštanciu ovládača (zvyčajne pomocou SingleTickerProviderStateMixin pre vsync), definujte CurvedAnimations alebo Tweeny, ktoré mapujú priebeh 0-1 na hodnoty domény a potom ich prepojte s widgetmi ako FadeTransition, ScaleTransition, AnimatedBuilder alebo implicitné widgety ako napríklad AnimatedContainerAnimačný systém tiež odhaľuje AnimationStatus spätné volania reagujúce na začiatok, dokončenie alebo zvrátenie.

Animačné API rozhrania Jetpack Compose sú deklaratívne zhora nadol s funkciami ako animate*AsState, prechody a animovanú viditeľnosť. Namiesto manuálnej správy ovládačov vo väčšine bežných prípadov popíšete cieľové stavy a framework riadi interpoláciu v priebehu času. Keď potrebujete viac ovládania na mieru, stále máte prístup k nízkoúrovňovým primitívam, ale obvyklá cesta je stručnejšia ako klasický Android XML alebo imperatívny animačný kód.

Koncepčne sa obe sady nástrojov používajú rovnakým spôsobom: widgety/kompozičné prvky sa udržiavajú ľahké a čisté, prenášajú sa cez ne časovo premenné hodnoty a interpoláciu a zneplatnenie necháva framework. Ako vývojár Compose, extra explicitnosť Flutteru AnimationController Na prvý pohľad sa to môže zdať trochu staromódne, ale získate tak veľmi jemnú kontrolu nad načasovaním, krivkami a orchestráciou.

Štýl, témy, písma a prvky

Moderné aplikácie žijú alebo zomrú na uhladenosti, takže Flutter aj Compose kladú veľký dôraz na témy a štýl. Použitie v službe Compose MaterialTheme s farebnými schémami, typografiou a definíciami tvarov a môžete vnorovať témy na prepísanie hodnôt pre podstromy – vrátane vynútenia svetlých alebo tmavých povrchov pre konkrétne oblasti.

Vo Flutteri je to ekvivalent ThemeData prešiel na MaterialApp or Theme miniaplikácie. Definujete primárne farby, jas, typografiu a témy špecifické pre jednotlivé komponenty, ako napríklad elevatedButtonTheme, textButtonTheme, appBarTheme a ďalšie. Témy môžete lokálne prepísať zabalením podstromov do Theme widgety, ktoré kopírujú rodičovskú položku a upravujú určité polia. Svetlý a tmavý režim je možné prepínať na úrovni aplikácie poskytnutím theme a darkTheme a ovládanie themeMode.

Štýlovanie textu je známe teritórium: v aplikácii Compose buď priamo odovzdávate jednoduché vlastnosti do Text alebo dodať TextStyle objekt. Flutter to odráža pomocou Text widget, ktorý akceptuje TextStyle cez jeho style parameter. TextStyle zahŕňa rodinu písma, veľkosť, hrúbku, rozstupy písmen, výšku riadku, dekorácie a ďalšie. Globálne textové témy môžete definovať v ThemeData.textTheme a odkazovať na ne všade, rovnako ako by ste použili typografiu z MaterialTheme v aplikácii Napísať.

Fonty a obrázky sa spracovávajú prostredníctvom zdrojov, a nie tradičným spôsobom ako v systéme Android. /res strom adresárov. Flutter nevynucuje konkrétne rozloženie priečinkov; aktíva deklarujete v pubspec.yaml a potom sa na ne odkazovať z kódu. Obrázky sa zvyčajne načítavajú pomocou Image.asset(), čo sa na základe správnych údajov o hustote rozdelí na devicePixelRatioLogické pixely hrajú rovnakú úlohu ako dp v systéme Android, čím sa abstrahuje fyzická hustota pixelov.

V prípade vlastných fontov vám Compose umožňuje buď zabaliť zdroje fontov, alebo ich stiahnuť za behu prostredníctvom poskytovateľov, ako sú Google Fonts, a potom ich prepojiť s FontFamily a typografiu. Flutter používa takmer rovnaký vzorec: umiestni súbory s písmami do priečinka s aktívami, vypíš ich v pubspec.yamla potom odkazovať na rodinu písiem podľa názvu v TextStyleAk chcete písma načítané za behu programu, existuje populárna funkcia google_fonts plugin, ktorý sprístupňuje funkcie Dart pomenované podľa fontov – napr. GoogleFonts.robotoTextTheme()– aby ste ich rýchlo prepojili s vašou témou.

Oba ekosystémy považujú reťazce a lokalizáciu za prvotriedne záležitosti, hoci Flutter nemá priamy ekvivalent k XML reťazcovým zdrojom systému Android. Namiesto toho je najlepšou praxou ponechať preklady .arb súbory a prepojiť ich s lokalizačnými nástrojmi Flutter. Prístup k nim sa potom uskutočňuje prostredníctvom vygenerovaných tried Dart, čo je zhruba analogické s použitím R.string identifikátory v kóde systému Android.

Koncepty platformy Android cez optiku Flutteru

Okrem používateľského rozhrania je jednou z najväčších otázok, ktoré si vývojári Compose kladú, to, ako sa ich znalosti o systéme Android premietajú do architektúry Flutteru. Našťastie, mnohé z kľúčových myšlienok – aktivity, životný cyklus, zámery, práca na pozadí, zdroje, vytváranie sietí – majú jasné náprotivky, aj keď povrchové API vyzerá inak.

V systéme Android Activity a Fragment sú vaše primárne obrazovky a kontajnery; vo Flutteri je všetko widget a navigácia sa deje cez Navigator a Route objektov. Trasa zhruba zodpovedá aktivite alebo fragmentu, ale zvyčajne existuje iba jeden hosting. Activity v systéme Android, ktorý má vstavaný engine Flutter. Trasy vkladáte a odoberáte na zásobníku Navigatora, buď prostredníctvom pomenovaných trás definovaných v MaterialApp alebo prostredníctvom priamo skonštruovaného PageRoute prípady ako MaterialPageRoute.

Spätné volania počas životného cyklu systému Android (onCreate, onStart, onResumeatď.) nemajú v kóde Flutteru vzájomné prepojenia typu one-to-one, ale životný cyklus aplikácie môžete sledovať pomocou WidgetsBindingObserver. Odhaľuje štáty ako resumed, inactive, paused a detached, ktoré zhruba zodpovedajú fázam viditeľnosti, pozadia a zničenia systému Android. Keď skutočne potrebujete nízkoúrovňové hooky životného cyklu na správu zdrojov, zvyčajne ich implementujete na natívnej strane systému Android v FlutterActivity alebo plugin, nie v Darte.

Intenty hrajú v systéme Android dve úlohy: navigáciu v aplikácii a komunikáciu medzi aplikáciami. Ako už bolo spomenuté, Flutter nemá navigačné API založené na zámeroch – Navigator ho v rámci sveta Dartu plne nahrádza. Pre úlohy naprieč aplikáciami (spustenie kamery, výber súborov, spracovanie zámerov zdieľania) sa zvyčajne používajú pluginy, ktoré obalia potrebné volania pre Android (a iOS). Ak neexistuje žiadny plugin, môžete si napísať vlastný pomocou MethodChannels na komunikáciu medzi Dartom a natívnym kódom, preposielanie zámerov a výsledkov ako správ.

Tvoje chápanie práce na pozadí a vláknovania sa tiež prenáša, ale primitívy vyzerajú inak. Android vás núti presunúť sieťové a diskové I/O operácie z hlavného vlákna pomocou korutín, AsyncTask (staršie funkcie), WorkManager, JobScheduler, RxJava atď. Dart naopak používa jednovláknovú slučku udalostí pre každý izolát s async/await pre I/O operácie a samostatnými izolátmi pre prácu náročnú na CPU. Pre čokoľvek viazané na I/O operácie stačí označiť svoje funkcie. async, await operáciu a nechajte slučku udalostí udržiavať používateľské rozhranie responzívne; pre náročné úlohy CPU spustíte izolát a komunikujete prostredníctvom odosielania správ namiesto zdieľanej pamäte.

V oblasti sietí je Flutter populárny http Balík hrá podobnú úlohu ako OkHttp + Retrofit pre základné prípady použitia. Skrýva väčšinu práce s nízkoúrovňovými socketmi a prirodzene sa integruje s async/await. Pre komplexné potreby môžete prejsť na balíky ako dio, ale základný vzorec zostáva: vykonanie asynchrónneho volania, čakanie na výsledok, aktualizácia stavu pomocou setState() alebo vami zvoleného správcu stavu a znova vytvorte postihnuté widgety.

Pluginy, úložisko, Firebase a nástroje

V Androide ste zvyknutí deklarovať závislosti v Gradle; vo Flutteri ich deklarujete v pubspec.yaml a načítať ich zo súboru pub.dev. Súbory Gradle pod android/ Priečinky projektu Flutter sú väčšinou určené na integrácie špecifické pre platformu alebo keď potrebujete vlastné natívne knižnice – každodenný vývoj aplikácií zostáva v krajine Dartu.

Zdieľané preferencie a SQLite majú tiež hotové ekvivalenty. Kde Android ponúka SharedPreferences pre malé úložisko kľúč-hodnota a SQLite (alebo Room) pre štruktúrované dáta, Flutter ich obaluje pomocou pluginov ako shared_preferences a sqfliteTieto pluginy zjednocujú správanie systémov Android a iOS, takže môžete používať jedno rozhranie Dart API bez ohľadu na platformu a zároveň sa spoliehať na základné natívne implementácie.

Integrácia s Firebase je podobne jednoduchá a prvotriedna. Väčšina služieb Firebase – Authentication, Firestore, Realtime Database, Cloud Messaging, Analytics, Remote Config a ďalšie – má oficiálne pluginy Flutter, ktoré spravujú tímy Firebase a Flutter. Odrážajú koncepčný model z Androidových Firebase SDK, ale s Dart-idiomatic API. Pre ďalšie špecifické funkcie Firebase, ktoré nie sú priamo pokryté, existuje zdravý ekosystém pluginov tretích strán na pub.dev.

Na ladenie a profilovanie vám balík DevTools od Flutteru poskytuje bohatú sadu nástrojov priamo porovnateľnú s profilerom a Layout Inspectorom v Android Studiu. Môžete kontrolovať strom widgetov, sledovať prestavby, sledovať alokácie pamäte, diagnostikovať úniky a fragmentáciu a prechádzať kódom Dart. V kombinácii s podporou IDE v Android Studio a VS Code, horúcim opätovným načítaním a horúcim reštartom sa cyklus spätnej väzby vo vývoji na Flutteri zdá byť prinajmenšom rovnako tesný – a často aj tesnejší – ako to, na čo ste zvyknutí v Compose.

Push notifikácie, ďalší bežný problém systému Android, sa vo Flutteri riešia pomocou pluginov ako firebase_messaging. V podstate komunikujú s Firebase Cloud Messaging a natívnymi notifikačnými frameworkami v systémoch Android a iOS, ale logika vašej aplikácie sa nachádza v jednotnom rozhraní Dart API. Konfigurácia a správanie špecifické pre platformu (ako napríklad notifikačné kanály v systéme Android) sú stále dôležité a vaše existujúce skúsenosti s týmito podrobnosťami o platforme sú naďalej veľmi relevantné.

Dokonca aj widgety domovskej obrazovky v systéme Android, ktoré nie je možné implementovať čisto vo Flutteri, sa stále dajú integrovať s kódom Flutteru. Zvyčajne ich zostavíte pomocou rozložení Jetpack Glance alebo XML a potom použijete balík ako napríklad home_widget komunikovať s vašou aplikáciou Flutter, zdieľať dáta a dokonca vkladať rastrované používateľské rozhranie Flutteru ako obrázok do natívneho widgetu. Tento hybridný prístup vám umožňuje zachovať si hlavné rozhranie vo Flutteri a zároveň rešpektovať obmedzenia platformy.

Pri pohľade na všetky tieto paralely vývojár Jetpack Compose, ktorý vstupuje do Flutteru, vôbec nezačína od nuly. Vaše chápanie deklaratívneho používateľského rozhrania, životného cyklu Androidu, navigácie, stavu, zdrojov a asynchrónnej práce sa veľmi prirodzene prelína so svetom Flutteru; najviac sa menia názvy, jazyk (Dart) a multiplatformové myslenie. Keď si osvojíte widgety a Navigator ako základné koncepty, zvyšok balíka sa zvyčajne rýchlo prispôsobí.