🧱 Brick - Multiplatform navigation library for Compose.

Overview

MAVEN Platform API Platform


Brick

Take control of your apps

Brick is a lightweight library to make navigation.

Features

  • Framework free (Router can be injected in any layer of project. Navigate from any place you want. Example: UI-navigation or business logic navigation)
  • Child screen navigation (easy BottomSheet navigation, Tab navigation, Dialogs navigation)
  • Nested navigation
  • Lifecycle
  • Multi-module navigation (provide router instance from any module to any module or just implement all app navigation inside one module or something else)
  • Deep-link support
  • Arguments support
  • Screens communication support
  • Current screen check
  • Transition animations
  • Overlay navigation

Samples

Overlay sample Transition Animation Small sample Large sample
Desktop sample

Installation

Add repository in your project

repositories {
    mavenCentral()
    maven {
        url "https://maven.pkg.jetbrains.space/public/p/compose/dev"
    }
}

Add the dependency in your build.gradle

dependencies {
    //Brick
    implementation 'io.github.alphicc:brick:1.0.0-rc01'
}

Android: Set jvmTarget in your build.gradle

kotlinOptions {
    jvmTarget = '11'
}

Thats all!

Usage

  1. Create Router in any place of your project (Note: router contains all information about screen. Router destroyed = all navigation/screens data destroyed).
val router: TreeRouter = TreeRouter.new()
  1. Create Screen. Screen != UI. Screen has lifecycle, channels to communicate between other screens. Screen can live without UI. UI - part of Screen.
val screen1 = Screen<Unit>(
  key = "1",
  content = { SimpleScreen(1, "new") { smallSampleRouter.addScreen(screen2) } } // content - ui
)
  1. Provide ContainerConnector to %PLATFORM%AnimatedScreensContainer or %PLATFORM%ScreensContainer . Your Router implements ContainerConnector.
class SmallSampleActivity : ComponentActivity() {

  val containerConnector: ContainerConnector = ... //inject or provide from application class

  override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)

      setContent {
          AndroidScreensContainer(containerConnector)
      }
  }
}
  1. Navigate!

Work representation

Integration schema

Work schema

Lifecycle sample

Multistack navigation

  1. Create nested router using branch method.
//Screens.bottomMenuScreen.key - screen key that contains nested container
private val firstMenuRouter = mainRouter.branch(Screens.bottomMenuScreen.key).apply {
  addScreen(Screens.innerNavigationScreen, this)//initial navigation sample
}
  1. Pass created nested router to your nested %PLATFORM%ScreensContainer.
//inside your composable function
%PLATFORM%AnimatedScreensContainer(firstMenuRouter)
  1. Use your nested router to make nested navigation!

Multistack graph sample (simple)

Multistack graph sample (extended)

Navigation methods list

  • currentScreenKey
  • backScreen
  • backToScreen
  • replaceScreen
  • addScreen
  • lastChildKey
  • backChild
  • backToChild
  • replaceChild
  • addChild
  • cleanRouter
  • setOverlay
  • removeOverlay
  • newRootScreen
You might also like...
🚀 Android project template with Compose, MVVM, Hilt and Navigation
🚀 Android project template with Compose, MVVM, Hilt and Navigation

compose-android-template An Android project template with MVVM, Hilt, Navigation and Compose ✍️ Author 👤 theapache64 Twitter: @theapache64 Email: the

Small Android project demonstrating some navigation components for Jetpack Compose.
Small Android project demonstrating some navigation components for Jetpack Compose.

Small Android project demonstrating some navigation components for Jetpack Compose. Created this for presenting about this topic for a GDG meetup.

Kotlin, MVVM, Navigation Component, Hilt, Jetpack Compose, Retrofit2

What is this project? This course will replace my old java mvvm introduction: https://codingwithmitch.com/courses/rest-api-mvvm-retrofit2/. Watch the

[Tutorial] D-pad navigation in Jetpack Compose

dpad-compose D-pad navigation in Jetpack Compose The problem While Android is mostly used on touch devices, the operating system can also be used with

Missing safe arguments generator for Compose Navigation

Safe Arguments Generator Yet another attempt to add safe arguments to Compose Navigation. Why Since routes in Navigation Component don't support safe

