KMPからPlarformコードを使いたい！

Transcript

1. ©2025 Kyash Inc. ©2025 Kyash Inc. KMPか Platformコードを使いたい！ 関西モバイルアプリ研究会A #7 2025/1/28 nitakan(KATO Masanori)
2. ©2025 Kyash Inc. 自己紹介 object Nitakan { val id = "nitakan" val name = "KATO Masanori" val company = "Kyash Inc." val xAccount = "@nitakanworld" val githubAccount = "@nitakan" }
3. ©2025 Kyash Inc. はじめに 質問： KMP(Kotlin Multiplatform) を使っていますか󰢧
4. ©2025 Kyash Inc. はじめに 🙆 KMPか Platformで実装したコードを利用す 方法 今日話したいこと
5. ©2025 Kyash Inc. はじめに 🙆 KMPか Platformで実装したコードを利用す 方法 今日話したいこと 既存コードも活用してKMPをやってこうぜ！！！
6. ©2025 Kyash Inc. はじめに 🙅 KMPの説明・導入 🙅 DI(Koin/swift-dependencies)について 🙅 KMP/Platformのアーキテクチャ 🙅 エラーハンドリング 🙅 Swift UI / Composeの実装 今日話さないこと
7. ©2025 Kyash Inc. “ ” KMPか Android/iOSの既存コードを呼び出したい！
8. ©2025 Kyash Inc. KMP→Platformコードの呼び出し • Android/iOSで処理を変えたい • KMP用のライブラリが提供さ ていない（Platform用のライ ブラリを使いたい） • 既存のコードを活用したい • etc… たとえば
9. ©2025 Kyash Inc. KMP→Platformコードの呼び出し • expect/actual ◦ KMPでexpect(interfaceみたいなもの)を定義し、各 Platform向けのactualを実装をす • インターフェース + 依存性注入(DI) ◦ KMPでインターフェースを定義し、各Platform上で実装 す どんな 手段があ のか
10. ©2025 Kyash Inc. KMP→Platformコードの呼び出し expect/actual
11. ©2025 Kyash Inc. KMP→Platformコードの呼び出し インターフェース + 依存性注入(DI)
12. ©2025 Kyash Inc. • expect/actual • インターフェース + 依存性注入 KMP→Platformコードの呼び出し こっちの話をします
13. ©2025 Kyash Inc. KMP→Platformコードの呼び出し interface PlatformRepository { fun getDataSync(): PlatformData // ← 通常の関数 suspend fun getDataAsync(): PlatformData // ← suspend関数 } interface PlatformRepositoryFactory { fun createClientRepository(): PlatformRepository } Kotlin Native側でRepositoryインターフェースを実装
14. ©2025 Kyash Inc. KMP→Platformコードの呼び出し class DisplayDataViewModel( private val kmpRepository: KmpRepository, private val platformRepository: PlatformRepository, ) : ViewModel() { private val _displayData = MutableStateFlow<DisplayData>(DisplayData.loading()) @NativeCoroutinesState val displayData: StateFlow<DisplayData> = _displayData.asStateFlow() init { viewModelScope.launch { loadData() } } suspend fun loadData() { _displayData.emit(DisplayData.Loading) delay(1000) val platformSyncData = platformRepository.getDataSync() val kmp = kmpRepository.getKmpData() _displayData.emit(DisplayData.Loaded(platformSyncData, kmp)) val platformAyncData = platformRepository.getDataAsync() _displayData.emit(DisplayData.Loaded(platformAsyncData, kmp)) } } Kotlin Native側でViewModel実装
15. ©2025 Kyash Inc. KMP→Platformコードの呼び出し class PlatformRepositoryImpl: PlatformRepository { override fun getDataSync(): PlatformData { return PlatformData("[Android]The client generated sync data") } override suspend fun getDataAsync(): PlatformData { delay(1000L) return PlatformData("[Android]The client generated async data") } } Android側のRepository実装
16. ©2025 Kyash Inc. KMP→Platformコードの呼び出し class MainApp : Application() { override fun onCreate() { super.onCreate() initKoin( listOf( module { factory<PlatformRepository> { PlatformRepositoryImpl() } factory<PlatformRepositoryFactory> { PlatformRepositoryFactoryImpl(get()) } factory { DisplayDataViewModel(get(), get()) } } ) ) } } AndroidでViewModel生成時にRepositoryを渡す
17. ©2025 Kyash Inc. KMP→Platformコードの呼び出し @Composable fun ListScreen() { val viewModel: DisplayDataViewModel = koinViewModel() val objects by viewModel.displayData.collectAsStateWithLifecycle(DisplayData.loading()) val coroutine = rememberCoroutineScope() Content( item = objects, onLoad = { coroutine.launch { viewModel.loadData() } }, ) } AndroidでViewModelを利用す
18. ©2025 Kyash Inc. KMP→Platformコードの呼び出し import Shared class PlatformRepositoryImpl {} extension PlatformRepositoryImpl: PlatformRepository { func getDataSync() -> PlatformData { // ← 通常の関数の実装 PlatformData(value: "[iOS]The client generated sync data") } func getDataAsync() async throws -> PlatformData { // ← suspend関数の実装 _ = try await Task.sleep(nanoseconds: 1000_000_000) return PlatformData(value: "[iOS]The client generated async data") } } iOS側のRepository実装(Swift Concurrency)
19. ©2025 Kyash Inc. KMP→Platformコードの呼び出し struct MainView: View { @Dependency(\.platformRepositoryFactory) var repositoryFactory: PlatformRepositoryFactory var body: some View { DisplayView(platformRepository: repositoryFactory.createPlatformRepository()) } } struct DisplayView: View { var viewModel: DisplayDataViewModel init(platformRepository: PlatformRepository) { viewModel = DisplayDataViewModel( kmpRepository: KmpRepositoryImpl(), platformRepository: platformRepository ) } } iOSでViewModel生成時にRepositoryを渡す
20. ©2025 Kyash Inc. KMP→Platformコードの呼び出し struct DisplayView: View { @State private var displayData: DisplayData = DisplayData.Loading() var viewModel: DisplayDataViewModel init(platformRepository: PlatformRepository) { … } var body: some View { VStack(alignment: .center, spacing: 4) { switch (displayData) { case is DisplayData.Loading: Text("Loading...") … } } .task { do { for try await newValue in asyncSequence(for: viewModel.displayDataFlow) { self.displayData = newValue } } catch { print("Error collecting flow: \(error)") } } } } iOSでViewModelをUIで利用す
21. ©2025 Kyash Inc. iOS KMP→Platform固有コードの呼び出し Android
22. ©2025 Kyash Inc. おわ に Platform固有コードを呼び出す方法には大きく分けて2つのアプローチがあ • expect/actual を使った Kotlin言語上での切 分け • インターフェース＋依存性注入(DI) を用いて、 Platform側の言語で実装 したコードをKMPへ 渡す方法 そ ぞ の使いどこ とメリット・デメリットを理解して、KMPライフを楽しみましょう 🍻🍻 まとめ
23. ©2025 Kyash Inc. おわ に https://github.com/nitakan/kotlin-multiplatform-sandbox サンプルコード
24. ©2025 Kyash Inc. ©2025 Kyash Inc. Thank you for listening🎉
25. ©2025 Kyash Inc. • Expected and actual declarations | Kotlin Multiplatform • Connect to platform-specific APIs | Kotlin Documentation • KMP-App-Template | GitHub Appendix