🚀 Progress Bar Alignment option

* Changed horizontal alignment of the Progress Bar in Reader

Part-of: #148
This commit is contained in:
Acclorite 2025-01-12 17:22:55 +02:00
parent 8e531c5ced
commit f48409719f
13 changed files with 77 additions and 2 deletions

View file

@ -55,6 +55,7 @@ object DataStoreConstants {
val IMAGES_COLOR_EFFECTS = stringPreferencesKey("images_color_effects")
val PROGRESS_BAR = booleanPreferencesKey("progress_bar")
val PROGRESS_BAR_PADDING = intPreferencesKey("progress_bar_padding")
val PROGRESS_BAR_ALIGNMENT = stringPreferencesKey("progress_bar_alignment")
// Browse settings
val BROWSE_FILES_STRUCTURE = stringPreferencesKey("browse_files_structure")

View file

@ -55,6 +55,7 @@ fun ReaderContent(
progress: String,
progressBar: Boolean,
progressBarPadding: Dp,
progressBarAlignment: HorizontalAlignment,
paragraphHeight: Dp,
sidePadding: Dp,
bottomBarPadding: Dp,
@ -128,6 +129,7 @@ fun ReaderContent(
progress = progress,
progressBar = progressBar,
progressBarPadding = progressBarPadding,
progressBarAlignment = progressBarAlignment,
paragraphHeight = paragraphHeight,
sidePadding = sidePadding,
bottomBarPadding = bottomBarPadding,

View file

@ -55,6 +55,7 @@ fun ReaderLayout(
progress: String,
progressBar: Boolean,
progressBarPadding: Dp,
progressBarAlignment: HorizontalAlignment,
paragraphHeight: Dp,
sidePadding: Dp,
backgroundColor: Color,
@ -221,6 +222,7 @@ fun ReaderLayout(
ReaderProgressBar(
progress = progress,
progressBarPadding = progressBarPadding,
progressBarAlignment = progressBarAlignment,
fontColor = fontColor,
sidePadding = sidePadding
)

View file

@ -7,16 +7,17 @@ import androidx.compose.foundation.text.selection.DisableSelection
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.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.text.style.TextOverflow
import androidx.compose.ui.unit.Dp
import ua.acclorite.book_story.domain.util.HorizontalAlignment
@Composable
fun ReaderProgressBar(
progress: String,
progressBarPadding: Dp,
progressBarAlignment: HorizontalAlignment,
fontColor: Color,
sidePadding: Dp
) {
@ -27,7 +28,7 @@ fun ReaderProgressBar(
horizontal = sidePadding,
vertical = progressBarPadding
),
contentAlignment = Alignment.Center
contentAlignment = progressBarAlignment.alignment
) {
DisableSelection {
Text(

View file

@ -59,6 +59,7 @@ fun ReaderScaffold(
progress: String,
progressBar: Boolean,
progressBarPadding: Dp,
progressBarAlignment: HorizontalAlignment,
paragraphHeight: Dp,
sidePadding: Dp,
bottomBarPadding: Dp,
@ -159,6 +160,7 @@ fun ReaderScaffold(
progress = progress,
progressBar = progressBar,
progressBarPadding = progressBarPadding,
progressBarAlignment = progressBarAlignment,
paragraphHeight = paragraphHeight,
sidePadding = sidePadding,
backgroundColor = backgroundColor,

View file

@ -9,6 +9,7 @@ import androidx.compose.ui.graphics.Color
import androidx.compose.ui.res.stringResource
import ua.acclorite.book_story.R
import ua.acclorite.book_story.presentation.settings.components.SettingsSubcategory
import ua.acclorite.book_story.presentation.settings.reader.progress.components.ProgressBarAlignmentOption
import ua.acclorite.book_story.presentation.settings.reader.progress.components.ProgressBarOption
import ua.acclorite.book_story.presentation.settings.reader.progress.components.ProgressBarPaddingOption
@ -31,5 +32,9 @@ fun LazyListScope.ProgressSubcategory(
item {
ProgressBarPaddingOption()
}
item {
ProgressBarAlignmentOption()
}
}
}

View file

@ -0,0 +1,45 @@
package ua.acclorite.book_story.presentation.settings.reader.progress.components
import androidx.compose.material3.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.ui.res.stringResource
import androidx.hilt.navigation.compose.hiltViewModel
import androidx.lifecycle.compose.collectAsStateWithLifecycle
import ua.acclorite.book_story.R
import ua.acclorite.book_story.domain.ui.ButtonItem
import ua.acclorite.book_story.domain.util.HorizontalAlignment
import ua.acclorite.book_story.presentation.core.components.settings.SegmentedButtonWithTitle
import ua.acclorite.book_story.ui.main.MainEvent
import ua.acclorite.book_story.ui.main.MainModel
import ua.acclorite.book_story.ui.theme.ExpandingTransition
@Composable
fun ProgressBarAlignmentOption() {
val mainModel = hiltViewModel<MainModel>()
val state = mainModel.state.collectAsStateWithLifecycle()
ExpandingTransition(visible = state.value.progressBar) {
SegmentedButtonWithTitle(
title = stringResource(id = R.string.progress_bar_alignment_option),
buttons = HorizontalAlignment.entries.map {
ButtonItem(
id = it.toString(),
title = when (it) {
HorizontalAlignment.START -> stringResource(id = R.string.alignment_start)
HorizontalAlignment.CENTER -> stringResource(id = R.string.alignment_center)
HorizontalAlignment.END -> stringResource(id = R.string.alignment_end)
},
textStyle = MaterialTheme.typography.labelLarge,
selected = it == state.value.progressBarAlignment
)
},
onClick = {
mainModel.onEvent(
MainEvent.OnChangeProgressBarAlignment(
it.id
)
)
}
)
}
}

View file

@ -57,4 +57,5 @@ sealed class MainEvent {
data class OnChangeImagesColorEffects(val value: String) : MainEvent()
data class OnChangeProgressBar(val value: Boolean) : MainEvent()
data class OnChangeProgressBarPadding(val value: Int) : MainEvent()
data class OnChangeProgressBarAlignment(val value: String) : MainEvent()
}

View file

@ -480,6 +480,14 @@ class MainModel @Inject constructor(
it.copy(progressBarPadding = this)
}
)
is MainEvent.OnChangeProgressBarAlignment -> handleDatastoreUpdate(
key = DataStoreConstants.PROGRESS_BAR_ALIGNMENT,
value = event.value,
updateState = {
it.copy(progressBarAlignment = this.toHorizontalAlignment())
}
)
}
}

View file

@ -104,6 +104,7 @@ data class MainState(
val imagesColorEffects: ReaderColorEffects = provideDefaultValue { ReaderColorEffects.OFF },
val progressBar: Boolean = provideDefaultValue { false },
val progressBarPadding: Int = provideDefaultValue { 4 },
val progressBarAlignment: HorizontalAlignment = provideDefaultValue { HorizontalAlignment.CENTER },
// Browse Settings
val browseFilesStructure: BrowseFilesStructure = provideDefaultValue {
@ -349,6 +350,10 @@ data class MainState(
progressBarPadding = provideValue(
PROGRESS_BAR_PADDING
) { progressBarPadding },
progressBarAlignment = provideValue(
PROGRESS_BAR_ALIGNMENT, convert = { toHorizontalAlignment() }
) { progressBarAlignment },
)
}
}

View file

@ -395,6 +395,7 @@ data class ReaderScreen(val bookId: Int) : Screen, Parcelable {
progress = progress.value,
progressBar = mainState.value.progressBar,
progressBarPadding = progressBarPadding,
progressBarAlignment = mainState.value.progressBarAlignment,
paragraphHeight = paragraphHeight,
sidePadding = sidePadding,
bottomBarPadding = bottomBarPadding,

View file

@ -206,6 +206,7 @@
<string name="images_color_effects_option">Ефекти кольору</string>
<string name="progress_bar_option">Панель прогресу</string>
<string name="progress_bar_padding_option">Поля</string>
<string name="progress_bar_alignment_option">Розташування</string>
<!-- Browse -->
<string name="browse_files_structure_option">Структура файлів</string>

View file

@ -261,6 +261,7 @@
<string name="images_color_effects_option">Color effects</string>
<string name="progress_bar_option">Progress bar</string>
<string name="progress_bar_padding_option">Margins</string>
<string name="progress_bar_alignment_option">Alignment</string>
<!-- Browse -->
<string name="browse_files_structure_option">Files structure</string>