MRouter

MRouter是一个适用于compose-multiplatform的路由库，其实现了基础的路由，参数传递，动画，手势，生命周期，共享元素以及局部路由等一系列功能。

安装

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

    commonMain.dependencies {
            implementation("cn.erolc.mrouter:core:1.0.0-beta")
    }

使用

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

准备两个页面

@Composable
fun Home(){
    val pageScope = LocalPageScope.current
    Button(onClick={
        pageScope.route("second") // route to second page
    }){
        //code...
    }
}

@Composable
fun Second(){
    val pageScope = LocalPageScope.current
    Button(onClick={
        pageScope.backPressed() // back to home page
    }){
        //code...
    }
}

common

在common中使用RouteHost

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

RouteHost是路由的起点，通过page方法将composable注册成页面，以上示例在打开app时将首先展现Home()页面。有关注册的更多操作，可前往注册部分。

android

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            App() // 使用common的App()
        }
    }
}

desktop

fun main() = mRouterApplication {
    App()
}

ios

fun MainViewController() = mRouterUIViewController {
    App()
}

wasmJs

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