MRouter

该项目将停止维护

请使用navigation3

概述

MRouter是一个适用于compose-multiplatform的路由库

其实现了基础的路由，参数传递，动画，手势，生命周期，共享元素以及局部路由等一系列功能。

安装

在项目的build.gradle.kts中添加以下依赖，同步后即可开始使用

 commonMain.dependencies {
implementation("cn.erolc.mrouter:core:<version>")
}

简单使用

我们首先需要在common中创建Compose页面的根部，然后实现各个平台的入口即可。代码如下

准备两个页面

classHomeViewModel : ViewModel() {
val result = mutableStateOf("")
}
@Composable
funHome(){
val pageScope =LocalPageScope.current
val viewModel = viewModel(::HomeViewModel) //use viewModelvar result by remember { viewModel.result }
Button(onClick={
pageScope.route("second") { // route to second page
argBuild{ // build the args
putString("key","value")
}
onResult{
result = it.getString("result","") //get return data 
}
}
}){
Text(result) //data
}
}
@Composable
funSecond(){
val pageScope =LocalPageScope.current
val args = rememberArgs()
Button(onClick={
pageScope.setResult(bundleOf("result" to "success")) // set return data
pageScope.backPressed() // back to home page
}){
Text(args.getString("key")) //value
}
}

common

在common中使用RouteHost

@Composable
funApp() {
MaterialTheme {
RouteHost("home") {
page("home") {
Home()
}
page("second") {
Second()
}
}
}
}

RouteHost是路由的起点，通过page方法将composable注册成页面，以上示例在打开app时将首先展现Home()页面.

android

classMainActivity : ComponentActivity() {
overridefunonCreate(savedInstanceState:Bundle?) {
super.onCreate(savedInstanceState)
setContent {
App() // 使用common的App()
}
}
}

desktop

funmain() = mRouterApplication {
App()
}

ios

funMainViewController() =ComposeUIViewController {
App()
}

wasmJs

@OptIn(ExperimentalComposeUiApi::class)
funmain() {
CanvasBasedWindow(canvasElementId ="ComposeTarget") {
App()
}
}