Collegare il ViewModel a ogni interfaccia
Collegare lo stato condiviso a Compose e SwiftUI
Collegare il ViewModel a ogni interfaccia è una lezione Kotlin Multiplatform Academy gratuita su CoddyKit. Questa è la lezione 4 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento Kotlin Multiplatform Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso Kotlin Multiplatform Academy include 4 lezioni in totale.
L'ultimo passaggio
Il Suo ViewModel condiviso è pronto. Ora ogni interfaccia nativa deve solo osservare il suo stato e inoltrare gli intent dell'utente. Questo è l'ultimo collegamento.
Compose raccoglie lo stato
Su Android, usi collectAsState per trasformare lo StateFlow in stato Compose. Ogni emissione ricompone automaticamente la schermata.
val state by viewModel.state.collectAsState()Disegni a partire da quello stato
Il Suo composable legge lo state raccolto e lo visualizza. L'interfaccia è ora una funzione pura dell'output del ViewModel condiviso.
Text(state.name)
if (state.isLoading) CircularProgressIndicator()Invii gli intent da Compose
Colleghi un pulsante a onIntent. L'utente tocca, Compose inoltra l'azione e il ViewModel condiviso decide cosa fare.
Button(onClick = {
viewModel.onIntent(HomeIntent.Refresh)
}) { Text("Refresh") }iOS ha bisogno di un bridge
SwiftUI non può raccogliere direttamente un Kotlin Flow. Un piccolo observable wrapper collega StateFlow a qualcosa che SwiftUI può osservare.
Un wrapper ObservableObject
Avvolga il ViewModel in un ObservableObject Swift. Contiene una copia pubblicata dello stato e fornisce gli aggiornamenti a SwiftUI.
class HomeObservable: ObservableObject {
@Published var state = HomeState(isLoading: false, name: "")
}Raccolga il Flow in Swift
All'interno del wrapper, raccolga lo StateFlow Kotlin e assegni ogni valore alla proprietà pubblicata. Anche SkieKit può generare questo codice.
Esegua il rendering in SwiftUI
La vista SwiftUI osserva il wrapper e legge lo state nello stesso modo. Un'unica verità condivisa, visualizzata nello stile nativo di Apple.
Text(observable.state.name)Invii gli intent da Swift
Anche i pulsanti in SwiftUI chiamano l'onIntent del ViewModel contenuto nel wrapper, così i tocchi su iOS confluiscono nella stessa identica logica condivisa.
Button("Refresh") {
observable.viewModel.onIntent(intent: .refresh)
}Esegua la pulizia alla scomparsa
Quando una schermata si chiude, chiami clear() del ViewModel dal ciclo di vita di ciascuna piattaforma, così lo scope viene annullato e non si verificano perdite.
Lo stesso cervello, due volti
Ora entrambe le app condividono un unico ViewModel: stesso stato, stesse decisioni; cambia solo il rendering. Questo è KMP al meglio. 🎉
Verifica rapida
Verifichiamo come SwiftUI utilizza uno StateFlow condiviso.
Riepilogo
Compose usa collectAsState; SwiftUI usa un wrapper ObservableObject. Entrambi osservano lo stato e inviano gli intent a un unico ViewModel condiviso. 🚀
Impara Kotlin con un tutor IA — gratis
Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.
- Corsi
- 30
- Lezioni
- 120
Domande Frequenti
La lezione «Collegare il ViewModel a ogni interfaccia» è gratuita?
Sì — il testo completo di «Collegare il ViewModel a ogni interfaccia» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso Kotlin Multiplatform Academy, passa a CoddyKit PRO. Il corso Kotlin Multiplatform Academy include 4 lezioni in totale.
Cosa imparerò in «Collegare il ViewModel a ogni interfaccia»?
Collegare lo stato condiviso a Compose e SwiftUI Eserciti Kotlin Multiplatform Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare Kotlin Multiplatform Academy?
Non è richiesta alcuna esperienza precedente. Kotlin Multiplatform Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 4 di 4.
Quanto tempo richiede la lezione «Collegare il ViewModel a ogni interfaccia»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione Kotlin Multiplatform Academy?
Sì. Ogni lezione Kotlin Multiplatform Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Una base ViewModel multipiattaforma
- Esporre lo stato dell'interfaccia come StateFlow
- Gestire intenti e azioni dell'utente
- Collegare il ViewModel a ogni interfaccia