Samples
Sample apps¶
There are two sample apps: Counter and Todo List.
Sample counter app¶
This sample demonstrates the following features: - Nested components - Routing - Reused components - State preservation (using StateKeeper
) - Retaining instances (using InstanceKeeper
) - Pluggable UI (Android Views, Jetpack Compose, SwiftUI, JS React)
Content: - Shared module which includes the following components: - Counter - this component just increments the counter every 250 ms. It starts counting once created and stops when destroyed. So Counter
continues counting while in the back stack, unless recreated. It uses the InstanceKeeper
, so counting continues after configuration changes. - CounterInnerContainer - this component contains the Counter
and two Routers
on the left and on the right side. Each Router
displays its stack of Counters
and two buttons for navigation. "Next" button pushes another Counter
to the corresponding Router
, "Prev" button pops the active Counter
for the Router
. - CounterRootComponent - this component contains the Counter
, the Router
of CounterInnerContainer
and a button pushing another CounterInnerContainer
to the stack. System back button is used for backward navigation. - Android sample app - iOS sample app - JavaScript sample app
Sample Counter Component structure¶
Sample Todo List app¶
This sample can be found in the JetBrains Compose repository here.
It demonstrates the following features: - Multiplatform: Android, iOS and Desktop - Shared JetBrains Compose UI for Android and Desktop apps - SwiftUI for iOS app - Nested components - Shared routing with view state preservation - Using Lifecycle
- Multi-module structure (one component per module) - Inter-component communication (via Reaktive, just an example) - MVI using MVIKotlin - Data persistance using SQLDelight
Please refer to the sample's readme for more information.