Platform UI
- Kotlin kursu
- Uzman
- Ders 35/47
- 5 dk
Compose ile platform UI (Desktop, Web) öğrenirsin.
Platform UI
Compose MP, her hedefe özgü bir giriş noktası sunar. Desktop'ta Window, Web'de CanvasBasedWindow, Android'de setContent, iOS'ta ComposeUIViewController.
Paylaşılan @Composable fonksiyonlar bu giriş noktalarından çağrılır. Örnek Desktop: fun main() = application { Window { App() } }. Aynı App() composable'ı Web'de de çağrılabilir. Bu, tek UI kod tabanı ve platforma özgü pencere yönetimi sağlar. Bu dersteki platformUiInfo modeli konsepti gösterir.
Web ve iOS hedefleri
Web hedefi CanvasBasedWindow ile Compose UI'yi bir canvas üzerine çizer. iOS hedefi ComposeUIViewController ile composable'ı bir UIKit controller'a sarar.
Her iki hedef de aynı paylaşılan composable'ları çağırır. Web'de tarayıcı canvas'ı, iOS'ta UIKit view'i kullanılır. Bu, tek UI kod tabanının gücünü gösterir: bir kez yaz, dört platformda çalış. Performans platforma göre ayarlanır.
Uygulama platformUiInfo yaz
fun platformUiInfo(): String tanımla. "Desktop/Web" döndürsün. main içinde println(platformUiInfo()) yaz.
Başlangıç kodu
// platformUiInfo fonksiyonunu ekle
fun main() {
// platform UI bilgisini yazdır
}Örnek çözüm
fun platformUiInfo(): String = "Desktop/Web"
fun main() {
println(platformUiInfo())
}Beklenen çıktı
Desktop/Web
Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Desktop main satırını tamamla
fun main() = application { Window { ____ } }fun main() = application { Window { App() } }Açıklama: App() composable'ı Window içine yerleşir.
2 Desktop Compose hangi pencere API kullanır?
The Desktop window name is Window.- Window Doğru cevap
- Activity
- BrowserWindow
- Frame
Açıklama: Desktop Compose Window API ile pencere açar.
3 Platform UI parçalarını eşle
| Kavram | Anlamı |
|---|---|
Window |
Desktop |
CanvasBasedWindow |
Web |
setContent |
Android |
ComposeUIViewController |
iOS |