Releasing my First True Kotlin Multiplatform App
I built “OctoMeter”, a fully functional Kotlin Multiplatform app, from scratch in just a month. By sharing the UI and business logic, my app now runs on desktop, Android, and iOS.
Why Kotlin Multiplatform
My reason might be different from others. I like building desktop apps easily by applying my Android and Kotlin skills.
I built my first desktop app using Visual Basic in 1996 and later used Java Swing and Visual C++ at school and work. The experience was not pleasant at all.
I built “GMap2iCal,” my first Compose Desktop app, 2.5 years ago, and I am still maintaining it on GitHub. In the absence of libraries, tools, and tutorials, it was not a very good experience getting things done.
Last year, JetBrains combined Kotlin Multiplatform Mobile with desktop, server, and web, collectively calling them Kotlin Multiplatform. Since then, things have accelerated quickly. With Google extending their support of Jetpack libraries to Kotlin Multiplatform, it further lowers the bar to transfer our Android Kotlin/Jetpack Compose knowledge to reach more platforms.
Introducing OctoMeter, a Multi-platform App for Octopus Energy Smart Meter Users in the UK (that is, me)
When I formed RW Android Labs in 2010, I strongly believed we developers should treat ourselves better. Rather than brainstorming nonexisting problems others need us to solve, I believe we should first solve our problems by applying our coding skills as a priority. That is why I always build software for myself to solve my problems. This way, I know my work will always have at least one satisfied user and solve real-world problems.
Recently, I moved to South-East England and found I am paying 400% more for electricity at my new apartment than three years ago. This is a real problem for me to solve.
As I inherited the previous tenant’s energy supplier, I accidentally discovered Octopus Energy provides developer API access to my smart meter consumption data and their Agile tariff unit rates. I believe Kotlin Multiplatform is a good choice for me to code-once, allowing me to have a dashboard app running on my laptop and mobile to track my electricity consumption and evaluate if I could save more money by switching to their Agile tariff.
That is why I decided to write this app last month.
I Coded an Android App, with Minimal Platform Dependent Configurations, and Now I Have Three Fully-Working Apps in One Month
My OctoMeter app helps me:
- Compile smart meter electricity usage; estimate and project electricity usage and cost.
- Track the Agile Octopus tariff unit rates for the coming 24 hours with countdown and automatic refresh.
- Browse available Octopus Energy tariffs.
In the OctoMeter app, I enjoy representing data in colour and automatically refreshing to remind me of the tariff unit rate. I can also include essential projections for budgeting and forecasting. This is the luxury of being a developer who can code.
Shoutout to the Creator of WindowSizeClass 👏
As I mentioned above, I coded Kotlin Multiplatform in an Android Developer way. Just like buying a Ryanair ticket, I insisted on investing the minimum extra effort for maximum gain. I did my usual coding in Android Studio, but now under the /composeApp/src/commonMain folder instead of the original /app/src/main, and I swapped some Java-based libraries with Kotlin Multiplatform ones. Other than that, I kept all those SOLID, Clean Architecture, MVVM, and unit testing practices unchanged.
If you follow me on Medium, you might have read my previous article about the Material 3 Window Size Class. This is a true enabler for building multi-platform apps, especially when it is more than just Android and iOS.
💡 During Google I/O 2024, the Android Team introduced the enhanced adaptive library, which I hope will one day support Kotlin Multiplatform. In this project, I had to simulate certain layout features provided by that library, as they are not ready for KMP yet.
Basically, if we can build a desktop app that scales properly when the window size changes arbitrarily, we can expect it to work on Android and iOS, phones and tablets, in portrait and landscape modes.
The concept of WindowSizeClass is a simple yet effective solution to handle multiple screen factors. If you are an Android developer, you know how complicated it is to cater to the landscape layout. By considering layouts for three different screen widths and heights, I found a similar feeling to building a responsive website using WordPress. Jetpack Compose also makes things much easier when we have to swap screen components.
💡 That is why I primarily built the app for desktop UI first, knowing that once I get the desktop layout right, it should scale reasonably well on mobile and tablets.
A True Complete Production-Ready App to Share with You
This is an original app I built from scratch. It is not an empty UI shell claiming to be multiplatform but a working app I use daily to solve my problems—specifically, to save money.
I am not saying this is a perfect Kotlin Multiplatform code sample, but at least I made everything work.
💻 If you don’t want to build the app: My GitHub repository page has iOS TestFlight and Android APK download links. I provide the MacOS and Windows installers for desktops, so you can instantly see something without messing with Gradle.
Particularly, I have implemented the demo mode, and you can see how the App works without needing to be in the UK and sign up as an Octopus Energy customer (but it would be best if you do!).
⭐️ If you like my work, please clap for this article or give me a star on the GitHub repository!
When you look at my Git commit history, you will see I built everything from scratch in one month — up to the moment I published this article.
I will share more about the experience of building this app here if anyone is interested.
For now, let’s take a look at the app, and I’ll go have some rest. 🙂
