fix: general layout improvements

This commit is contained in:
Diego Beraldin 2023-08-09 09:44:26 +02:00
parent 84fc7e635c
commit 9e39f240ee
12 changed files with 54 additions and 25 deletions

View File

@ -48,7 +48,7 @@ fun PostCard(
),
) {
Column(
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
verticalArrangement = Arrangement.spacedBy(Spacing.xxs),
) {
PostCardTitle(post)
PostCardSubtitle(

View File

@ -37,10 +37,11 @@ fun PostCardFooter(
onReply: (() -> Unit)? = null,
) {
Row(
modifier = Modifier.padding(horizontal = Spacing.xs),
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(Spacing.xxs),
) {
val buttonModifier = Modifier.size(32.dp).padding(4.dp)
val buttonModifier = Modifier.size(28.dp).padding(4.dp)
if (comments != null) {
Image(
modifier = buttonModifier.onClick {

View File

@ -53,14 +53,17 @@ class LanguageBottomSheet(
) {
for (value in values) {
Row(
modifier = Modifier.padding(Spacing.s).onClick {
modifier = Modifier.padding(
horizontal = Spacing.s,
vertical = Spacing.m,
).onClick {
onSelected(value)
onHide()
},
) {
Text(
text = value.toLanguageName(),
style = MaterialTheme.typography.bodyMedium,
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onBackground,
)
}

View File

@ -61,14 +61,17 @@ class ListingTypeBottomSheet(
) {
for (value in values) {
Row(
modifier = Modifier.padding(Spacing.s).onClick {
modifier = Modifier.padding(
horizontal = Spacing.s,
vertical = Spacing.m,
).onClick {
onSelected(value)
onHide()
},
) {
Text(
text = value.toReadableName(),
style = MaterialTheme.typography.bodyMedium,
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onBackground,
)
Spacer(modifier = Modifier.weight(1f))

View File

@ -62,14 +62,17 @@ class SortBottomSheet(
) {
for (value in values) {
Row(
modifier = Modifier.padding(Spacing.s).onClick {
modifier = Modifier.padding(
horizontal = Spacing.s,
vertical = Spacing.m,
).onClick {
onSelected(value)
onHide()
},
) {
Text(
text = value.toReadableName(),
style = MaterialTheme.typography.bodyMedium,
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onBackground,
)
Spacer(modifier = Modifier.weight(1f))

View File

@ -59,14 +59,17 @@ class ThemeBottomSheet(
) {
for (value in values) {
Row(
modifier = Modifier.padding(Spacing.s).onClick {
modifier = Modifier.padding(
horizontal = Spacing.s,
vertical = Spacing.m,
).onClick {
onSelected(value)
onHide()
},
) {
Text(
text = value.toReadableName(),
style = MaterialTheme.typography.bodyMedium,
style = MaterialTheme.typography.bodyLarge,
color = MaterialTheme.colorScheme.onBackground,
)
Spacer(modifier = Modifier.weight(1f))

View File

@ -32,7 +32,9 @@ internal fun PostsTopBar(
onSelectSortType: () -> Unit,
) {
Row(
modifier = Modifier.height(64.dp).padding(Spacing.s),
modifier = Modifier.height(50.dp).padding(
horizontal = Spacing.s,
),
verticalAlignment = Alignment.CenterVertically,
) {
Row(

View File

@ -15,9 +15,7 @@ class ProfileLoggedViewModel(
override fun reduce(intent: ProfileLoggedMviModel.Intent) {
when (intent) {
is ProfileLoggedMviModel.Intent.SelectTab -> mvi.updateState {
it.copy(
currentTab = intent.value,
)
it.copy(currentTab = intent.value)
}
}
}

View File

@ -44,10 +44,10 @@ internal fun SectionSelector(
modifier = Modifier
.weight(1f)
.fillMaxHeight()
.padding(bottom = Spacing.xxs)
.onClick {
onSectionSelected(ProfileLoggedSection.POSTS)
}
.padding(bottom = Spacing.xxs)
.let {
if (currentSection == ProfileLoggedSection.POSTS) {
it.background(
@ -77,10 +77,10 @@ internal fun SectionSelector(
modifier = Modifier
.weight(1f)
.fillMaxHeight()
.padding(bottom = Spacing.xxs)
.onClick {
onSectionSelected(ProfileLoggedSection.COMMENTS)
}
.padding(bottom = Spacing.xxs)
.let {
if (currentSection == ProfileLoggedSection.COMMENTS) {
it.background(
@ -105,10 +105,10 @@ internal fun SectionSelector(
modifier = Modifier
.weight(1f)
.fillMaxHeight()
.padding(bottom = Spacing.xxs)
.onClick {
onSectionSelected(ProfileLoggedSection.SAVED)
}
.padding(bottom = Spacing.xxs)
.let {
if (currentSection == ProfileLoggedSection.SAVED) {
it.background(

View File

@ -132,6 +132,7 @@ class LoginBottomSheet(
),
keyboardOptions = KeyboardOptions(
keyboardType = KeyboardType.Email,
autoCorrect = false,
imeAction = ImeAction.Next,
),
onValueChange = { value ->
@ -159,6 +160,7 @@ class LoginBottomSheet(
),
keyboardOptions = KeyboardOptions(
keyboardType = KeyboardType.Email,
autoCorrect = false,
imeAction = ImeAction.Next,
),
onValueChange = { value ->

View File

@ -1,8 +1,10 @@
package com.github.diegoberaldin.raccoonforlemmy
import androidx.compose.foundation.isSystemInDarkTheme
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.material.BottomAppBar
import androidx.compose.material.ExperimentalMaterialApi
import androidx.compose.material3.BottomAppBar
import androidx.compose.material.MaterialTheme
import androidx.compose.material3.ExperimentalMaterial3Api
import androidx.compose.material3.Scaffold
import androidx.compose.runtime.Composable
@ -11,9 +13,11 @@ import androidx.compose.runtime.collectAsState
import androidx.compose.runtime.getValue
import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.ui.unit.dp
import cafe.adriel.voyager.navigator.bottomSheet.BottomSheetNavigator
import cafe.adriel.voyager.navigator.tab.CurrentTab
import cafe.adriel.voyager.navigator.tab.TabNavigator
import com.github.diegoberaldin.raccoonforlemmy.core.appearance.data.ThemeState
import com.github.diegoberaldin.raccoonforlemmy.core.appearance.data.toThemeState
import com.github.diegoberaldin.raccoonforlemmy.core.appearance.theme.AppTheme
import com.github.diegoberaldin.raccoonforlemmy.core.preferences.KeyStoreKeys
@ -38,8 +42,8 @@ import kotlinx.coroutines.flow.onEach
fun App() {
val keyStore = remember { getTemporaryKeyStore() }
val systemDarkTheme = isSystemInDarkTheme()
val currentTheme = keyStore[KeyStoreKeys.UiTheme, if (systemDarkTheme) 1 else 0]
.let { it.toThemeState() }
val currentTheme =
keyStore[KeyStoreKeys.UiTheme, if (systemDarkTheme) 1 else 0].let { it.toThemeState() }
val defaultLocale = stringResource(MR.strings.lang)
val langCode = keyStore[KeyStoreKeys.Locale, defaultLocale]
@ -75,7 +79,14 @@ fun App() {
CurrentTab()
},
bottomBar = {
BottomAppBar {
BottomAppBar(
contentPadding = PaddingValues(0.dp),
backgroundColor = if (currentTheme == ThemeState.Light) {
MaterialTheme.colors.surface
} else {
MaterialTheme.colors.onSurface
},
) {
TabNavigationItem(HomeTab)
TabNavigationItem(SearchTab)
TabNavigationItem(ProfileTab)

View File

@ -4,8 +4,10 @@ import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.RowScope
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxHeight
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size
import androidx.compose.material.icons.Icons
@ -31,14 +33,13 @@ internal fun RowScope.TabNavigationItem(tab: Tab) {
.fillMaxHeight()
.onClick {
tabNavigator.current = tab
}
.padding(top = Spacing.s),
},
contentAlignment = Alignment.Center,
) {
Column(
modifier = Modifier.fillMaxSize(0.9f),
modifier = Modifier.padding(vertical = Spacing.xs),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(Spacing.xs),
verticalArrangement = Arrangement.spacedBy(Spacing.xxxs),
) {
val color = if (tabNavigator.current == tab) {
MaterialTheme.colorScheme.primary
@ -52,10 +53,12 @@ internal fun RowScope.TabNavigationItem(tab: Tab) {
tint = color,
)
Text(
modifier = Modifier,
text = tab.options.title,
style = MaterialTheme.typography.labelSmall,
color = color,
)
Spacer(modifier = Modifier.height(Spacing.xxxs))
}
}
}