Skip to content

Commit

Permalink
update doc
Browse files Browse the repository at this point in the history
  • Loading branch information
@Tlaster
Tlaster committed Oct 16, 2023
1 parent 4287c5b commit 4bd924a
Show file tree
Hide file tree
Showing 2 changed files with 97 additions and 96 deletions.
172 changes: 88 additions & 84 deletions docs/sample.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,59 +18,61 @@ This sample demonstrates the following features:
```kotlin
@Composable
fun App() {
val navigator = rememberNavigator()
MaterialTheme {
NavHost(
navigator = navigator,
initialRoute = "/home"
) {
scene(route = "/home") {
val homeViewModel = viewModel {
HomeViewModel()
}
val name by homeViewModel.name.observeAsState()
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text(
text = "Greet Me!",
style = MaterialTheme.typography.h6
)
Spacer(modifier = Modifier.height(30.dp))
TextField(
value = name,
maxLines = 1,
label = { Text(text = "Enter your name") },
onValueChange = {
homeViewModel.setName(it)
}
)
Spacer(modifier = Modifier.height(30.dp))
Button(
onClick = {
navigator.navigate(route = "/greeting/$name")
}
) {
Text(text = "GO!")
PreComposeApp {
val navigator = rememberNavigator()
MaterialTheme {
NavHost(
navigator = navigator,
initialRoute = "/home"
) {
scene(route = "/home") {
val homeViewModel = viewModel {
HomeViewModel()
}
}
}
scene(route = "/greeting/{name}") { backStackEntry ->
backStackEntry.path<String>("name")?.let { name ->
val name by homeViewModel.name.observeAsState()
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text(
text = name,
text = "Greet Me!",
style = MaterialTheme.typography.h6
)
Spacer(modifier = Modifier.height(30.dp))
Button(onClick = { navigator.goBack() }) {
Text(text = "GO BACK!")
TextField(
value = name,
maxLines = 1,
label = { Text(text = "Enter your name") },
onValueChange = {
homeViewModel.setName(it)
}
)
Spacer(modifier = Modifier.height(30.dp))
Button(
onClick = {
navigator.navigate(route = "/greeting/$name")
}
) {
Text(text = "GO!")
}
}
}
scene(route = "/greeting/{name}") { backStackEntry ->
backStackEntry.path<String>("name")?.let { name ->
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text(
text = name,
style = MaterialTheme.typography.h6
)
Spacer(modifier = Modifier.height(30.dp))
Button(onClick = { navigator.goBack() }) {
Text(text = "GO BACK!")
}
}
}
}
Expand All @@ -93,57 +95,59 @@ class HomeViewModel : ViewModel() {
```kotlin
@Composable
fun App() {
val navigator = rememberNavigator()
MaterialTheme {
NavHost(
navigator = navigator,
initialRoute = "/home"
) {
scene(route = "/home") {
val homeViewModel = viewModel {
HomeViewModel()
}
val name by homeViewModel.name.collectAsStateWithLifecycle()
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text(
text = "Greet Me!",
style = MaterialTheme.typography.h6
)
Spacer(modifier = Modifier.height(30.dp))
TextField(
value = name,
maxLines = 1,
label = { Text(text = "Enter your name") },
onValueChange = homeViewModel::setName
)
Spacer(modifier = Modifier.height(30.dp))
Button(
onClick = {
navigator.navigate(route = "/greeting/$name")
}
) {
Text(text = "GO!")
PreComposeApp {
val navigator = rememberNavigator()
MaterialTheme {
NavHost(
navigator = navigator,
initialRoute = "/home"
) {
scene(route = "/home") {
val homeViewModel = viewModel {
HomeViewModel()
}
}
}
scene(route = "/greeting/{name}") { backStackEntry ->
backStackEntry.path<String>("name")?.let { name ->
val name by homeViewModel.name.collectAsStateWithLifecycle()
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text(
text = name,
text = "Greet Me!",
style = MaterialTheme.typography.h6
)
Spacer(modifier = Modifier.height(30.dp))
Button(onClick = navigator::goBack) {
Text(text = "GO BACK!")
TextField(
value = name,
maxLines = 1,
label = { Text(text = "Enter your name") },
onValueChange = homeViewModel::setName
)
Spacer(modifier = Modifier.height(30.dp))
Button(
onClick = {
navigator.navigate(route = "/greeting/$name")
}
) {
Text(text = "GO!")
}
}
}
scene(route = "/greeting/{name}") { backStackEntry ->
backStackEntry.path<String>("name")?.let { name ->
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
Text(
text = name,
style = MaterialTheme.typography.h6
)
Spacer(modifier = Modifier.height(30.dp))
Button(onClick = navigator::goBack) {
Text(text = "GO BACK!")
}
}
}
}
Expand Down
21 changes: 9 additions & 12 deletions docs/setup.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,20 +17,17 @@ api("moe.tlaster:precompose:$precompose_version")
// api("moe.tlaster:precompose-koin:$precompose_version") // For Koin intergration
```
## Android
Change the `androidx.activity.compose.setContent` to `moe.tlaster.precompose.lifecycle.setContent`

## Desktop (JVM)
Change the `Window` to `moe.tlaster.precompose.PreComposeWindow`
## Wrap the `App()`

## iOS
Set the `UIWindow.rootViewController` to `PreComposeApplication`

## Native macOS
Change the `Window` to `moe.tlaster.precompose.PreComposeWindow`

## Web (Canvas)
Change the `Window` to `moe.tlaster.precompose.preComposeWindow`
Wrap your App with `PreComposApp` like this:
```Kotlin
fun App() {
PreComposeApp {
// your apps content gose here
}
}
```

## Done!
That's it! Enjoying the PreCompose! Now you can write all your business logic and ui code in `commonMain`

0 comments on commit 4bd924a

Please sign in to comment.