To build the user interface, you'll use the Compose Multiplatform toolkit for the Android part of your project and SwiftUI for the iOS one. These are both declarative UI frameworks, and you'll see similarities in the UI implementations. In both cases, you store the data in the phrases
variable and later iterate over it to produce a list of Text
items.
The composeApp
module contains an Android application, defines its main activity and the UI views, and uses the shared
module as a regular Android library. The UI of the application uses the Compose Multiplatform framework.
Make some changes and see how they are reflected in the UI:
Navigate to the App.kt
file in composeApp/src/androidMain/kotlin
.
Find the Greeting
class invocation. Select the greet()
function, right-click it, and select Go To | Declaration or Usages. You'll see that it's the same class from the shared
module you edited in the previous step.
In the Greeting.kt
file, update the greet()
function:
import kotlin.random.Random fun greet(): List<String> = buildList { add(if (Random.nextBoolean()) "Hi!" else "Hello!") add("Guess what this is! > ${platform.name.reversed()}!") }
Now it returns a list of strings.
Go back to the App.kt
file and update the App()
implementation:
@Composable @Preview fun App() { MaterialTheme { val greeting = remember { Greeting().greet() } Column( modifier = Modifier .padding(all = 10.dp) .safeContentPadding() .fillMaxSize(), verticalArrangement = Arrangement.spacedBy(8.dp), ) { greeting.forEach { greeting -> Text(greeting) HorizontalDivider() } } } }
Here the Column
composable shows each of the Text
items, adding padding around them and space between them.
Follow IntelliJ IDEA's suggestions to import the missing dependencies.
Now you can run the Android app to see how it displays the list of strings:
The iosApp
directory builds into an iOS application. It depends on and uses the shared
module as an iOS framework. The UI of the app is written in Swift.
Implement the same changes as in the Android app:
In IntelliJ IDEA, find the iosApp
folder at the root of your project in the Project tool window.
Open the ContentView.swift
file, right-click the Greeting().greet()
call, and select Go To | Definition.
You'll see the Objective-C declarations for the Kotlin functions defined in the shared
module. Kotlin types are represented as Objective-C types when used from Objective-C/Swift. Here the greet()
function returns List<String>
in Kotlin and is seen from Swift as returning NSArray<NSString>
. For more on type mappings, see Interoperability with Swift/Objective-C.
Update the SwiftUI code to display a list of items in the same way as in the Android app:
struct ContentView: View { let phrases = Greeting().greet() var body: some View { List(phrases, id: \.self) { Text($0) } } }
The results of the greet()
call are stored in the phrases
variable (let
in Swift is similar to Kotlin's val
).
The List
function produces a list of Text
items.
Start the iOS run configuration to see the changes:
If you are using Xcode, your Xcode project may still be using an old version of the framework. To resolve this, return to IntelliJ IDEA and rebuild the project or start the iOS run configuration.
If you are using Xcode, it may need to clear cached binaries: try resetting the environment by choosing Product | Clean Build Folder in the main menu.
Next stepIn the next part of the tutorial, you'll learn about dependencies and add a third-party library to expand the functionality of your project.
Get helpKotlin Slack. Get an invite and join the #multiplatform channel.
Kotlin issue tracker. Report a new issue.
Last modified: 28 July 2025
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4