以 Kotlin Multiplatform Mobile (KMM) 開發跨平台行動應用
2 likes1,406 views
本文件讨论了Kotlin Multiplatform Mobile（KMM）的基本构架和应用，包括如何在Android和iOS平台上共享代码。文档中涵盖了密码生成器的实现以及如何使用Ktor进行API调用。还介绍了KMM的不同配置选项和库的集成，以支持跨平台开发。
以 Kotlin Multiplatform Mobile (KMM) 開發跨平台行動應用
- 1. KMM (Shengyou Fan) JCConf Taiwan 2021 2021/11/19 Photo by Arnel Hasanovic on Unsplash
- 3. Kotlin — • General-purpose • Static typing • OOP + FP • Developed by JetBrains • Open Source (Apache 2.0) https://kotlinlang.org/
- 5. —
- 7. KMM —
- 9. —
- 10. KMM opt.1 — Android iOS Android Studio Xcode KMM plugin Simulator AVD
- 11. KMM opt.2 — Android iOS AppCode KMM plugin For AppCode Simulator AVD +
- 12. KMM Plugin —
- 13. KMM (Step 1) —
- 14. KMM (Step 2) —
- 15. KMM (Step 3) —
- 16. KMM (Step 4) —
- 17. — • androidApp • iosApp • shared - commonMain - androidMain - iosMain
- 18. • - • API - • Multiplatform - HTTP API —
- 19. —
- 20. pt.1 ( ) — class PasswordGenerator { private val chars = ... fun generate(length: Int): String { // ... } }
- 21. pt.2 (Android ) — class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { // ... val passwordTextView: TextView = findViewById(...) val generateButton: Button = findViewById(...) generateButton.setOnClickListener { passwordTextView.text = PasswordGenerator() .generate(7) } } }
- 22. pt.3 (iOS ) — struct ContentView: View { @State private var passwordText = "!" var body: some View { Text(passwordText) Button(action: { passwordText = PasswordGenerator() .generate(length: 10) }) { Text(" ") } } }
- 23. —
- 24. pt.1 (expect ) — // shared class class Detector { fun detect(): String { return Platform().platform } } // expect expect class Platform() { val platform: String }
- 25. pt.2 (actual ) — // androidMain actual class Platform actual constructor() { actual val platform: String = "Android version" + android.os.Build.VERSION.SDK_INT } // iosMain actual class Platform actual constructor() { actual val platform: String = UIDevice.currentDevice.systemName() + " version " + UIDevice.currentDevice.systemVersion }
- 26. pt.3 (Android ) — class MainActivity : AppCompatActivity() { override fun onCreate(savedInstanceState: Bundle?) { // ... val messageTextView: TextView = findViewById(…) messageTextView.text = Detector().detect() } }
- 27. pt.4 (iOS ) — struct ContentView: View { @State private var messageText = Detector().detect() var body: some View { Text(messageText) .font(.subheadline) .foregroundColor(messageTextColor) } }
- 28. API —
- 29. — Mobile API Server (KMM + Ktor Client) (Ktor Server)
- 30. API pt.1 ( ) — kotlin { // ... sourceSets { val commonMain by getting { dependencies { // Ktor implementation("io.ktor:ktor-client-core:$ktorVersion") implementation("io.ktor:ktor-client-serialization:$ktorVersion") // Serialization implementation("org.jetbrains.kotlinx:kotlinx-serialization-core:$ver") } } val androidMain by getting { dependencies { implementation("io.ktor:ktor-client-android:$ktorVersion") } } val iosMain by getting { dependencies { implementation("io.ktor:ktor-client-ios:$ktorVersion") } } } } 1. Ktor Client 2. kotlinx.serialization
- 31. // shared expect fun httpClient(config: HttpClientConfig<*>.() -> Unit): HttpClient // androidMain actual fun httpClient(config: HttpClientConfig<*>.() -> Unit) = HttpClient(Android) { config(this) engine { connectTimeout = 100_000 socketTimeout = 100_000 } } // iosMain actual fun httpClient(config: HttpClientConfig<*>.() -> Unit) = HttpClient(Ios) { config(this) engine { configureRequest { setAllowsCellularAccess(true) } } } API pt.2 (expect / actual ) —
- 32. @Serializable data class InspectRequest( val password: String ) @Serializable data class InspectResponse( val result: Boolean, val message: String ) API pt.4 (DTO ) —
- 33. class Validator { private val httpClient = httpClient { install(JsonFeature) { serializer = KotlinxSerializer() } } suspend fun inspect(password: String): InspectResponse { return httpClient.post("...") { accept(ContentType.Application.Json) contentType(ContentType.Application.Json) body = InspectRequest(password) } } } API pt.3 ( ) —
- 34. class MainActivity : AppCompatActivity() { private val validator = Validator() private val mainScope = MainScope() val inspectButton: Button = findViewById(...) inspectButton.setOnClickListener { mainScope.launch { kotlin.runCatching { validator.inspect(...) }.onSuccess { messageTextView.text = it.message } } } } API pt.5 (Android ) —
- 35. struct HttpClientView: View { let validator = Validator() func validate() { validator.inspect(password: pw) { response, error in if let response = response { self.messageText = response.message } else if let error = error { self.messageText = "Error: (error)" } } } var body: some View { Button(action: { validate() }) { // ... } } } API pt.6 (iOS ) —
- 37. • KMM - UI - UI - - expect/actual - - - Multiplatform - KMM —
- 38. • Ktor (HTTP Client) • kotlinx.serialization • kotlinx.coroutines • kotlinx.atomicfu • SQLDelight • KaMP Kit • moko libraries KMM —