Android Sample Kotlin+ MVI + Jetpack compose + Coroutines + Retrofit + Hilt  + Room + Navigation component
Android Sample Kotlin+ MVI + Jetpack compose + Coroutines + Retrofit + Hilt + Room + Navigation component

MVIComposeSample Android Sample app to show user latest movies implementing MVI + Clean Architecture using kotlin & Jetpack compose following solid an

Android App made by Jetpack Compose Components with Kotlin, MVVM Pattern, Multi Module, Navigation, Hilt, Coroutines, Retrofit and cached data by Room
Android App made by Jetpack Compose Components with Kotlin, MVVM Pattern, Multi Module, Navigation, Hilt, Coroutines, Retrofit and cached data by Room

Android App made by Jetpack Compose Components with Kotlin, MVVM Pattern, Multi Module, Navigation, Hilt, Coroutines, Retrofit and cached data by Room

Android App made by Jetpack Compose Components with Kotlin, MVVM Pattern, Multi Module, Navigation, Hilt, Coroutines, Retrofit and cached data by Room
Android App made by Jetpack Compose Components with Kotlin, MVVM Pattern, Multi Module, Navigation, Hilt, Coroutines, Retrofit and cached data by Room

Mobile Banking Android App made by Jetpack Compose Components with Kotlin, MVVM Pattern, Multi Module, Navigation, Hilt, Coroutines, Retrofit and cach

Model-driven navigation for Jetpack Compose
Model-driven navigation for Jetpack Compose

Model-driven navigation for Jetpack Compose

Comments
  • Clear top

    Clear top

    Is there any ways to clear top when navigating to screen?

    For example: A -> B -> C => D

    When we navigate D, it must clear all A, B, C screens

    enhancement question 
    opened by BaxtiyorNurmatov 1
Releases(2.1.1)
Owner
Petr Shubin
Petr Shubin
Compose-navigation - Set of utils to help with integrating Jetpack Compose and Jetpack's Navigation

Jetpack Compose Navigation Set of utils to help with integrating Jetpack Compose

Adam Kobus 5 Apr 5, 2022
A library that enables Safe Navigation for you Composable destinations when using Jetpack Compose Navigation

A library that enables Safe Navigation for you Composable destinations when using Jetpack Compose Navigation

Roman Levinzon 59 Oct 19, 2022
Navigation-Compose - A sample to showcase Kotlin, MVVM, Hilt, Coroutines, StateFlow, Jetpack compose

Navigation-Compose A sample to showcase Kotlin, MVVM, Hilt, Coroutines, StateFlo

Mohammadali Rezaei 6 Jul 13, 2022
A Simple Blog App using Jetpack Compose, Flow, Navigation Compose, Room and Firebase

BlogCompose A Simple Blog App using Jetpack Compose, Flow, Navigation Compose, Room and Firebase Instructions Download your Firebase configuration fil

null 4 Oct 10, 2022
Small code generating library for safe Jetpack Compose navigation with no boilerplate.

Compose Destinations A KSP library to use alongside compose navigation. It reduces boilerplate code and is less error-prone since passing arguments be

Rafael Costa 1.9k Jan 5, 2023
This library is a helper for the Android Compose Navigation routes

ComposableRoutes This library is a helper for the Android Compose Navigation routes: generates routes for the annotated screens provides helpers to re

Rostyslav Lesovyi 19 Nov 5, 2022
Compose desktop navigation library

Navipose Compose desktop navigation library Features Now navipose supports basic screen navigation between few screens Examples At first you should cr

null 5 Oct 28, 2022
A lightweight state management library for Compose Multiplatform.

Staccato A lightweight state management library for Compose Multiplatform. The term staccato (pronounced "stuh-caw-toe") means detached, or separated,

Marcello Galhardo 5 Oct 31, 2021
This repos one of the ways hows how to use Jetpack Compose Navigation along with Dagger 2

Dagger 2 and Jetpack Compose Integration This repository is about a way how to use Dagger 2 for projects which using Jetpack Compose. Here is an artic

Alexey Glukharev 10 Nov 16, 2022
Create Bottom Navigation Bar with Jetpack Compose

BottomNavigationBarComposeExample Create Bottom Navigation Bar with Jetpack Compose https://johncodeos.com/how-to-create-bottom-navigation-bar-with-je

JohnCodeos.com 31 Dec 24, 2022