Added UI compact mode

This commit is contained in:
Abdelilah El Aissaoui 2024-05-15 10:40:37 +02:00
parent f10f1f32d8
commit 8f1f87feca
No known key found for this signature in database
GPG Key ID: 7587FC860F594869
10 changed files with 115 additions and 17 deletions

View File

@ -54,6 +54,7 @@ private const val TAG = "App"
val LocalTabScope = compositionLocalOf { emptyTabInformation() }
class App {
private val appComponent = DaggerAppComponent.create()
@ -116,6 +117,7 @@ class App {
val theme by appSettingsRepository.themeState.collectAsState()
val customTheme by appSettingsRepository.customThemeFlow.collectAsState()
val scale by appSettingsRepository.scaleUiFlow.collectAsState()
val linesHeightType by appSettingsRepository.linesHeightTypeState.collectAsState()
val windowState = rememberWindowState(
placement = windowPlacement,
@ -147,6 +149,7 @@ class App {
AppTheme(
selectedTheme = theme,
customTheme = customTheme,
linesHeightType = linesHeightType,
) {
Box(modifier = Modifier.background(MaterialTheme.colors.background)) {
AppTabs()

View File

@ -5,6 +5,7 @@ import com.jetpackduba.gitnuro.preferences.WindowsPlacementPreference
import com.jetpackduba.gitnuro.system.OS
import com.jetpackduba.gitnuro.system.currentOs
import com.jetpackduba.gitnuro.theme.ColorsScheme
import com.jetpackduba.gitnuro.theme.LinesHeightType
import com.jetpackduba.gitnuro.theme.Theme
import com.jetpackduba.gitnuro.ui.dialogs.settings.ProxyType
import com.jetpackduba.gitnuro.viewmodels.TextDiffType
@ -23,6 +24,7 @@ private const val PREF_LATEST_REPOSITORIES_TABS_OPENED = "latestRepositoriesTabs
private const val PREF_LATEST_REPOSITORY_TAB_SELECTED = "latestRepositoryTabSelected"
private const val PREF_LAST_OPENED_REPOSITORIES_PATH = "lastOpenedRepositoriesList"
private const val PREF_THEME = "theme"
private const val PREF_LINE_HEIGHT_TYPE = "linesHeight"
private const val PREF_COMMITS_LIMIT = "commitsLimit"
private const val PREF_COMMITS_LIMIT_ENABLED = "commitsLimitEnabled"
private const val PREF_WINDOW_PLACEMENT = "windowsPlacement"
@ -64,6 +66,9 @@ class AppSettingsRepository @Inject constructor() {
private val _themeState = MutableStateFlow(theme)
val themeState = _themeState.asStateFlow()
private val _linesHeightTypeState = MutableStateFlow(linesHeightType)
val linesHeightTypeState = _linesHeightTypeState.asStateFlow()
private val _commitsLimitEnabledFlow = MutableStateFlow(commitsLimitEnabled)
val commitsLimitEnabledFlow = _commitsLimitEnabledFlow.asStateFlow()
@ -153,6 +158,21 @@ class AppSettingsRepository @Inject constructor() {
_themeState.value = value
}
var linesHeightType: LinesHeightType
get() {
val lineHeightTypeValue = preferences.getInt(PREF_LINE_HEIGHT_TYPE, LinesHeightType.NORMAL.value)
return try {
LinesHeightType.fromInt(lineHeightTypeValue)
} catch (ex: Exception) {
ex.printStackTrace()
LinesHeightType.NORMAL
}
}
set(value) {
preferences.putInt(PREF_LINE_HEIGHT_TYPE, value.value)
_linesHeightTypeState.value = value
}
var commitsLimitEnabled: Boolean
get() {
return preferences.getBoolean(PREF_COMMITS_LIMIT_ENABLED, DEFAULT_COMMITS_LIMIT_ENABLED)

View File

@ -4,16 +4,47 @@ package com.jetpackduba.gitnuro.theme
import androidx.compose.material.Colors
import androidx.compose.material.MaterialTheme
import androidx.compose.runtime.Composable
import androidx.compose.runtime.*
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.ui.dropdowns.DropDownOption
private val defaultAppTheme: ColorsScheme = darkBlueTheme
private var appTheme: ColorsScheme = defaultAppTheme
internal val LocalLinesHeight = compositionLocalOf { normalLineHeight }
class LinesHeight internal constructor(
val fileHeight: Dp,
val logCommitHeight: Dp,
val sidePanelItemHeight: Dp,
)
val normalLineHeight = LinesHeight(
fileHeight = 40.dp,
logCommitHeight = 38.dp,
sidePanelItemHeight = 36.dp
)
val compactLineHeight = LinesHeight(
fileHeight = 34.dp,
logCommitHeight = 34.dp,
sidePanelItemHeight = 34.dp
)
enum class LinesHeightType(val value: Int) {
NORMAL(0),
COMPACT(1);
companion object {
fun fromInt(value: Int) = entries.first { it.value == value }
}
}
@Composable
fun AppTheme(
selectedTheme: Theme = Theme.DARK,
linesHeightType: LinesHeightType = LinesHeightType.NORMAL,
customTheme: ColorsScheme?,
content: @Composable() () -> Unit
) {
@ -24,8 +55,17 @@ fun AppTheme(
Theme.CUSTOM -> customTheme ?: defaultAppTheme
}
val lineHeight = when (linesHeightType) {
LinesHeightType.NORMAL -> normalLineHeight
LinesHeightType.COMPACT -> compactLineHeight
}
appTheme = theme
val composeColors = theme.toComposeColors()
val compositionValues = arrayOf(LocalLinesHeight provides lineHeight)
CompositionLocalProvider(values = compositionValues) {
MaterialTheme(
colors = composeColors,
content = content,
@ -33,6 +73,13 @@ fun AppTheme(
)
}
}
val MaterialTheme.linesHeight: LinesHeight
@Composable
@ReadOnlyComposable
get() = LocalLinesHeight.current
val Colors.backgroundSelected: Color
get() = appTheme.backgroundSelected

View File

@ -24,6 +24,8 @@ import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.AppIcons
import com.jetpackduba.gitnuro.extensions.*
import com.jetpackduba.gitnuro.git.DiffEntryType
import com.jetpackduba.gitnuro.theme.backgroundSelected
import com.jetpackduba.gitnuro.theme.linesHeight
import com.jetpackduba.gitnuro.theme.onBackgroundSecondary
import com.jetpackduba.gitnuro.theme.tertiarySurface
import com.jetpackduba.gitnuro.ui.components.*

View File

@ -24,6 +24,7 @@ import com.jetpackduba.gitnuro.extensions.backgroundIf
import com.jetpackduba.gitnuro.extensions.handMouseClickable
import com.jetpackduba.gitnuro.extensions.onDoubleClick
import com.jetpackduba.gitnuro.theme.backgroundSelected
import com.jetpackduba.gitnuro.theme.linesHeight
import com.jetpackduba.gitnuro.theme.onBackgroundSecondary
import com.jetpackduba.gitnuro.ui.context_menu.ContextMenu
import com.jetpackduba.gitnuro.ui.context_menu.ContextMenuElement
@ -87,7 +88,7 @@ fun FileEntry(
) {
Row(
modifier = Modifier
.height(40.dp)
.height(MaterialTheme.linesHeight.fileHeight)
.fillMaxWidth()
.backgroundIf(isSelected, MaterialTheme.colors.backgroundSelected)
.padding(start = (TREE_START_PADDING * depth).dp),

View File

@ -19,6 +19,7 @@ import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.AppIcons
import com.jetpackduba.gitnuro.extensions.handMouseClickable
import com.jetpackduba.gitnuro.theme.linesHeight
import com.jetpackduba.gitnuro.theme.onBackgroundSecondary
@ -36,7 +37,7 @@ fun SideMenuHeader(
Row(
modifier = Modifier
.height(36.dp)
.height(MaterialTheme.linesHeight.sidePanelItemHeight)
.fillMaxWidth()
.hoverable(hoverInteraction)
.handMouseClickable { onExpand() },

View File

@ -19,10 +19,9 @@ import androidx.compose.ui.unit.dp
import com.jetpackduba.gitnuro.extensions.backgroundIf
import com.jetpackduba.gitnuro.extensions.onDoubleClick
import com.jetpackduba.gitnuro.theme.backgroundSelected
import com.jetpackduba.gitnuro.theme.linesHeight
const val ENTRY_HEIGHT = 36
@OptIn(ExperimentalFoundationApi::class)
@Composable
fun SideMenuSubentry(
@ -37,7 +36,7 @@ fun SideMenuSubentry(
) {
Row(
modifier = Modifier
.height(ENTRY_HEIGHT.dp)
.height(MaterialTheme.linesHeight.sidePanelItemHeight)
.fillMaxWidth()
.clickable { onClick() }
.run {

View File

@ -426,9 +426,15 @@ private fun Layout(settingsViewModel: SettingsViewModel) {
)
}
val linesHeightTypesList = listOf(
DropDownOption(LinesHeightType.NORMAL, "Normal"),
DropDownOption(LinesHeightType.COMPACT, "Compact"),
)
@Composable
private fun Appearance(settingsViewModel: SettingsViewModel) {
val currentTheme by settingsViewModel.themeState.collectAsState()
val currentLinesHeightType by settingsViewModel.linesHeightTypeState.collectAsState()
val (errorToDisplay, setErrorToDisplay) = remember { mutableStateOf<Error?>(null) }
SettingDropDown(
@ -462,6 +468,16 @@ private fun Appearance(settingsViewModel: SettingsViewModel) {
)
}
SettingDropDown(
title = "Lists spacing",
subtitle = "Spacing around lists items",
dropDownOptions = linesHeightTypesList,
currentOption = linesHeightTypesList.first { it.value == currentLinesHeightType },
onOptionSelected = { dropDown ->
settingsViewModel.linesHeightType = dropDown.value
}
)
val density = LocalDensity.current.density
var options by remember {
mutableStateOf(

View File

@ -90,7 +90,6 @@ private const val MARGIN_GRAPH_LANES = 2
private const val LANE_WIDTH = 30f
private const val DIVIDER_WIDTH = 8
private const val LINE_HEIGHT = 36
private const val LOG_BOTTOM_PADDING = 80
// TODO Min size for message column
@ -476,7 +475,7 @@ fun CommitsList(
) {
item {
Box(
modifier = Modifier.height(LINE_HEIGHT.dp)
modifier = Modifier.height(MaterialTheme.linesHeight.logCommitHeight)
.clipToBounds()
.fillMaxWidth()
.clickable { logViewModel.selectUncommittedChanges() }
@ -527,7 +526,7 @@ fun CommitsList(
Box(
modifier = Modifier
.padding(start = graphWidth + 24.dp)
.height(LINE_HEIGHT.dp),
.height(MaterialTheme.linesHeight.logCommitHeight),
contentAlignment = Alignment.CenterStart,
) {
Text(
@ -658,7 +657,7 @@ fun UncommittedChangesLine(
) {
Row(
modifier = Modifier
.height(LINE_HEIGHT.dp)
.height(MaterialTheme.linesHeight.logCommitHeight)
.padding(start = graphWidth)
.backgroundIf(isSelected, MaterialTheme.colors.backgroundSelected)
.padding(DIVIDER_WIDTH.dp),
@ -796,6 +795,7 @@ private fun CommitLine(
) {
Box(
modifier = Modifier
.height(MaterialTheme.linesHeight.logCommitHeight)
.clickable { onRevCommitSelected() }
) {
val nodeColor = colors[graphNode.lane.position % colors.size]
@ -804,7 +804,7 @@ private fun CommitLine(
Row(
modifier = Modifier
.clipToBounds()
.height(LINE_HEIGHT.dp)
.fillMaxHeight()
.fillMaxWidth()
.offset(-horizontalScrollState.value.dp)
) {
@ -821,7 +821,7 @@ private fun CommitLine(
Box(
modifier = Modifier
.padding(start = graphWidth)
.height(LINE_HEIGHT.dp)
.fillMaxHeight()
.background(MaterialTheme.colors.background)
.backgroundIf(isSelected, MaterialTheme.colors.backgroundSelected)
) {

View File

@ -9,6 +9,7 @@ import com.jetpackduba.gitnuro.managers.newErrorNow
import com.jetpackduba.gitnuro.repositories.AppSettingsRepository
import com.jetpackduba.gitnuro.system.OpenFilePickerUseCase
import com.jetpackduba.gitnuro.system.PickerType
import com.jetpackduba.gitnuro.theme.LinesHeightType
import com.jetpackduba.gitnuro.theme.Theme
import com.jetpackduba.gitnuro.ui.dialogs.settings.ProxyType
import kotlinx.coroutines.CoroutineScope
@ -29,7 +30,9 @@ class SettingsViewModel @Inject constructor(
// Temporary values to detect changed variables
var commitsLimit: Int = -1
val themeState = appSettingsRepository.themeState
val linesHeightTypeState = appSettingsRepository.linesHeightTypeState
val ffMergeFlow = appSettingsRepository.ffMergeFlow
val pullRebaseFlow = appSettingsRepository.pullRebaseFlow
val pushWithLeaseFlow = appSettingsRepository.pushWithLeaseFlow
@ -93,6 +96,12 @@ class SettingsViewModel @Inject constructor(
appSettingsRepository.theme = value
}
var linesHeightType: LinesHeightType
get() = appSettingsRepository.linesHeightType
set(value) {
appSettingsRepository.linesHeightType = value
}
var terminalPath: String
get() = appSettingsRepository.terminalPath
set(value) {