- U-Flutter kanye ne-Jetpack Compose babelana ngemodeli ye-UI ememezelayo, esebenzayo, kodwa ihlukile ngolimi, i-ecosystem kanye nokufinyelela kwenkundla.
- Dala amamephu ngendlela ehlanzekile eya emicabangweni ye-Flutter: okuhlanganiselwa kumawijethi, izinhlu ezivilaphayo ku-ListView/GridView, Canvas to CustomPainter nezindikimba ku-ThemeData.
- Amakhono omdabu we-Android (umjikelezo wempilo, ukuzulazula, izinsiza, ukuvumelanisa) adlulisela ngokuqondile ku-Flutter ngamawijethi, i-Navigator, amafa kanye ne-async/await.
- Kumaphrojekthi we-Android kuphela Ukuqamba kuyakhanya, kuyilapho i-Flutter ihamba phambili uma udinga i-codebase eyodwa ye-Android, iOS, iwebhu nedeskithophu.
Uma usuvele uzizwa usekhaya ngokubhala ama-UI nge-Jetpack Compose futhi uyazibuza ukuthi kunzima kangakanani ukuya e-Flutter, usesimweni esihle. Womabili amakhithi amathuluzi ayadalula, ayasebenza futhi akhiwe i-Google, ngakho ingxenye enkulu yemodeli yakho yengqondo ithwala cishe okukodwa kuya kokukodwa. Umehluko omkhulu uhlala olimini (Kotlin vs Dart), ukwakheka kwephrojekthi kanye nendlela uhlaka ngalunye lukhuluma ngayo nezingqimba ze-Android (futhi, esimweni sikaFlutter, iOS, web kanye nedeskithophu).
Lo mhlahlandlela ubhalelwe abathuthukisi be-Jetpack Compose abafuna ukuqonda i-Flutter ngokujulile, ngaphandle kokumaketha kwe-fluff. Uzobona ukuthi imiqondo ewumongo imephu phakathi kwale mihlaba emibili: okuhlanganisayo uma kuqhathaniswa namawijethi, izishintshi ziqhathaniswa namapharamitha omakhi, Izakhiwo Ezivilaphayo vs ListView/GridView, Canvas vs CustomPainter, Navigation Compose vs Navigator, khumbula vs StatefulWidget nokuningi. Sizophinde sixhume ingemuva lakho elibanzi le-Android (Ukubuka, umjikelezo wempilo, izinsiza, izinhloso, umsebenzi ongemuva) nokulingana kwakho kwe-Flutter ukuze ijika lokufunda lizwakale njengesinyathelo esisemaceleni kunokukhuphuka.
Ukusuka ku-Jetpack Compose kuya ku-Flutter: lapho amakhono akho adluliselwa khona
I-Flutter iwuhlaka lwe-UI lwe-Google lokwakha izinhlelo zokusebenza zenkundla zisebenzisa ulimi lwe-Dart, kuyilapho i-Jetpack Compose iyikhithi yamathuluzi ye-Google ye-UI yesimanje ye-Android yomdabu isebenzisa i-Kotlin. Ngaphansi kwe-hood baqondise izikhathi ezisebenzayo ezihlukene, kodwa ngokwezakhiwo babelana ngombono omkhulu ofanayo: chaza i-UI njengomsebenzi wezwe, vumela uhlaka luveze ukuthi ludwetshwa nini futhi kanjani.
Ku-Jetpack Compose ucabanga ngokwemisebenzi ehlanganisekayo, iziguquli kanye nokuqamba kabusha; ku-Flutter ucabanga ngokwamawijethi, imingcele yabakhi kanye nokwakha kabusha. Ngaphandle kokuqamba okuhlukile, ukuziphatha kufana ngokumangalisayo: wakha isihlahla sezinto ze-UI, indawo ngayinye ayinakuguqulwa, futhi lapho isimo sishintsha uhlaka luhamba leso sihlahla futhi ukuze sikhiqize isixhumi esibonakalayo esibuyekeziwe.
Umehluko owodwa oyinhloko ukuthi i-Flutter iyinkundla enqamulayo ngokuklama. I-codebase ye-Dart efanayo ingakhomba i-Android, i-iOS, iwebhu, iWindows, i-macOS ne-Linux. Ukuqamba kunwebeka ngale kwe-Android (ngokwesibonelo nge-Compose Multiplatform), kodwa indaba ka-Flutter yamadivayisi amaningi ivuthiwe futhi ihlangene kakhulu njengamanje, yingakho nje amaqembu amaningi e-Android yokuqala eyibheka lapho efuna ukuthumela ku-iOS noma ideskithophu.
Ukuqonda kwakho inkundla ye-Android ngokwayo kusabaluleke kakhulu kumaphrojekthi we-Flutter. Nakuba ungqimba lwe-UI luyi-Dart namawijethi emsulwa, i-Flutter incike ku-Android (kanye ne-iOS) ukuze uthole izimvume, ukumiswa kwesistimu, ama-API wesikhulumi, izaziso, umsebenzi wangemuva namanye amakhono amaningi, afinyelelwa ngama-plugin neziteshi zesikhulumi. Lokho kusho ukuthi yonke intuition owakhe mayelana nendlela i-Android eziphatha ngayo ayimoshi—ivele yehlise isendlalelo esisodwa.
Imodeli ye-UI ememezelayo: okuhlanganisiwe kuqhathaniswa namawijethi
Kokubili i-Jetpack Compose ne-Flutter zisebenzisa imodeli ye-UI ememezelayo: uchaza ukuthi "indlela" i-UI okufanele ibukeke ngayo esimweni esithile, hhayi "indlela" yokushintsha ukubuka isinyathelo ngesinyathelo. Esikhundleni sokubiza ama-setter ekubukeni, wakha kabusha isihlahla sakho lapho isimo sishintsha futhi uvumele uhlaka luhluke futhi ludwebe kabusha kahle.
Ku-Jetpack Compose, izakhi ze-UI ziyimisebenzi ehlanganisekayo echazwe ngayo @Composable, evame ukulungiselelwa nge-a Modifier. Inkinobho ingase ibe Button(onClick = ..., modifier = Modifier.padding(16.dp)). Iketango lokuguqula lihlobisa noma lendlale okuhlanganisekayo ngaphandle kokushintsha uhlobo lwayo lwangaphansi, futhi Ukuqamba kusebenzisa ukuhlanganisa kabusha ukuze kuvuselelwe kuphela izingxenye zesihlahla okufakwa kuzo okushintshile.
Ku-Flutter, izakhi ze-UI zingamawijethi—izinto ze-Dart ezicacile ezichaza ukumisa. Futhi awaguquki futhi ahlelwe esihlahleni, kodwa esikhundleni sokudlulisa isilungisi ngokuvamile udlula isakhiwo noma ama-agumenti wesitayela ngokuqondile ngamapharamitha omakhi, noma usonga iwijethi kwamanye amawijethi esakhiwo. Ngokwesibonelo, ungase ubhale Padding(padding: EdgeInsets.all(16), child: ElevatedButton(...)) ukuzuza umphumela ofanayo.
Umjikelezo wempilo yakho kokubili okuhlanganisayo namawijethi uphila isikhashana ngamabomu futhi awuguquleki. Baphila kuphela kuze kube yilapho okokufaka okusha kudinga ukuthi kushintshwe; futhi ayizami ukulawula ukuphila kwayo noma ukuziguqula ngokuqondile. Lokho wukushintsha komqondo ukusuka ezweni elidala le-Android View lapho ukubukwa kuyizinto eziphile isikhathi eside, ziphinde zisetshenziswe futhi ziguqulwe ngokuhamba kwesikhathi, yingakho indlela yakho yokucabanga ethi Bhala uzizwa ungokwemvelo ku-Flutter.
Ngaphansi kwe-hood, isakhiwo kuzo zombili izinhlaka silandela iphethini efanayo eshayelwa umzali, esekelwe ekukhawuleni. Umzali uyazilinganisa, wehlise imingcele, izingane zikhetha usayizi ohlonipha lezo zingqinamba, futhi umzali ubeka izingane zakhe. Ku-Flutter uzobona lokhu kuvele ngqo njenge BoxConstraints; kokuthi Ukuqamba kusingathwa ekusetshenzisweni kwe-MeasurePolicy. Kuzo zombili izimo, abazali bangabekela izingane imingcele—amawijethi awakwazi ukumane akhethe noma yimuphi usayizi noma isikhundla ezisithandayo.
Ukuhlela uhlelo lokusebenza: indawo yokungena, isikafula nezakhiwo
Ku-Android ene-Compose, indawo yakho yokungena ngokuvamile i- Activity (ngokuvamile a ComponentActivity) lapho ofona khona setContent ukusingatha okuhlanganisayo kwakho. Ukusuka lapho wakha isihlahla esihlanganisekayo, esivame ukuqala ngo- MaterialTheme kanye nendawo noma isikafula esichaza isakhiwo sakho sezinga eliphezulu.
Ku-Flutter, indawo yokungena yi-Dart main umsebenzi obizayo runApp ngewijethi yempande yohlelo lwakho lokusebenza. Leyo mpande ivamise ukuthi a MaterialApp or WidgetsApp iwijethi, ehlela umzila, izihloko, ukwenziwa kwasendaweni kanye ne-base navigator. "Isikrini" sokuqala osibonisayo ngokuvamile sisebenzisa a Scaffold iwijethi, edlala indima efana kakhulu ne Scaffold kokuthi Okubalulekile 3 Ukuqamba: ikunikeza ibha yohlelo lokusebenza, umzimba, inkinobho yesenzo esintantayo, amadrowa nokunye.
Ngombhalo olula nokuqukethwe okumile, Ukuqamba kungase kube okuzenzakalelayo kokugoqa okuqukethwe—usayizi wokufanisa nokuqukethwe kwangaphakathi—kanti amawijethi amaningi e-Flutter azenzakalela ukuthatha isikhala esiningi esitholakalayo ngaphandle uma ephoqelelwe. Isibonelo, uma ubeka i-a Text ihlanganiswe ngaphakathi kwekholomu, ngeke igcwalise ububanzi ngokuzenzakalelayo. Ku-Flutter, a Text ngaphakathi a Column ingaziphatha ngendlela ehlukile kuye ngezingqinamba zomzali wayo. Ukuze ubeke phakathi okuqukethwe ku-Flutter, ngokuvamile uzovala izinto ngendlela Center iwijethi, noma sebenzisa amawijethi esakhiwo njenge Align, Row, Column, Futhi Expanded kuhlanganiswe nezakhiwo zokuqondanisa.
Imephu yezakhiwo ezinomugqa cishe iphelele: Ukuqamba kune Row futhi Column, kanjalo neFlutter. Ku-Flutter uphasa izingane njenge List<Widget> futhi ulawule ukuhlukaniswa kwezikhala nokuqondanisa nezakhiwo ezifana MainAxisAlignment futhi CrossAxisAlignment. Ekubhaleni, uthembele horizontalArrangement, verticalArrangement, horizontalAlignment futhi verticalAlignment. Indlela ewusizo yokucabanga ngakho: izakhiwo ezigcina ngokuthi “Uhlelo” kumephu ku-eksisi eyinhloko ye-Flutter, kanye nalezo ezigcina ngokuthi “Ukuqondanisa” imephu ku-eksisi enqamulayo.
Uma udinga izakhiwo eziyisihlobo noma ezigqagqene, izindlela nazo ziqondaniswa ngokomqondo. Ku-Android XML ungase ufinyelele RelativeLayout noma ingxube esidleke ye LinearLayout futhi FrameLayout. Ekubhaleni ungabhala Row, Column futhi Box (noma bhala isakhiwo ngokwezifiso). Ku-Flutter i-analog i Row, Column futhi Stack kuhlanganiswe nezingane ezibekwe endaweni kanye nezinketho zokuqondanisa. Imodeli yakho yengqondo yokuhlela ama-elementi ahlobene ihamba cishe ingashintshile.
Izinkinobho, okokufaka kanye nokuxhumana
Ku-Jetpack Compose, ukwakha inkinobho ngokuvamile kusho ukusebenzisa Button noma okunye okuhlukile kwayo Okubalulekile, ngaphansi kokubalulekile 3 okuxazulula ukusetshenziswa okuthile okufana nalokhu FilledTonalButton. Uhlinzeka nge onClick lambda kanye nesitayela ozikhethela sona, ngokuvamile ngamapharamitha afana colors noma ama-modifiers for padding, ububanzi kanye nokuqondanisa.
Ku-Flutter, okulinganayo kusebenzisa amawijethi afana FilledButton, ElevatedButton, TextButton or OutlinedButton. Ngamunye uthatha i onPressed callback kanye a child iwijethi—imvamisa a Text. Ungawenza ngendlela oyifisayo ngokudlula a style nge ButtonStyle noma usebenzisa ukubhala ngaphezulu kwetimu yomhlaba wonke, okukuvumela ukuthi ulungise phakathi nendawo umbala, umumo, ukuphakama nosayizi womndeni wezinkinobho.
Mayelana nokuphatha ukuthinta, Ukuqamba kuncike kuzilungisi ezifana Modifier.clickable ezimweni eziningi, kodwa ungakwazi futhi ukwehlela ezansi kuzitholi zokuthinta ezikhethekile lapho kudingeka. Ukucindezela okude, ukuhudula nokuthinta ngokwezifiso ngokuvamile kubhalwa ngama-API okulungisa azinikele kanye nemithombo yokusebenzisana.
I-Flutter iveza okusobala GestureDetector iwijethi oyisonga kunoma yini engenakho ukusekela kokuthinta okwakhelwe ngaphakathi. Inikeza izinhlobonhlobo zama-callbacks: onTap, onDoubleTap, onLongPress, onVerticalDragStart, onVerticalDragUpdate, onHorizontalDragEnd nabanye abaningi. Amawijethi afana ElevatedButton vele uveze i onPressed impahla, kodwa ezintweni ezingokwezifiso ze-UI ongazisebenzisa GestureDetector noma amawijethi ezinga eliphezulu njenge InkWell ngempendulo ye-Material ripple.
Ukufakwa kombhalo ku-Flutter kuphethwe nge TextField or TextFormField, isitayela sayo sifana nesika-Compose TextField futhi OutlinedTextField okuhlanganisayo. Ulungiselela amacebo, amalebula, amaphutha kanye nemingcele usebenzisa i InputDecoration kufana nendlela oyisebenzisa ngayo TextFieldDefaults noma amapharamitha kokuthi Bhala izinkambu zombhalo. NjengakuBhala, ngokuvamile ubonisa imilayezo yephutha ngokusebenza ngokushintsha isimo nokwakha kabusha umhlobiso kunokukhohlisa ukubukwa mathupha.
Uhlu, amagridi nokuqukethwe okuskrolayo
I-Jetpack Compose inikeza amasu amabili amakhulu ohlu: elula Column/Row ngokuphindaphinda amaqoqo amancane, kanye LazyColumn/LazyRow/LazyVerticalGrid/LazyHorizontalGrid ngohlu olukhulu noma oluguqukayo. Iziqukathi ezivilaphayo ziqamba kuphela okubonakalayo, okugcina ukusebenza kuphezulu uma kukhulunywa ngezinkulungwane zezinto.
I-Flutter ilandela indlela efanayo encane-vs-enkulu kodwa enamawijethi ahlukene. Ukuze uthole uhlu oluncane olulingana esibukweni ungasebenzisa nje a Column futhi ubhale idatha yakho kuyo children. Kunoma yini eskrolayo, uyafinyelela kuyo ListView or GridView, nabakhi abakha izingane ngobuvila kuphela lapho kudingeka.
Iphethini evamile ku-Flutter ngu ListView.builder, okubonisa izinto zohlu lokuvilapha luka-Compose DSL. Uhlinzeka nge itemCount futhi a itemBuilder shaya ucingo futhi; I-Flutter ibiza lowo makhi ngenkomba ukusuka ku-0 kuye itemCount - 1 noma nini lapho into entsha ivela. Ngaphakathi komakhi ungabuyisela cishe noma iyiphi iwijethi—kusuka kwelula ListTile ngombhalo nesithonjana kuya kuhlu, imigqa yangokwezifiso.
Okwamagridi, Okubhaliwe LazyVerticalGrid futhi LazyHorizontalGrid imephu eya eFlutter's GridView iwijethi. Esikhundleni sokudlulisa ikholomu ibala ngqo kugridi, i-Flutter ivamise ukusebenzisa isithunywa njengokuthi SliverGridDelegateWithFixedCrossAxisCount or SliverGridDelegateWithMaxCrossAxisExtent ukulawula ukuthi amaseli abekwe kanjani. Lezi zithunywa zihlanganisa imithetho “njengenombolo yamakholomu” noma “ububanzi beseli obukhulu,” obufana nomoya namapharamitha kasayizi wegridi owasebenzisayo kokuthi Bhala.
Ukuziphatha kokuskrola nakho kuyafana kuwo womabili amathuluzi wamathuluzi. Uhlu lokuvilapha lukaBhala luza nokuskrola okubhakwe phakathi; awuzisongi ngeziqukathi zokuskrola ezengeziwe. Ku-Flutter, uhlu oluningi kanye namawijethi egridi ngokwawo ayakwazi ukuskroleka, kodwa kokuqukethwe okukodwa, okungaphindi okufanele kuskrolwe ungasebenzisa. SingleChildScrollView. Ukwakha amakhasi ahlelekayo anyakaziswayo bese kuba yindaba yokuzalela noma ukuhlanganisa ama-sliver ukuze uthole izimo ezithuthuke kakhulu zokusetshenziswa.
Amaphethini e-UI aguquguqukayo futhi asabelayo
Ukuqamba kukunikeza amasu amaningana omklamo ophendulayo: izakhiwo ezingokwezifiso, BoxWithConstraints, WindowSizeClass kanye nomtapo wezincwadi oguquguqukayo we-Material 3. Lokhu kukuvumela ukuthi ushintshe ukwakheka kwakho ngokusekelwe esikhaleni esitholakalayo, ukuma nesigaba sedivayisi, futhi ungazixuba ngokuya ngobunkimbinkimbi bephrojekthi.
I-Flutter ayizami ukubonisa lawo ma-API ngokuqondile, kodwa umqondo oyisisekelo uyefana: hlola izingqinamba nezici zesikrini, bese uhlanganisa isakhiwo sakho. Amathuluzi amabili amakhulu LayoutBuilder futhi MediaQuery. LayoutBuilder maqembu BoxConstraints phansi ukuze ukwazi ukushintshanisa noma ukuhlela kabusha amawijethi ngaphezu kobubanzi obuthile noma ubude. MediaQuery kuveza usayizi wesikrini, umumo, i-padding kanye nokuminyana kwe-pixel kuma-breakpoints eleveli ephezulu.
Esikhundleni sokuhlose ukwenza imephu yomuntu ngamunye phakathi kwezixazululo eziguquguqukayo ze-Compose kanye ne-Flutter, kusebenza kahle kakhulu ukucabanga ngokwezidingo zakho zedizayini. Uma usuyazi ukuthi i-UI yakho kufanele ijwayelane kanjani namafoni wonkana, amathebulethi namadeskithophu, ungakwazi ukuveza lokho kunengqondo nge-Compose's. WindowSizeClass kanye nezakhiwo eziguquguqukayo noma i-branch eqhutshwa yi-Flutter kanye ne-media-driven. Ukucabanga komklamo ofanayo—ama-API ahlukene.
Abaphathi bezwe: khumbula ngokumelene ne-StatefulWidget nangale kwalokho
I-Jetpack Compose igcina i-Ephemeral UI state isebenzisa remember kanye nabanikazi bombuso abafana mutableStateOf, ngokuvamile kuhlanganiswe ne ViewModel kanye nezingxenye zezakhiwo zombuso ophile isikhathi eside. Uma isimo sishintsha, ukuqamba kabusha kuyenzeka futhi okuhlanganiswe okuhambisanayo kuthola amanani amasha.
Indaba yezinga eliphansi lika-Flutter izungeza StatefulWidget nokuhambisana nayo State into. Uchaza iwijethi efuna ukubamba isimo ngokunweba StatefulWidget, bese usebenzisa okuhlukile State<MyWidget> class ukugcina izinkambu eziguquguqukayo. Noma kunini uma ubuyekeza lezo zindawo, uyafona setState(), okumaka leyo ngxenye yesihlahla sewijethi njengengcolile futhi icuphe ukwakhiwa kabusha. Kuleli zinga kufana kakhulu nokugcina isimo sokuqamba nge remember kanye nezinto ezihlanganiswayo ezingavumelekile lapho amanani eshintsha.
Ukuze uthole izinhlelo zokusebenza eziyinkimbinkimbi, i-Flutter incike kakhulu emphakathini kanye namaphethini eqembu lokuqala: Provider, Riverpod, Bloc, Redux-style izitolo nokuningi. Lokhu kusebenza njengama-analogi ezitaki zakho ze-Android zokwakheka: ViewModel + LiveData/Flow + amakhosombe kumaphrojekthi Wokuqamba. Benza ingqondo yebhizinisi endaweni eyodwa futhi badalule ukusakazwa okusebenzayo kwedatha eshayela ukwakhiwa kabusha kwewijethi. Kusukela kungemuva lokuqamba, uzothola amaningi alawa maphethini ajwayelekile ngisho noma ama-API ehluka.
Iphuzu elilodwa elivamise ukumangaza onjiniyela be-Android ukuthi womabili amawijethi angenasimo nasezingeni eliphezulu ku-Flutter akha kabusha njalo—okungenzeka ukuthi wonke uhlaka ngesikhathi sokugqwayiza. Umehluko awukona mayelana nokwakha kabusha imvamisa kodwa mayelana nokuthi isimo esiguqulekayo sigcinwa kuphi: StatefulWidget ikunikeza umngane State into esindayo yakha kabusha, njengokuthi kanjani remember ivumela amanani ukuthi asinde ekwakhiweni kabusha kokuthi Bhala.
Ukudweba, ukugqwayiza nokupholisha okubonakalayo
Uma uke wasebenza ngqo ne-Android Canvas futhi Drawable, Bhala Canvas composable mhlawumbe wazizwa kuqondile. Ihlinzeka ngendlela echazayo yokudweba izimo, izithombe kanye nombhalo e-Kotlin, efihla imicimbi eminingi ebalulekile yemibono yangokwezifiso evamile.
I-Flutter iveza indawo yokudweba efanayo nge- Canvas I-API, ifinyelelwe nge CustomPaint futhi CustomPainter. Usebenzisa a CustomPainter ikilasi lapho ubhala ngaphezulu paint indlela yokudweba ku-canvas usebenzisa Paint izinto, izindlela, uguquko nokunye. Bese unamathisela lowo mdwebi ku-a CustomPaint iwijethi. Ngaphansi kwe-hood kokubili okuthi Qamba kanye ne-Flutter kuncike enjinini ye-Skia, ukuze okokuqala—imigqa, izindlela, imithunzi—kubukeke kujwayeleke kakhulu ekunikezelweni kwe-Android kwe-2D.
Ngokugqwayiza, i-Flutter incike kusistimu yokugqwayiza esobala eyakhelwe nxazonke AnimationController, Animation<T> kanye ne-Tweens, kanye nesethi ecebile yamawijethi apopayi. Uqinisekisa isilawuli (imvamisa nge SingleTickerProviderStateMixin ye-vsync), chaza i-CurvedAnimations noma i-Tweens ebeka imephu 0-1 inqubekela phambili ibe amanani esizinda, bese uwaxhuma kumawijethi afana FadeTransition, ScaleTransition, AnimatedBuilder noma amawijethi angacacile njenge AnimatedContainer. Uhlelo lokugqwayiza luphinde luveze AnimationStatus ukushaya emuva ukuze usabele ekuqaleni, ukuqedwa noma ukuhlehliswa.
Ama-API wopopayi we-Jetpack Compose ayamemezela ukusuka phezulu kuye phansi, ngemisebenzi efana nale animate*AsState, izinguquko, nokubonakala okugqwayizayo. Kunokuba uphathe izilawuli mathupha ezimweni ezivame kakhulu, uchaza izimo eziqondiwe futhi uhlaka luqhuba ukutolikwa ngokuhamba kwesikhathi. Uma udinga ukulawula okwengeziwe, usengakwazi ukufinyelela izinto zokuqala ezisezingeni eliphansi, kodwa indlela evamile imfushane kune-Android XML yakudala noma ikhodi yokugqwayiza ebalulekile.
Ngokomqondo, usebenzisa womabili amakhithi amathuluzi ngendlela efanayo: gcina amawijethi/okuhlanganisweyo angasindi futhi kumsulwa, amanani ashintshashintshayo isikhathi ngawo, futhi uvumele uhlaka ukuthi luphathe ukuhunyushwa kanye nokungavumelekile. Njengonjiniyela Wokubhala, ukucaciswa okwengeziwe kwe-Flutter's AnimationController ingase uzizwe uyisikole esidala ekuqaleni, kodwa sikuthengela ukulawula okuhle kakhulu kusikhathi, amajika nokucula.
Isitayela, itimu, amafonti namafa
Izinhlelo zokusebenza zesimanje ziphila noma ziyafa ngokupholisha, ngakho-ke kokubili i-Flutter ne-Compose igcizelela kakhulu itimu nesitayela. Ukubhala ukusetshenziswa MaterialTheme ngezikimu zombala, izincazelo zokuthayipha nezincazelo zomumo, futhi ungakwazi ukuhlanganisa amatimu ukuze ukhiphe amanani ezihlahla ezingaphansi—okuhlanganisa ukuphoqa ukukhanya noma izindawo ezimnyama ezifundeni ezithile.
Ku-Flutter, okulingana ngu ThemeData kudlulele ku MaterialApp or Theme amawijethi. Uchaza imibala eyinhloko, ukukhanya, ukuthayipha kanye nezindikimba ezithize njenge elevatedButtonTheme, textButtonTheme, appBarTheme futhi nokuningi. Ungakhipha amatimu endaweni ngokugoqa izihlahla ezingezansi Theme amawijethi akopisha umzali futhi alungise izinkambu ezithile. Imodi ekhanyayo nemnyama ingashintshwa kuleveli yohlelo lokusebenza ngokuhlinzeka theme futhi darkTheme nokulawula themeMode.
Isitayela sombhalo siyindawo ejwayelekile: kokuthi Qamba ungadlulisela izici ezilula ngqo kuzo Text noma unikeze a TextStyle into. I-Flutter ikhombisa lokhu nge-a Text iwijethi eyamukela a TextStyle nge yayo style ipharamitha. TextStyle ihlanganisa umndeni wefonti, usayizi, isisindo, isikhala sezinhlamvu, ubude bomugqa, umhlobiso nokunye. Ungachaza izingqikithi zombhalo zomhlaba wonke ThemeData.textTheme futhi uwabhekise yonke indawo, njengoba nje ungasebenzisa ukuthayipha kwakho MaterialTheme kokuthi Bhala.
Amafonti nezithombe zisingathwa ngamafa esikhundleni sendabuko ye-Android /res isihlahla somkhombandlela. I-Flutter ayisebenzisi ukwakheka kwefolda ethile; umemezela amafa pubspec.yaml bese uwabhekisela kukhodi. Izithombe ngokuvamile zilayishwa nge Image.asset(), exazulula ibhakede elilungile lokuminyana ngokusekelwe devicePixelRatio. Amaphikseli anengqondo adlala indima efanayo ne dp ku-Android, ukukhipha ukuminyana kwephikseli ebonakalayo kude.
Kumafonti angokwezifiso, Ukuqamba kukuvumela ukuthi uhlanganise izinsiza zefonti noma uzidonse ngesikhathi sokusebenza usebenzisa abahlinzeki abafana namafonti e-Google, bese uwaxhuma ngentambo FontFamily kanye ne-typography. I-Flutter isebenzisa cishe iphethini efanayo: beka amafayela efonti kufolda yamafa, uwafake ohlwini pubspec.yaml, bese ubhekisela emndenini wefonti ngegama TextStyle. Uma ufuna amafonti alandwe isikhathi sokusebenza, kukhona adumile google_fonts i-plugin edalula imisebenzi ye-Dart eqanjwe ngamafonti—isb GoogleFonts.robotoTextTheme()-ukuzihlanganisa ngokushesha endikimbeni yakho.
Womabili ama-ecosystem aphatha iyunithi yezinhlamvu nokwenza okwasendaweni njengokukhathazeka kwesigaba sokuqala, nakuba i-Flutter ingenakho okulingana okuqondile nezinsiza zeyunithi yezinhlamvu ze-XML ze-Android. Kunalokho, umkhuba ongcono kakhulu ukugcina ukuhumusha kungaphakathi .arb amafayela futhi uwaxhume ngentambo yamathuluzi e-Flutter. Ukufinyelela-ke kwenzeka ngamakilasi e-Dart akhiqiziwe, acishe afane nokusetshenziswa R.string izihlonzi kukhodi ye-Android.
Imiqondo yesikhulumi se-Android ngelensi ye-Flutter
Ngale kwe-UI, omunye wemibuzo emikhulu onjiniyela Abanayo ukuthi ulwazi lwabo lwe-Android lufana kanjani ne-architecture ye-Flutter. Ngenhlanhla, imibono eminingi eyinhloko-imisebenzi, umjikelezo wempilo, izinhloso, umsebenzi wangemuva, izinsiza, inethiwekhi-inobalingani abacacile, ngisho noma i-API engaphezulu ibonakala ihlukile.
Ku-Android, Activity futhi Fragment yizikrini zakho eziyinhloko neziqukathi; ku-Flutter yonke into iyiwijethi, futhi ukuzulazula kwenzeka nge Navigator futhi Route izinto. Umzila ucishe ufane nomsebenzi noma ucezu, kodwa ngokuvamile kuba khona usokhaya oyedwa Activity ku-Android eshumeka injini ye-Flutter. Uphusha futhi uphume imizila kusitaki se-Navigator, ngokusebenzisa imizila eshiwo igama echazwe kuyo MaterialApp noma nge eyakhelwe ngqo PageRoute izimo ezifana MaterialPageRoute.
Izingcingo ze-Android zomjikelezo wempilo (onCreate, onStart, onResume, njll.) anginawo amahhuku okukodwa kukhodi ye-Flutter, kodwa ungakwazi ukubuka umjikelezo wempilo wohlelo lokusebenza nge WidgetsBindingObserver. Idalula izifundazwe ezifana resumed, inactive, paused futhi detached, okuhambelana cishe nezigaba ezibonakalayo, zangemuva nezicekeleke phansi ze-Android. Uma udinga ngempela amahhuku omjikelezo wempilo wezinga eliphansi ukuze uphathe insiza, uvamise ukuwasebenzisa ohlangothini lwendabuko lwe-Android FlutterActivity noma i-plugin, hhayi ku-Dart.
Izinhloso zidlala izindima ezimbili ku-Android: ukuzulazula kwangaphakathi nohlelo nokuxhumana phakathi nohlelo. Njengoba kushiwo, i-Flutter ayinayo i-API yokuzulazula esekelwe kunhloso—I-Navigator ingena esikhundleni saleyo ngaphakathi emhlabeni we-Dart. Ngemisebenzi enqamula izinhlelo zokusebenza (yethula ikhamera, isikhi samafayela, izinhloso zokuphatha zokwabelana), ngokuvamile usebenzisa ama-plugin avala izingcingo ezidingekayo ze-Android (ne-iOS). Uma ingekho i-plugin, ungazibhalela eyakho usebenzisa i-MethodChannels ukuze ukhulume phakathi kwe-Dart nekhodi yomdabu, ukudlulisela phambili izinhloso nemiphumela njengemilayezo.
Ukuqonda kwakho umsebenzi wangemuva nokuhlanganisa nakho kuyadlulisa, kodwa okwakudala kubukeka kuhlukile. I-Android ikuphusha ukuthi uhambise inethiwekhi nediski I/O entanjeni enkulu usebenzisa ama-coroutines, i-AsyncTask (ifa), i-WorkManager, i-JobScheduler, i-RxJava njalonjalo. I-Dart, ngokuphambene, isebenzisa iluphu yomcimbi onomucu owodwa ngokuhlukaniswa ngakunye, ene-async/okulindwe i-I/O kanye nezihlukanisi ezihlukene zomsebenzi osindayo we-CPU. Kunoma yini engiyiboshiwe/O, vele umake imisebenzi yakho async, await ukusebenza futhi uvumele iluphu yomcimbi igcine i-UI isabela; ngemisebenzi ye-CPU esindayo uhlanganisa i-isolate futhi uxhumane ngokudlulisa umyalezo esikhundleni sememori eyabiwe.
Ngaphambili kwenethiwekhi, uFlutter udumile http iphakheji idlala indima efana ne-OkHttp + Retrofit ngamakesi okusetshenziswa ayisisekelo. Ifihla umsebenzi omningi wesokhethi yezinga eliphansi futhi ihlanganisa ngokwemvelo ne-async/ait. Ngezidingo eziyinkimbinkimbi ungakhuphukela kumaphakheji afana dio, kodwa iphethini eyisisekelo isala: yenza ikholi engavumelanisi, linda umphumela, buyekeza isimo nge setState() noma umphathi wesifunda sakho osikhethile, futhi wakhe kabusha amawijethi athintekile.
Ama-plugin, isitoreji, i-Firebase kanye namathuluzi
Ku-Android ujwayele ukumemezela ukuncika ku-Gradle; ku-Flutter uyabamemezela pubspec.yaml futhi uwalande ku-pub.dev. Amafayela e-Gradle ngaphansi kwe- android/ ifolda yephrojekthi ye-Flutter eyokuhlanganiswa okukhethekile kwenkundla noma uma udinga amalabhulali endabuko angokwezifiso—ukuthuthukiswa kohlelo lokusebenza kuhlala ku-Dart land.
Okuthandwayo okwabiwe kanye ne-SQLite nakho kunokufana osekulungele. Lapho i-Android inikeza khona SharedPreferences ukuze uthole isitoreji senani likakhiye omncane kanye ne-SQLite (noma Igumbi) ledatha ehlelekile, i-Flutter isonga lezi ngama-plugin afana shared_preferences futhi sqflite. Lawa ma-plugin ahlanganisa ukuziphatha kwe-Android ne-iOS ukuze ukwazi ukusebenzisa i-Dart API eyodwa kungakhathaliseki inkundla, kuyilapho usathembele ekusetshenzisweni komdabu okuyisisekelo.
Ukuhlanganiswa kwe-Firebase kuqondile ngokufanayo futhi kusezingeni lokuqala. Amasevisi amaningi e-Firebase—Ukuqinisekisa, i-Firestore, Isizindalwazi Sesikhathi Sangempela, Imilayezo Yefu, Izibalo, I-Remote Config nokunye—anama-plugin e-Flutter asemthethweni anakekelwa yiqembu le-Firebase ne-Flutter. Bafana nemodeli yomqondo evela kuma-Firebase SDK we-Android kodwa ngama-API we-Dart-idiomatic. Ukuze uthole ezinye izici ze-Firebase ze-niche ezingamboziwe ngokuqondile, kune-ecosystem enempilo yama-plugin enkampani yangaphandle ku-pub.dev.
Ukuze ulungise iphutha kanye nokwenza iphrofayela, suite ye-Flutter's DevTools ikunikeza ibhokisi lamathuluzi elicebile eliqhathaniseka ngokuqondile nephrofayili ye-Android Studio kanye nomhloli wesakhiwo. Ungahlola isihlahla sewijethi, ulandelele ukwakhiwa kabusha, ubuke ukwabiwa kwenkumbulo, uhlole ukuvuza nokuhlukana, bese udlulela kukhodi ye-Dart. Kuhlanganiswe nokusekelwa kwe-IDE ku-Android Studio ne-VS Code, ukulayisha kabusha okushisayo kanye nokuqalisa kabusha okushisayo, umjikelezo wempendulo ekuthuthukisweni kwe-Flutter uzizwa uqinile okungenani—futhi ngokuvamile uqina—kunalokho ojwayele ukukwenza ngokuthi Bhala.
Izaziso zohlelo lokusebenza, okunye ukukhathazeka okuvamile kwe-Android, kusingathwa ku-Flutter ngama-plugin afana firebase_messaging. Ngaphansi kwe-hood laba bakhuluma ne-Firebase Cloud Messaging kanye nezinhlaka zezaziso zomdabu ku-Android ne-iOS, kodwa ingqondo yohlelo lwakho lokusebenza ihlala ku-Dart API ehlangene. Ukucushwa nokuziphatha okuqondene nenkundla ethile (njengeziteshi zezaziso ku-Android) kusabalulekile, futhi ukuzizwisa kwakho okukhona ngaleyo mininingwane yeplathifomu kuyaqhubeka kuhambisana kakhulu.
Ngisho namawijethi esikrini sasekhaya ku-Android, angakwazi ukusetshenziswa ku-Flutter kuphela, asengahlanganiswa nekhodi ye-Flutter. Ngokuvamile uwakha nge-Jetpack Glance noma izakhiwo ze-XML bese usebenzisa iphakheji efana ne home_widget ukuze uxhumane nohlelo lwakho lokusebenza lwe-Flutter, wabelane ngedatha futhi ushumeke i-Flutter UI e-rasterized njengesithombe ngaphakathi kwewijethi yomdabu. Leyo ndlela ye-hybrid ikuvumela ukuthi ugcine ulwazi lwakho oluyinhloko ku-Flutter kuyilapho uhlonipha imingcele yesikhulumi.
Uma ubheka kukho konke lokhu kufana, unjiniyela we-Jetpack Compose ongena ku-Flutter akaqali ukusuka kuziro nhlobo. Ukuqonda kwakho i-UI ememezelayo, umjikelezo wempilo we-Android, ukuzulazula, izwe, izinsiza kanye namamephu okusebenza async ngokwemvelo emhlabeni we-Flutter; lokho okushintsha kakhulu amagama, ulimi (Dart), kanye ne-multi-platform mindset. Uma usufake amawijethi ngaphakathi kanye ne-Navigator njengemiqondo eyisisekelo, sonke isitaki sivame ukuchofoza endaweni ngokushesha okukhulu.
