Kotlin Multiplatform, learn by creating

Salam (Peace) everyone, in this series, I aim to take you in a journey, where we will learn together about Kotlin multiplatform (KMP). Whether you are new to Kotlin, or an expert mobile developer, this series will have some fun for you ;).

We will first give a quick intro about Kotlin programming language, write some examples, then move, in next episodes, to know about KMP, how it works, and hopefully we can use Compose multiplatform, the declarative UI framework by Jetbrains, based on Google’s Jetpack Compose, to create the UI of our app for Android, iOS, Desktop and Web.

If you want your project to run on iOS, you will need to run it on a mac machine with Xcode, that’s a requirement by Apple.

As the title of the article suggests, we will learn by creating, meaning we will work on a project, practice, and learn concepts while we are having fun doing our application, inshaa’Allah :).

What is Kotlin, anyway?

Kotlin is an open-source, multiplatform programming language. developed by Jetbrains and the open-source community, the project started on 2010, by jetbrains, the 1.0 version was released on 2016. At I/O ’17, Google announced Kotlin as a first-class language for Android development. Google and Jetbrains collaborated since then in “The Kotlin foundation” to help develop the language. this foundation has more members now like Gradle, Shopify, and Touchlab. At I/O ’19, Android development became kotlin-first.

Kotlin was named after the Kotlin island, located in St. Petersburg near the Gulf of Finland.

How to define variables in Kotlin?

val name :String = "Ahmed" //immutable, once defined and assigned, can't be changed.

name = "Nabil" // this will give compile-time error. because val can't
               // be changed once assigned.

var age :Int = 30 //mutable, it's value can be changed.

age = 34 // I've aged too fast :D.

var share :Double = 3.5

Kotlin is a statically-typed language. which means that you must define the type of your defined data at the compile time.

Type inference

In the previous code, we explicitely wrote the data type like :String, :Int and :Double, we can infere the type by assigning the value, and kotlin will know the type.

val name = "Ahmed" // the compiler will infer the type as String

Functions

fun main() {
  val name = "Ahmed"
  println("Welcome $name")
}

in the previous code, we define a function with fun keyword. then the function name main then () then the body or scope of the function goes between { }. println is a function that takes a string and prints it to the console, in kotlin we can call variables inside strings using the $.

The main function is the first function that is called upon running the app.

Same as defining the variables, we can define the return type of a function like this:

fun sum(number1: Int, number2: Int) : Int { // Int is the return type
  return number1 + number2 // return statement
}

fun multiply(num1: Double, num2: Double) = num1 * num2
// you can write the function this way too,
// notice the type inference ;)

Classes

class MainScreen {
  val screenName: String
  // ...
}

data class User(var name: String, var joinDate: Long, var profileImage: String? = null)
// notice the "?" this means this is a nullable.
// we can assign default value with = then add the value.
// then this serves as an overloaded constructor, works in functions as well.

data class is a very useful kotlin feature where it’s main purpose is to hold data.

Interfaces

interface Hideable {
  var visibility: Int
  fun hide() 
}

// A class that needs this hide feature can implement the interface.
class Button :Hideable {
  override var visibility = 0
  override fun hide() {
    visibility = 0
  }
}

data class User(var name: String, var registered: Boolean = true){
  fun registrationState() : String {
    return if(registered) "Registered" else "Not registered"
  }
}

fun main() {
  val registeredUser = User(name = "Ahmed")
  val unregisteredUser = User(name = "Ali", registered = false )
  
  println("Welcome ${registeredUser.name}! you are ${registeredUser.registrationState()}")
  println("Sorry ${unregisteredUser.name}! you are ${unregisteredUser.registrationState()}")
}

try running the above code in the kotlin playground

You can know more about the above and other kotlin features like loops, if/else, when conditions, from the official kotlin documentation, we will talk about them while we use them in our implementation in next episodes inshaa’Allah

Check out Episode 2, where we take a closer step into knowing KMP.

Please follow me, and take some time to write me your thoughts in the comments, and let’s connect through my links in the bio or simply click here or scan this QR below to go to my youtube channel’s about page listing all my links: