Skip to content

Samples

Multi-Feature Sample App

This sample demonstrates the following features:

  • Nested reusable components
  • Bottom navigation
  • Nested navigation
  • State preservation (using StateKeeper)
  • Retaining instances (using InstanceKeeper)
  • Pluggable UI (Android Views, Jetpack Compose, SwiftUI, JS React)
  • Play Feature Delivery for Android
  • Tests, including UI tests (Jetpack Compose)

Please note that Gradle files included in this sample project are not supposed to be used as a reference. They share the configuration with the reset of the library, which simplifies the maintenance a lot. Please refer to the KMP documentation for information on configuring a KMP project. You can also check other sample projects described below.

Content:

  • shared - this is a shared module that contains the following components:
    • Root - the root (top-most) component, it displays the bottom navigation bar and the currently selected tab.
    • Counters - the Counters tab, contains a stack of Counter component.
      • Counter - the Counter component, it 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 Android configuration changes. The StateKeeper is used to preserve the state when the process is recreated on Android.
    • MultiPane - the Multi-Pane tab, it displays List and Details components either in a stack (one on top of another) or side by side. Please note that this sample is for advanced single-pane/multi-pane navigation and layout, for generic master-detail navigation please refer to the Sample Todo List App described below.
      • ArticleList - displays a random list of articles. Clicking on an item triggers the ArticleDetails component.
      • ArticleDetails - displays the content of the selected article.
    • DynamicFeatures - the Dynamic Features tab, it demonstrates the usage of Play Feature Delivery on Android, while using classing integration on other platforms. There are two simple feature components - Feature1 and Feature2 - they are located in separate modules described below.
      • DynamicFeature - a helper component responsible for loading dynamic feature components.
  • compose - this module contains Jetpack Compose UI.
  • dynamic-features/api - this module contains only API for dynamic feature components.
  • dynamic-features/compose-api - this module contains only Jetpack Compose API for dynamic feature components.
  • dynamic-features/feature1Impl - contains the implementation of Feature1 dynamic feature component. On Android it depends on android-app module and is used via reflection. On all other targets, the shared module directly depends on this module and no reflection is used.
  • dynamic-features/feature2Impl - contains the implementation of Feature2 dynamic feature component. On Android it depends on android-app module and is used via reflection. On all other targets, the shared module directly depends on this module and no reflection is used.
  • Android sample app
  • Desktop sample app
  • iOS sample app
  • Web (JS) sample app
  • Tests

Warning

The Multi-Pane sample is only for advanced single-pane/multi-pane navigation and layout. For generic master-detail navigation please refer to the Sample Todo List App described below.

Component Hierarchy

Counters Screenshots

Multi-Pane Screenshots

Sample Todo List App

The Sample Todo List App demonstrates the following features:

  • Multiplatform: Android, iOS, Desktop and Web
  • Shared JetBrains Compose UI for Android and Desktop apps
  • JetBrains (multiplatform) Compose UI for the Web browser app
  • 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 persistence using SQLDelight

Please refer to the sample's readme for more information.

Source Code

The Sample Todo List App can be found in the JetBrains Compose repository here.

Sample Greetings App

Sample Greetings Repository