Lonami
/
Talaria
1
0
Fork 1
Code Issues 8 Pull Requests Packages Projects Releases Wiki Activity

Add navigation

This commit is contained in:
Lonami Exo 2022-10-12 11:44:38 +02:00
parent ae7aa10748
commit fee6c52606
6 changed files with 104 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
app/build.gradle
View File

@ -54,6 +54,7 @@ dependencies {
implementation "androidx.compose.ui:ui:$compose_ui_version"
implementation "androidx.compose.ui:ui-tooling-preview:$compose_ui_version"
implementation 'androidx.compose.material:material:1.2.1'
implementation "androidx.navigation:navigation-compose:2.5.2"
testImplementation 'junit:junit:4.13.2'
androidTestImplementation 'androidx.test.ext:junit:1.1.3'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'

3
app/src/main/java/dev/lonami/talaria/MainActivity.kt
View File

@ -7,7 +7,6 @@ import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.material.MaterialTheme
import androidx.compose.material.Surface
import androidx.compose.ui.Modifier
import dev.lonami.talaria.ui.LoginScreen
import dev.lonami.talaria.ui.theme.TalariaTheme
class MainActivity : ComponentActivity() {
@ -20,7 +19,7 @@ class MainActivity : ComponentActivity() {
modifier = Modifier.fillMaxSize(),
color = MaterialTheme.colors.background
) {
LoginScreen()
TalariaApp()
}
}
}

79
app/src/main/java/dev/lonami/talaria/TalariaApp.kt Normal file
View File

@ -0,0 +1,79 @@
package dev.lonami.talaria
import androidx.annotation.StringRes
import androidx.compose.foundation.layout.padding
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.ArrowBack
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.res.stringResource
import androidx.navigation.compose.NavHost
import androidx.navigation.compose.composable
import androidx.navigation.compose.currentBackStackEntryAsState
import androidx.navigation.compose.rememberNavController
import dev.lonami.talaria.ui.ChatScreen
import dev.lonami.talaria.ui.DialogScreen
import dev.lonami.talaria.ui.LoginScreen
enum class TalariaScreen(@StringRes val title: Int) {
Login(title = R.string.app_name),
Dialog(title = R.string.dialog),
Chat(title = R.string.chat),
}
@Composable
fun TalariaAppBar(currentScreen: TalariaScreen, canNavigateBack: Boolean, navigateUp: () -> Unit) {
TopAppBar(
title = { Text(stringResource(currentScreen.title)) },
navigationIcon = {
if (canNavigateBack) {
IconButton(onClick = navigateUp) {
Icon(
imageVector = Icons.Filled.ArrowBack,
contentDescription = stringResource(R.string.back_button)
)
}
}
}
)
}
@Composable
fun TalariaApp() {
val navController = rememberNavController()
val backStackEntry by navController.currentBackStackEntryAsState()
val currentScreen =
TalariaScreen.valueOf(backStackEntry?.destination?.route ?: TalariaScreen.Login.name)
Scaffold(
topBar = {
TalariaAppBar(
currentScreen,
canNavigateBack = navController.previousBackStackEntry != null,
navigateUp = { navController.navigateUp() }
)
}
) { innerPadding ->
NavHost(
navController = navController,
startDestination = TalariaScreen.Dialog.name,
Modifier.padding(innerPadding)
) {
composable(route = TalariaScreen.Dialog.name) {
DialogScreen(onDialogSelected = {
navController.navigate(TalariaScreen.Chat.name)
})
}
composable(route = TalariaScreen.Chat.name) {
ChatScreen()
}
composable(route = TalariaScreen.Login.name) {
LoginScreen(onConfirmOtp = {
navController.navigate(TalariaScreen.Dialog.name)
})
}
}
}
}

18
app/src/main/java/dev/lonami/talaria/ui/DialogScreen.kt
View File

@ -1,6 +1,7 @@
package dev.lonami.talaria.ui
import androidx.compose.foundation.Image
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.fillMaxWidth
@ -24,11 +25,12 @@ import dev.lonami.talaria.model.Dialog
import dev.lonami.talaria.ui.theme.TalariaTheme
@Composable
fun DialogCard(dialog: Dialog) {
fun DialogCard(dialog: Dialog, onDialogSelected: () -> Unit) {
Card(
modifier = Modifier
.fillMaxWidth()
.padding(8.dp, 16.dp)
.clickable(onClick = onDialogSelected)
) {
Row {
Image(
@ -45,22 +47,26 @@ fun DialogCard(dialog: Dialog) {
}
@Composable
fun DialogList(dialogs: List<Dialog>) {
fun DialogList(dialogs: List<Dialog>, onDialogSelected: (Int) -> Unit) {
LazyColumn {
items(dialogs.size) { DialogCard(dialogs[it]) }
items(dialogs.size) {
DialogCard(dialogs[it], onDialogSelected = {
onDialogSelected(it)
})
}
}
}
@Composable
fun DialogScreen(dialogViewModel: DialogViewModel = viewModel()) {
fun DialogScreen(onDialogSelected: (Int) -> Unit, dialogViewModel: DialogViewModel = viewModel()) {
val dialogUiState by dialogViewModel.uiState.collectAsState()
DialogList(dialogUiState.dialogs)
DialogList(dialogUiState.dialogs, onDialogSelected = onDialogSelected)
}
@Preview
@Composable
fun DialogPreview() {
TalariaTheme {
DialogScreen()
DialogScreen(onDialogSelected = { })
}
}

12
app/src/main/java/dev/lonami/talaria/ui/LoginScreen.kt
View File

@ -85,7 +85,7 @@ fun OtpInput(otp: String, onOtpChanged: (String) -> Unit, onConfirmOtp: () -> Un
}
@Composable
fun LoginScreen() {
fun LoginScreen(onConfirmOtp: () -> Unit) {
var stage by remember { mutableStateOf(LoginStage.ASK_PHONE) }
var phone by remember { mutableStateOf("") }
var otp by remember { mutableStateOf("") }
@ -110,9 +110,11 @@ fun LoginScreen() {
phone,
onPhoneChanged = { phone = it },
onSendCode = { stage = LoginStage.ASK_CODE })
LoginStage.ASK_CODE -> OtpInput(otp, onOtpChanged = { otp = it }, onConfirmOtp = {
})
LoginStage.ASK_CODE -> OtpInput(
otp,
onOtpChanged = { otp = it },
onConfirmOtp = onConfirmOtp
)
}
}
}
@ -121,6 +123,6 @@ fun LoginScreen() {
@Composable
fun LoginPreview() {
TalariaTheme {
LoginScreen()
LoginScreen(onConfirmOtp = { })
}
}

3
app/src/main/res/values/strings.xml
View File

@ -12,4 +12,7 @@
<string name="profile_photo">Profile Picture</string>
<string name="write_message">Write a message…</string>
<string name="send_message">Send</string>
<string name="back_button">Back</string>
<string name="dialog">All chats</string>
<string name="chat">Messages</string>
</resources>