✨ Add switch to system font (#420)

app/src/main/kotlin/de/hbch/traewelling/shared/SettingsViewModel.kt

@@ -28,6 +28,9 @@ class SettingsViewModel : ViewModel() {
     private val _userSettings = MutableLiveData<UserSettings?>(null)
     val userSettings: LiveData<UserSettings?> get() = _userSettings
 
+    private val _useSystemFont = MutableLiveData(false)
+    val useSystemFont: LiveData<Boolean> get() = _useSystemFont
+
     fun loadSettings(context: Context) {
         val secureStorage = SecureStorage(context)
 
@@ -40,6 +43,9 @@ class SettingsViewModel : ViewModel() {
         _displayDivergentStop.postValue(
             secureStorage.getObject(SharedValues.SS_DISPLAY_DIVERGENT_STOP, Boolean::class.java) ?: true
         )
+        _useSystemFont.postValue(
+            secureStorage.getObject(SharedValues.SS_USE_SYSTEM_FONT, Boolean::class.java) ?: false
+        )
 
         val coroutineScope = CoroutineScope(Dispatchers.IO)
         coroutineScope.launch {
@@ -65,6 +71,12 @@ class SettingsViewModel : ViewModel() {
         _displayDivergentStop.postValue(state)
     }
 
+    fun updateUseSystemFont(context: Context, state: Boolean) {
+        val secureStorage = SecureStorage(context)
+        secureStorage.storeObject(SharedValues.SS_USE_SYSTEM_FONT, state)
+        _useSystemFont.postValue(state)
+    }
+
     suspend fun getUserSettings() {
         val settings = try {
             val response = TraewellingApi.userService.getUserSettings()

app/src/main/kotlin/de/hbch/traewelling/shared/SharedValues.kt

@@ -22,6 +22,7 @@ object SharedValues {
     const val SS_EMOJI_SHOWCASE = "DISPLAY_EMOJI_SHOWCASE"
     const val SS_EDIT_PROFILE_SHOWCASE = "EDIT_PROFILE_SHOWCASE"
     const val SS_CO_TRAVELLER_SHOWCASE = "CO_TRAVELLER_SHOWCASE"
+    const val SS_USE_SYSTEM_FONT = "USE_SYSTEM_FONT"
 
     var TRAVELYNX_TOKEN = ""
 

app/src/main/kotlin/de/hbch/traewelling/theme/TraewelldroidTheme.kt

@@ -3,18 +3,22 @@ package de.hbch.traewelling.theme
 import android.os.Build
 import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.material3.MaterialTheme
+import androidx.compose.material3.Typography
 import androidx.compose.material3.darkColorScheme
 import androidx.compose.material3.dynamicDarkColorScheme
 import androidx.compose.material3.dynamicLightColorScheme
 import androidx.compose.material3.lightColorScheme
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
 import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.remember
 import androidx.compose.runtime.staticCompositionLocalOf
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalView
 import com.google.accompanist.systemuicontroller.rememberSystemUiController
+import com.jcloquell.androidsecurestorage.SecureStorage
+import de.hbch.traewelling.shared.SharedValues
 
 private val DarkColorScheme = darkColorScheme(
     primary = TraewelldroidDark,
@@ -48,6 +52,9 @@ fun MainTheme(
     val context = LocalContext.current
     val systemUiController = rememberSystemUiController()
     val darkTheme = isSystemInDarkTheme()
+    val secureStorage = remember { SecureStorage(context) }
+    val chosenFont: Typography =
+        if (secureStorage.getObject(SharedValues.SS_USE_SYSTEM_FONT, Boolean::class.java) == true) DefaultTypography else AppTypography
 
     if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.S) {
         // Set polyline color to default primary light color
@@ -74,13 +81,18 @@ fun MainTheme(
 
     MaterialTheme(
         colorScheme = colorScheme,
-        typography = AppTypography
+        typography = chosenFont
     ) {
         CompositionLocalProvider(
             LocalColorScheme provides colorScheme,
             content = content
         )
+        CompositionLocalProvider(
+            LocalFont provides chosenFont,
+            content = content
+        )
     }
 }
 
 internal val LocalColorScheme = staticCompositionLocalOf { LightColorScheme }
+internal val LocalFont = staticCompositionLocalOf { AppTypography }

app/src/main/kotlin/de/hbch/traewelling/theme/Type.kt

@@ -10,23 +10,23 @@ val TwindexxFont = Font(R.font.ae_matrix16_twindexx_standard)
 val Raleway = FontFamily(RalewayFont)
 val Twindexx = FontFamily(TwindexxFont)
 
-private val defaultTypography = Typography()
+val DefaultTypography = Typography()
 val AppTypography = Typography(
-    displayLarge = defaultTypography.displayLarge.copy(fontFamily = Raleway),
-    displayMedium = defaultTypography.displayMedium.copy(fontFamily = Raleway),
-    displaySmall = defaultTypography.displaySmall.copy(fontFamily = Raleway),
-    headlineLarge = defaultTypography.headlineLarge.copy(fontFamily = Raleway),
-    headlineMedium = defaultTypography.headlineMedium.copy(fontFamily = Raleway),
-    headlineSmall = defaultTypography.headlineSmall.copy(fontFamily = Raleway),
-    titleLarge = defaultTypography.titleLarge.copy(fontFamily = Raleway),
-    titleMedium = defaultTypography.titleMedium.copy(fontFamily = Raleway),
-    titleSmall = defaultTypography.titleSmall.copy(fontFamily = Raleway),
-    bodyLarge = defaultTypography.bodyLarge.copy(fontFamily = Raleway),
-    bodyMedium = defaultTypography.bodyMedium.copy(fontFamily = Raleway),
-    bodySmall = defaultTypography.bodySmall.copy(fontFamily = Raleway),
-    labelLarge = defaultTypography.labelLarge.copy(fontFamily = Raleway),
-    labelMedium = defaultTypography.labelMedium.copy(fontFamily = Raleway),
-    labelSmall = defaultTypography.labelSmall.copy(fontFamily = Raleway)
+    displayLarge = DefaultTypography.displayLarge.copy(fontFamily = Raleway),
+    displayMedium = DefaultTypography.displayMedium.copy(fontFamily = Raleway),
+    displaySmall = DefaultTypography.displaySmall.copy(fontFamily = Raleway),
+    headlineLarge = DefaultTypography.headlineLarge.copy(fontFamily = Raleway),
+    headlineMedium = DefaultTypography.headlineMedium.copy(fontFamily = Raleway),
+    headlineSmall = DefaultTypography.headlineSmall.copy(fontFamily = Raleway),
+    titleLarge = DefaultTypography.titleLarge.copy(fontFamily = Raleway),
+    titleMedium = DefaultTypography.titleMedium.copy(fontFamily = Raleway),
+    titleSmall = DefaultTypography.titleSmall.copy(fontFamily = Raleway),
+    bodyLarge = DefaultTypography.bodyLarge.copy(fontFamily = Raleway),
+    bodyMedium = DefaultTypography.bodyMedium.copy(fontFamily = Raleway),
+    bodySmall = DefaultTypography.bodySmall.copy(fontFamily = Raleway),
+    labelLarge = DefaultTypography.labelLarge.copy(fontFamily = Raleway),
+    labelMedium = DefaultTypography.labelMedium.copy(fontFamily = Raleway),
+    labelSmall = DefaultTypography.labelSmall.copy(fontFamily = Raleway)
 )
 
-val LineIconStyle = defaultTypography.bodyMedium
+val LineIconStyle = DefaultTypography.bodyMedium

app/src/main/kotlin/de/hbch/traewelling/ui/checkIn/CheckIn.kt

@@ -63,8 +63,8 @@ import de.hbch.traewelling.shared.EventViewModel
 import de.hbch.traewelling.shared.LoggedInUserViewModel
 import de.hbch.traewelling.shared.MastodonEmojis
 import de.hbch.traewelling.shared.SharedValues
-import de.hbch.traewelling.theme.AppTypography
 import de.hbch.traewelling.theme.LocalColorScheme
+import de.hbch.traewelling.theme.LocalFont
 import de.hbch.traewelling.theme.MainTheme
 import de.hbch.traewelling.ui.composables.ButtonWithIconAndText
 import de.hbch.traewelling.ui.composables.DataLoading
@@ -298,7 +298,7 @@ fun CheckIn(
                                     Column {
                                         Text(
                                             text = stringResource(id = R.string.mastodon_emoji),
-                                            style = AppTypography.titleLarge,
+                                            style = LocalFont.current.titleLarge,
                                             color = LocalColorScheme.current.onPrimary
                                         )
                                         Text(
@@ -332,7 +332,7 @@ fun CheckIn(
                         Text(
                             modifier = Modifier.padding(4.dp),
                             text = "${statusText.text.count()}/280",
-                            style = AppTypography.labelSmall
+                            style = LocalFont.current.labelSmall
                         )
                         AnimatedVisibility(displayUserResults) {
                             Row(
@@ -482,7 +482,7 @@ fun CheckIn(
                                             Column {
                                                 Text(
                                                     text = stringResource(id = R.string.select_co_travellers),
-                                                    style = AppTypography.titleLarge,
+                                                    style = LocalFont.current.titleLarge,
                                                     color = LocalColorScheme.current.onPrimary
                                                 )
                                                 Text(
@@ -492,7 +492,7 @@ fun CheckIn(
                                                 Text(
                                                     text = stringResource(id = R.string.only_check_in_persons),
                                                     color = LocalColorScheme.current.onPrimary,
-                                                    style = AppTypography.labelMedium
+                                                    style = LocalFont.current.labelMedium
                                                 )
                                             }
                                         }
@@ -682,7 +682,7 @@ private fun SelectStatusVisibilityDialog(
         Text(
             modifier = Modifier.padding(bottom = 8.dp),
             text = stringResource(id = R.string.title_select_visibility),
-            style = AppTypography.titleLarge,
+            style = LocalFont.current.titleLarge,
             color = LocalColorScheme.current.primary
         )
         StatusVisibility.entries.forEach { visibility ->
@@ -702,7 +702,7 @@ private fun SelectStatusVisibilityDialog(
                 )
                 Text(
                     text = stringResource(id = visibility.title),
-                    style = AppTypography.titleLarge
+                    style = LocalFont.current.titleLarge
                 )
             }
         }
@@ -723,7 +723,7 @@ private fun SelectStatusBusinessDialog(
                 .fillMaxWidth()
                 .padding(bottom = 8.dp),
             text = stringResource(id = R.string.title_select_business),
-            style = AppTypography.titleLarge,
+            style = LocalFont.current.titleLarge,
             color = LocalColorScheme.current.primary
         )
         StatusBusiness.entries.forEach { business ->
@@ -743,7 +743,7 @@ private fun SelectStatusBusinessDialog(
                 )
                 Text(
                     text = stringResource(id = business.title),
-                    style = AppTypography.titleLarge
+                    style = LocalFont.current.titleLarge
                 )
             }
         }
@@ -768,15 +768,15 @@ private fun SelectEventDialog(
                 .fillMaxWidth()
                 .padding(bottom = 8.dp),
             text = stringResource(id = R.string.title_select_event),
-            style = AppTypography.titleLarge,
+            style = LocalFont.current.titleLarge,
             color = LocalColorScheme.current.primary
         )
         Text(
             modifier = Modifier
                 .fillMaxWidth()
                 .padding(bottom = 8.dp),
             text = stringResource(id = R.string.hint_event_missing),
-            style = AppTypography.labelLarge
+            style = LocalFont.current.labelLarge
         )
         events.forEach { event ->
             Row(
@@ -807,7 +807,7 @@ private fun SelectEventDialog(
                 ) {
                     Text(
                         text = event?.name ?: stringResource(id = R.string.reset_selection),
-                        style = AppTypography.titleLarge,
+                        style = LocalFont.current.titleLarge,
                         maxLines = 1,
                         overflow = TextOverflow.Ellipsis
                     )
@@ -821,7 +821,7 @@ private fun SelectEventDialog(
                                 getLocalDateString(event.end)
                             )
                         },
-                        style = AppTypography.titleSmall
+                        style = LocalFont.current.titleSmall
                     )
                 }
                 Icon(
@@ -913,11 +913,11 @@ fun SelectCoTravellers(
     ) {
         Text(
             text = stringResource(id = R.string.select_co_travellers),
-            style = AppTypography.titleLarge
+            style = LocalFont.current.titleLarge
         )
         Text(
             text = stringResource(id = R.string.only_check_in_persons),
-            style = AppTypography.labelMedium
+            style = LocalFont.current.labelMedium
         )
         if (isLoading) {
             DataLoading()

app/src/main/kotlin/de/hbch/traewelling/ui/checkInResult/CheckInResult.kt

@@ -37,7 +37,7 @@ import de.hbch.traewelling.providers.checkin.CheckInResult
 import de.hbch.traewelling.shared.CheckInViewModel
 import de.hbch.traewelling.shared.LoggedInUserViewModel
 import de.hbch.traewelling.shared.SharedValues
-import de.hbch.traewelling.theme.AppTypography
+import de.hbch.traewelling.theme.LocalFont
 import de.hbch.traewelling.theme.StarYellow
 import de.hbch.traewelling.ui.composables.ButtonWithIconAndText
 import de.hbch.traewelling.ui.composables.Dialog
@@ -47,7 +47,6 @@ import de.hbch.traewelling.ui.composables.SharePicDialog
 import de.hbch.traewelling.ui.include.status.StatusDetailsRow
 import de.hbch.traewelling.ui.tag.StatusTags
 import de.hbch.traewelling.util.ReviewRequest
-import de.hbch.traewelling.util.shareStatus
 
 @Composable
 fun CheckInResultView(
@@ -88,7 +87,7 @@ fun CheckInResultView(
                 Text(
                     text = "Träwelling",
                     modifier = Modifier.padding(start = 12.dp),
-                    style = AppTypography.titleLarge
+                    style = LocalFont.current.titleLarge
                 )
             }
             Text(
@@ -131,7 +130,7 @@ fun CheckInResultView(
                 Text(
                     text = "travelynx",
                     modifier = Modifier.padding(start = 12.dp),
-                    style = AppTypography.titleLarge
+                    style = LocalFont.current.titleLarge
                 )
             }
             if (travelynxResponse.result == CheckInResult.ERROR) {

app/src/main/kotlin/de/hbch/traewelling/ui/composables/Chart.kt

@@ -19,8 +19,8 @@ import androidx.compose.ui.text.drawText
 import androidx.compose.ui.text.rememberTextMeasurer
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.unit.dp
-import de.hbch.traewelling.theme.AppTypography
 import de.hbch.traewelling.theme.LocalColorScheme
+import de.hbch.traewelling.theme.LocalFont
 
 @OptIn(ExperimentalTextApi::class)
 @Composable
@@ -32,6 +32,7 @@ fun ColumnChart(
     val data = input.first
     val formatter = input.second
     val maxValue = data.maxByOrNull { it.second }?.second ?: 0
+    val typography = LocalFont.current
 
     Row(
         modifier = modifier,
@@ -63,7 +64,7 @@ fun ColumnChart(
                                 val measuredText =
                                     textMeasurer.measure(
                                         AnnotatedString(labelText),
-                                        style = AppTypography.labelLarge,
+                                        style = typography.labelLarge,
                                         maxLines = 1,
                                         overflow = TextOverflow.Ellipsis
                                     )

app/src/main/kotlin/de/hbch/traewelling/ui/composables/LineIcon.kt

@@ -26,8 +26,8 @@ import androidx.lifecycle.viewmodel.compose.viewModel
 import de.hbch.traewelling.api.models.lineIcons.LineIconShape
 import de.hbch.traewelling.shared.LineIcons
 import de.hbch.traewelling.shared.SettingsViewModel
-import de.hbch.traewelling.theme.AppTypography
 import de.hbch.traewelling.theme.LineIconStyle
+import de.hbch.traewelling.theme.LocalFont
 import de.hbch.traewelling.util.getSwitzerlandLineName
 
 @Composable
@@ -37,7 +37,7 @@ fun LineIcon(
     modifier: Modifier = Modifier,
     operatorCode: String? = null,
     lineId: String? = null,
-    defaultTextStyle: TextStyle = AppTypography.bodyMedium,
+    defaultTextStyle: TextStyle = LocalFont.current.bodyMedium,
     displayJourneyNumber: Boolean = true
 ) {
     val context = LocalContext.current
@@ -124,7 +124,7 @@ fun LineIcon(
             && journeyNumber != null && journeyNumber != 0) {
             Text(
                 text = "($journeyNumber)",
-                style = AppTypography.bodySmall
+                style = LocalFont.current.bodySmall
             )
         }
     }
@@ -136,7 +136,7 @@ fun LineIconView(
     modifier: Modifier = Modifier,
     operatorCode: String? = null,
     lineId: String? = null,
-    defaultTextStyle: TextStyle = AppTypography.bodyMedium
+    defaultTextStyle: TextStyle = LocalFont.current.bodyMedium
 ) {
     val opCode = operatorCode?.replace("nahreisezug", "") ?: ""
 

app/src/main/kotlin/de/hbch/traewelling/ui/composables/ManualDateTimeSelection.kt

@@ -31,7 +31,7 @@ import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import de.hbch.traewelling.R
-import de.hbch.traewelling.theme.AppTypography
+import de.hbch.traewelling.theme.LocalFont
 import de.hbch.traewelling.theme.MainTheme
 import de.hbch.traewelling.util.getLocalDateTimeString
 import java.time.Instant
@@ -166,7 +166,7 @@ fun DateTimeSelection(
         if (plannedDate != null) {
             Text(
                 text = stringResource(id = R.string.planned, getLocalDateTimeString(plannedDate)),
-                style = AppTypography.bodySmall
+                style = LocalFont.current.bodySmall
             )
         }
     }