codinux
/
Bankmeister
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Extracted NavigationMenuItem

This commit is contained in:
dankito 2024-08-28 23:47:59 +02:00
parent ce5b99c290
commit 710e06309e
3 changed files with 52 additions and 32 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
composeApp/src/commonMain/kotlin/net/codinux/banking/ui/appskeleton/SideMenu.kt
View File

@ -32,6 +32,11 @@ private val HeaderBackground = Brush.linearGradient(
)
)
private val ItemHeight = 48.dp
private val itemModifier = Modifier.height(ItemHeight).widthIn(min = 300.dp).padding(start = 8.dp)
@Composable
fun SideMenu(appContent: @Composable () -> Unit) {
val drawerState = uiState.drawerState.collectAsState().value
@ -59,11 +64,11 @@ fun SideMenu(appContent: @Composable () -> Unit) {
Divider(color = Colors.DrawerDivider)
Column(Modifier.padding(horizontal = 16.dp, vertical = 24.dp)) {
Column(Modifier.height(40.dp), verticalArrangement = Arrangement.Center) {
Column(Modifier.height(ItemHeight), verticalArrangement = Arrangement.Center) {
Text("Konten", color = Colors.DrawerPrimaryText)
}
BanksList(textColor = Colors.DrawerPrimaryText) { userAccount, bankAccount ->
BanksList(textColor = Colors.DrawerPrimaryText, itemModifier = itemModifier) { userAccount, bankAccount ->
uiState.accountFilter.value = if (userAccount == null) {
emptyList()
} else {

39
composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/BanksList.kt
View File

@ -1,11 +1,8 @@
package net.codinux.banking.ui.composables
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.*
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.Dp
@ -18,7 +15,7 @@ import net.codinux.banking.ui.config.DI
private val uiState = DI.uiState
private val IconTextSpacing = 36.dp
private val IconTextSpacing = 24.dp
@Composable
fun BanksList(
@ -30,40 +27,22 @@ fun BanksList(
) {
val userAccounts = uiState.userAccounts.collectAsState()
Column(modifier) {
Row(
itemModifier.clickable {
accountSelected?.invoke(null, null)
},
verticalAlignment = Alignment.CenterVertically
) {
BankIcon(null as? String?, Modifier.padding(end = IconTextSpacing), Modifier.size(iconSize), fallbackIcon = Res.drawable.account)
Text("Alle Konten", color = textColor)
Column(modifier) {
NavigationMenuItem(itemModifier, "Alle Konten", textColor, iconSize, IconTextSpacing, fallbackIcon = Res.drawable.account) {
accountSelected?.invoke(null, null)
}
userAccounts.value.forEach { userAccount ->
userAccounts.value.sortedBy { it.displayIndex }.forEach { userAccount ->
Spacer(Modifier.fillMaxWidth().height(12.dp))
Row(
itemModifier.clickable {
accountSelected?.invoke(userAccount, null)
},
verticalAlignment = Alignment.CenterVertically
) {
BankIcon(userAccount, Modifier.padding(end = IconTextSpacing), Modifier.size(iconSize), fallbackIcon = Res.drawable.account)
Text(userAccount.bankName, color = textColor)
NavigationMenuItem(itemModifier, userAccount.bankName, textColor, iconSize, IconTextSpacing, userAccount, fallbackIcon = Res.drawable.account) {
accountSelected?.invoke(userAccount, null)
}
userAccount.accounts.sortedBy { it.displayIndex }.forEach { account ->
Column(
itemModifier.clickable {
accountSelected?.invoke(userAccount, account)
}.padding(start = iconSize + IconTextSpacing),
verticalArrangement = Arrangement.Center
) {
Text(account.productName ?: account.identifier, color = textColor)
NavigationMenuItem(itemModifier, account.productName ?: account.identifier, textColor, iconSize, IconTextSpacing) {
accountSelected?.invoke(userAccount, account)
}
}
}

36
composeApp/src/commonMain/kotlin/net/codinux/banking/ui/composables/NavigationMenuItem.kt Normal file
View File

@ -0,0 +1,36 @@
package net.codinux.banking.ui.composables
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material.Text
import androidx.compose.runtime.Composable
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import net.codinux.banking.client.model.UserAccount
import org.jetbrains.compose.resources.DrawableResource
@Composable
fun NavigationMenuItem(
modifier: Modifier = Modifier,
text: String,
textColor: Color = Color.White,
iconSize: Dp = 24.dp,
iconTextSpacing: Dp = 24.dp,
userAccount: UserAccount? = null,
fallbackIcon: DrawableResource? = null,
onClick: (() -> Unit)? = null
) {
Row(
modifier.clickable { onClick?.invoke() },
verticalAlignment = Alignment.CenterVertically
) {
BankIcon(userAccount, Modifier.padding(end = iconTextSpacing), Modifier.size(iconSize), fallbackIcon = fallbackIcon)
Text(text, color = textColor)
}
}