KMM StarWars is a multiplatform version of Compose StarWars which demonstrates the aspects of Kotlin Multiplatform Mobile. The core business logic is written once, only the UI is built using native UI tools on both platforms. Android uses Jetpack Compose and iOS uses SwiftUI for design.
Well, the idea is fairly simple - we are using an open source API from https://swapi.dev/ to load the list of StarWars universe characters. We don't load all characters at once, so we use the concept of pagination to load more data when scrolled to bottom.
KMMStarWars.mp4
There are different layers of a KMM project: Native and Shared. Shared layer is built with the help of popular tools/SDKs with the support of KMM.
| Tool/SDK | Usage |
|---|---|
| Ktor Client | Networking (calling the API) |
| Kodein | Dependency injection |
| Multiplatform Paging | Loading the list with pagination |
Ktor Client on Shared layer internally delegates to native specific networking mechanisms. In our case, OkHttp for Android and Darwin for iOS. Multiplatform Paging acts as a shared pagination logic, it delegates to AndroidX Paging on Android.
| Tool/SDK | Usage |
|---|---|
| Jetpack Compose with Material 3 | UI design |
| Coil | Loading network images |
| Lottie | Animated loading indicator |
| Paging Runtime Compose | Loading the list with pagination |
| Tool/SDK | Usage |
|---|---|
| SwiftUI | UI design |
| AsyncImage for SwiftUI | Loading network images |
| Lottie with SwiftUI | Animated loading indicator |
| Multiplatform Paging with SwiftUI | Loading the list with pagination |
Visit Releases where you'll find APK for android and .app file for iOS which can run on iOS simulator (not on physical device).