Tweak categories view

- Remove Compose top app bar behaviour since it's kind of jank -- we'll probably just remove the scrolling behaviour everywhere
- Tap title to rename
- Focus in textfield when opening dialogs
This commit is contained in:
arkon 2022-07-16 17:28:12 -04:00
parent 46ac9fe970
commit 0b78028cf6
8 changed files with 48 additions and 27 deletions

View File

@ -3,13 +3,9 @@ package eu.kanade.presentation.category
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.statusBarsPadding
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.material3.rememberTopAppBarScrollState
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.getValue
import androidx.compose.ui.Modifier
import androidx.compose.ui.input.nestedscroll.nestedScroll
import androidx.compose.ui.platform.LocalContext
import eu.kanade.presentation.category.components.CategoryContent
import eu.kanade.presentation.category.components.CategoryCreateDialog
@ -35,15 +31,10 @@ fun CategoryScreen(
navigateUp: () -> Unit,
) {
val lazyListState = rememberLazyListState()
val topAppBarScrollState = rememberTopAppBarScrollState()
val topAppBarScrollBehavior = TopAppBarDefaults.enterAlwaysScrollBehavior(topAppBarScrollState)
Scaffold(
modifier = Modifier
.statusBarsPadding()
.nestedScroll(topAppBarScrollBehavior.nestedScrollConnection),
modifier = Modifier.statusBarsPadding(),
topBar = {
CategoryTopAppBar(
topAppBarScrollBehavior = topAppBarScrollBehavior,
navigateUp = navigateUp,
)
},

View File

@ -4,12 +4,17 @@ import androidx.compose.material3.AlertDialog
import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.ui.Modifier
import androidx.compose.ui.focus.FocusRequester
import androidx.compose.ui.focus.focusRequester
import androidx.compose.ui.res.stringResource
import eu.kanade.domain.category.model.Category
import eu.kanade.presentation.components.TextButton
import eu.kanade.tachiyomi.R
import kotlinx.coroutines.delay
@Composable
fun CategoryCreateDialog(
@ -17,6 +22,8 @@ fun CategoryCreateDialog(
onCreate: (String) -> Unit,
) {
val (name, onNameChange) = remember { mutableStateOf("") }
val focusRequester = remember { FocusRequester() }
AlertDialog(
onDismissRequest = onDismissRequest,
confirmButton = {
@ -24,27 +31,35 @@ fun CategoryCreateDialog(
onCreate(name)
onDismissRequest()
},) {
Text(text = stringResource(id = R.string.action_add))
Text(text = stringResource(R.string.action_add))
}
},
dismissButton = {
TextButton(onClick = onDismissRequest) {
Text(text = stringResource(id = R.string.action_cancel))
Text(text = stringResource(R.string.action_cancel))
}
},
title = {
Text(text = stringResource(id = R.string.action_add_category))
Text(text = stringResource(R.string.action_add_category))
},
text = {
OutlinedTextField(
modifier = Modifier
.focusRequester(focusRequester),
value = name,
onValueChange = onNameChange,
label = {
Text(text = stringResource(id = R.string.name))
Text(text = stringResource(R.string.name))
},
)
},
)
LaunchedEffect(focusRequester) {
// TODO: https://issuetracker.google.com/issues/204502668
delay(100)
focusRequester.requestFocus()
}
}
@Composable
@ -54,6 +69,8 @@ fun CategoryRenameDialog(
category: Category,
) {
val (name, onNameChange) = remember { mutableStateOf(category.name) }
val focusRequester = remember { FocusRequester.Default }
AlertDialog(
onDismissRequest = onDismissRequest,
confirmButton = {
@ -61,27 +78,35 @@ fun CategoryRenameDialog(
onRename(name)
onDismissRequest()
},) {
Text(text = stringResource(id = android.R.string.ok))
Text(text = stringResource(android.R.string.ok))
}
},
dismissButton = {
TextButton(onClick = onDismissRequest) {
Text(text = stringResource(id = R.string.action_cancel))
Text(text = stringResource(R.string.action_cancel))
}
},
title = {
Text(text = stringResource(id = R.string.action_rename_category))
Text(text = stringResource(R.string.action_rename_category))
},
text = {
OutlinedTextField(
modifier = Modifier
.focusRequester(focusRequester),
value = name,
onValueChange = onNameChange,
label = {
Text(text = stringResource(id = R.string.name))
Text(text = stringResource(R.string.name))
},
)
},
)
LaunchedEffect(focusRequester) {
// TODO: https://issuetracker.google.com/issues/204502668
delay(100)
focusRequester.requestFocus()
}
}
@Composable

View File

@ -20,7 +20,7 @@ fun CategoryFloatingActionButton(
onCreate: () -> Unit,
) {
ExtendedFloatingActionButton(
text = { Text(text = stringResource(id = R.string.action_add)) },
text = { Text(text = stringResource(R.string.action_add)) },
icon = { Icon(imageVector = Icons.Outlined.Add, contentDescription = "") },
onClick = onCreate,
modifier = Modifier

View File

@ -1,7 +1,9 @@
package eu.kanade.presentation.category.components
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.outlined.ArrowDropDown
@ -35,11 +37,17 @@ fun CategoryListItem(
) {
Row(
modifier = Modifier
.fillMaxWidth()
.clickable { onRename() }
.padding(start = horizontalPadding, top = horizontalPadding, end = horizontalPadding),
verticalAlignment = Alignment.CenterVertically,
) {
Icon(imageVector = Icons.Outlined.Label, contentDescription = "")
Text(text = category.name, modifier = Modifier.padding(start = horizontalPadding))
Text(
text = category.name,
modifier = Modifier
.padding(start = horizontalPadding),
)
}
Row {
IconButton(

View File

@ -6,14 +6,12 @@ import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.SmallTopAppBar
import androidx.compose.material3.Text
import androidx.compose.material3.TopAppBarScrollBehavior
import androidx.compose.runtime.Composable
import androidx.compose.ui.res.stringResource
import eu.kanade.tachiyomi.R
@Composable
fun CategoryTopAppBar(
topAppBarScrollBehavior: TopAppBarScrollBehavior,
navigateUp: () -> Unit,
) {
SmallTopAppBar(
@ -26,8 +24,7 @@ fun CategoryTopAppBar(
}
},
title = {
Text(text = stringResource(id = R.string.action_edit_categories))
Text(text = stringResource(R.string.action_edit_categories))
},
scrollBehavior = topAppBarScrollBehavior,
)
}

View File

@ -57,7 +57,7 @@ fun LibraryGridCover(
) {
if (isLocal) {
Badge(
text = stringResource(id = R.string.local_source_badge),
text = stringResource(R.string.local_source_badge),
color = MaterialTheme.colorScheme.tertiary,
textColor = MaterialTheme.colorScheme.onTertiary,
)

View File

@ -103,7 +103,7 @@ fun LibraryListItem(
}
if (item.isLocal) {
Badge(
text = stringResource(id = R.string.local_source_badge),
text = stringResource(R.string.local_source_badge),
color = MaterialTheme.colorScheme.tertiary,
textColor = MaterialTheme.colorScheme.onTertiary,
)

View File

@ -215,7 +215,7 @@ fun ExpandableMangaDescription(
mutableStateOf(defaultExpandState)
}
val desc =
description.takeIf { !it.isNullOrBlank() } ?: stringResource(id = R.string.description_placeholder)
description.takeIf { !it.isNullOrBlank() } ?: stringResource(R.string.description_placeholder)
val trimmedDescription = remember(desc) {
desc
.replace(whitespaceLineRegex, "\n")