Kotlin Multiplatform for mobile — it works!

This post may seem quite silly, but a few days ago I completed my first full-fledged cross-platform application using Kotlin Multiplatform technology (for mobile devices — Android & iOs). And it really works! I can’t say I’m extremely surprised, the result was expectable and yet…

The application is quite a regular one. It contains a set of cards with English phrasal verbs translated to Russian. I hope it can help Russian native speakers (like me) to drill this tricky topic.

I used Compose Multiplatform for my UI, Koin for dependency injections, Sqldelight for data storage support (normalized relational and key-value) and moko-resources library for working with resources (images and strings).

I do realize that my app is quite simple and typical; it has got none deep platform features. Even so, I managed to share 99% of its code between platforms — it is an undeniable success!

During the development, I had to solve some challenges:

1) View models are quite a convenient way to store a state of your view. I like to use them in my apps and I managed to simulate their behaviour in a cross-platform world using Koin scopes.

2) During the development of the application, I created my own simple navigation system based on the switching of the states of Compose.

3) Besides navigation, I made simple animated transitions between screens.

4) To create custom groups of cards with phrasal verbs, I used the Drag&Drop technique as the easiest and most visual way to populate one list of items based on another list of items.

5) Popup messages (aka Toasts in the Android world) most likely the most convenient way to show a simple message to a user. Compose Multiplatform hasn’t got such elements, and I had to develop them by myself.

6) We all worked with LazyColumn in Compose, but what if you need to show an infinite looped list of items instead of a regular one? I had to solve this challenge as well.

7) Each of the card contains two sides — an English and a Russian one. A user can switch the sides by tapping the card. Instant switching is too dull, from my humble opinion, so I added a flipping animation to the switching.

8) Compose Multiplatform hasn’t got Alert Dialogs from the box, so I had to create them.

The application source code can be found here.