VersionCode: 29

Changed WritingBoard scroll bar locate Added theme to setting options Added theme to scroll bar
Z-Siqi · Oct 28, 2023 · 15436fc · 15436fc
1 parent ac4f56b
commit 15436fc
Show file tree

Hide file tree

Showing 8 changed files with 65 additions and 32 deletions.
diff --git a/app/build.gradle b/app/build.gradle
@@ -11,7 +11,7 @@ android {
         applicationId "com.sqz.writingboard"
         minSdk 31
         targetSdk 34
-        versionCode 28
+        versionCode 29
         versionName "0.2.8"
 
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"

diff --git a/app/release/app-release.apk b/app/release/app-release.apk
diff --git a/app/release/output-metadata.json b/app/release/output-metadata.json
@@ -11,7 +11,7 @@
       "type": "SINGLE",
       "filters": [],
       "attributes": [],
-      "versionCode": 28,
+      "versionCode": 29,
       "versionName": "0.2.8",
       "outputFile": "app-release.apk"
     }

diff --git a/app/src/main/java/com/sqz/writingboard/ui/WritingBoardLayout.kt b/app/src/main/java/com/sqz/writingboard/ui/WritingBoardLayout.kt
@@ -72,7 +72,7 @@ fun WritingBoardLayout(navController: NavController, modifier: Modifier = Modifi
         else -> MaterialTheme.colorScheme.surfaceVariant
     }
     val shapeColor = when (readTheme) {
-        0 -> MaterialTheme.colorScheme.primaryContainer
+        0 -> MaterialTheme.colorScheme.secondaryContainer
         1 -> MaterialTheme.colorScheme.primary
         2 -> MaterialTheme.colorScheme.secondary
         else -> MaterialTheme.colorScheme.primary
@@ -190,13 +190,13 @@ fun WritingBoardLayout(navController: NavController, modifier: Modifier = Modifi
         ) {
             Surface(
                 color = boardColor,
-                modifier = modifier
-                    .fillMaxSize(),
+                modifier = modifier.fillMaxSize(),
                 shape = RoundedCornerShape(26.dp)
             ) {
                 Column(
                     modifier = modifier
-                        .padding(15.dp)
+                        .fillMaxSize()
+                        .padding(8.dp)
                 ) {
                     WritingBoardText()
                 }
@@ -360,7 +360,6 @@ fun WritingBoardLayout(navController: NavController, modifier: Modifier = Modifi
         KeyboardVisibilityObserver { isVisible ->
             isKeyboardVisible = isVisible
             if (isVisible) {
-                valueState.doneButton = true
                 hideModeController = true
             } else {
                 hideModeController = false

diff --git a/app/src/main/java/com/sqz/writingboard/ui/WritingBoardSetting.kt b/app/src/main/java/com/sqz/writingboard/ui/WritingBoardSetting.kt
@@ -16,6 +16,7 @@ import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.statusBars
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.foundation.lazy.rememberLazyListState
+import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
@@ -59,6 +60,13 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
     val valueState: ValueState = viewModel()
     val state = rememberLazyListState()
 
+    val cardColors = when (settingState.readSegmentedButtonState("theme", context)) {
+        0 -> CardDefaults.cardColors(containerColor = MaterialTheme.colorScheme.surfaceContainerHighest)
+        1 -> CardDefaults.cardColors(containerColor = MaterialTheme.colorScheme.primaryContainer)
+        2 -> CardDefaults.cardColors(containerColor = MaterialTheme.colorScheme.secondaryContainer)
+        else -> CardDefaults.cardColors(containerColor = MaterialTheme.colorScheme.primaryContainer)
+    }
+
     var allowMultipleLines by setting.rememberSwitchState("allow_multiple_lines", context)
     var cleanPointerFocus by setting.rememberSwitchState("clean_pointer_focus", context)
     var cleanAllText by setting.rememberSwitchState("clean_all_text", context)
@@ -89,7 +97,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
             SegmentedButtonCardLayout(
                 title = stringResource(R.string.choose_theme),
                 options = listOf(R.string.light_color, R.string.theme_default, R.string.distinct),
-                selectedOption = theme
+                selectedOption = theme,
+                colors = cardColors
             ) { index ->
                 theme = index
                 setting.writeSegmentedButtonState(
@@ -104,7 +113,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
             SegmentedButtonCardLayout(
                 title = stringResource(R.string.button_style),
                 options = listOf(R.string.button_hide, R.string.button_default),
-                selectedOption = buttonStyle
+                selectedOption = buttonStyle,
+                colors = cardColors
             ) { index ->
                 buttonStyle = index
                 setting.writeSegmentedButtonState(
@@ -130,7 +140,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                 onCheckedChange = {
                     editButton = it
                     setting.writeSwitchState("edit_button", context, it)
-                }
+                },
+                colors = cardColors
             )
         }
         item {
@@ -140,14 +151,16 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                 onCheckedChange = {
                     cleanAllText = it
                     setting.writeSwitchState("clean_all_text", context, it)
-                }
+                },
+                colors = cardColors
             )
         }
         item {
             SegmentedButtonCardLayout(
                 title = stringResource(R.string.choose_font_size),
                 options = listOf(R.string.small, R.string.medium, R.string.large),
-                selectedOption = fontSize
+                selectedOption = fontSize,
+                colors = cardColors
             ) { index ->
                 fontSize = index
                 setting.writeSegmentedButtonState(
@@ -164,7 +177,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                 onCheckedChange = {
                     italics = it
                     setting.writeSwitchState("italics", context, it)
-                }
+                },
+                colors = cardColors
             )
         }
         item {
@@ -176,7 +190,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                     R.string.serif,
                     R.string.cursive,
                 ),
-                selectedOption = fontStyle
+                selectedOption = fontStyle,
+                colors = cardColors
             ) { index ->
                 fontStyle = index
                 setting.writeSegmentedButtonState(
@@ -202,7 +217,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                 onCheckedChange = {
                     cleanPointerFocus = it
                     setting.writeSwitchState("clean_pointer_focus", context, it)
-                }
+                },
+                colors = cardColors
             )
         }
         item {
@@ -212,7 +228,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                 onCheckedChange = {
                     allowMultipleLines = it
                     setting.writeSwitchState("allow_multiple_lines", context, it)
-                }
+                },
+                colors = cardColors
             )
         }
         item {
@@ -233,7 +250,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                 },
                 text = stringResource(R.string.language),
                 painter = R.drawable.ic_language,
-                contentDescription = "Language"
+                contentDescription = "Language",
+                colors = cardColors
             )
         }
         item {
@@ -247,7 +265,8 @@ fun SettingFunction(modifier: Modifier = Modifier, context: Context) {
                 },
                 text = stringResource(R.string.about),
                 painter = R.drawable.github_mark,
-                contentDescription = "About"
+                contentDescription = "About",
+                colors = cardColors
             )
         }
     }
@@ -261,7 +280,8 @@ fun WritingBoardSetting(
     context: Context
 ) {
     val valueState: ValueState = viewModel()
-    val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior(rememberTopAppBarState())
+    val scrollBehavior =
+        TopAppBarDefaults.exitUntilCollapsedScrollBehavior(rememberTopAppBarState())
 
     val themeColorSetting = settingState.readSegmentedButtonState("theme", context)
     val scrolledContainerColor = when (themeColorSetting) {

diff --git a/app/src/main/java/com/sqz/writingboard/ui/WritingBoardText.kt b/app/src/main/java/com/sqz/writingboard/ui/WritingBoardText.kt
@@ -6,6 +6,7 @@ import android.os.Looper
 import android.util.Log
 import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.text.BasicText
 import androidx.compose.foundation.text2.BasicTextField2
@@ -26,6 +27,7 @@ import androidx.compose.ui.text.font.FontFamily
 import androidx.compose.ui.text.font.FontStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.text.input.TextFieldValue
+import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
 import androidx.core.os.postDelayed
 import androidx.datastore.preferences.core.edit
@@ -169,7 +171,8 @@ fun WritingBoardText(modifier: Modifier = Modifier) {
             modifier = modifier
                 .fillMaxSize()
                 .drawVerticalScrollbar(scrollState)
-                .verticalScroll(scrollState),
+                .verticalScroll(scrollState)
+                .padding(8.dp),
             style = TextStyle.Default.copy(
                 fontSize = fontSize,
                 fontWeight = FontWeight.SemiBold,
@@ -186,15 +189,16 @@ fun WritingBoardText(modifier: Modifier = Modifier) {
                 viewModel.textState = TextFieldValue(newText)
                 autoSave = true
             },
+            scrollState = scrollState,
             modifier = modifier
                 .fillMaxSize()
                 .drawVerticalScrollbar(scrollState)
+                .padding(8.dp)
                 .onFocusEvent { focusState ->
                     if (focusState.isFocused) {
                         valueState.doneButton = true
                     }
                 },
-            scrollState = scrollState,
             textStyle = TextStyle.Default.copy(
                 fontSize = fontSize,
                 fontWeight = FontWeight.SemiBold,

diff --git a/app/src/main/java/com/sqz/writingboard/ui/component/LayoutComponent.kt b/app/src/main/java/com/sqz/writingboard/ui/component/LayoutComponent.kt
@@ -18,7 +18,7 @@ import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Done
 import androidx.compose.material3.Button
 import androidx.compose.material3.Card
-import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.CardColors
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.Icon
 import androidx.compose.material3.MaterialTheme
@@ -86,12 +86,11 @@ fun SegmentedButtonCardLayout(
     title: String,
     options: List<Int>,
     selectedOption: Int,
+    colors: CardColors,
     onOptionSelected: (Int) -> Unit
 ) {
     Card(
-        colors = CardDefaults.cardColors(
-            containerColor = MaterialTheme.colorScheme.primaryContainer,
-        ),
+        colors = colors,
         border = BorderStroke(2.dp, MaterialTheme.colorScheme.primary),
         modifier = modifier
             .fillMaxWidth()
@@ -148,12 +147,11 @@ fun CardLayout(
     text: String,
     checked: Boolean,
     onCheckedChange: (Boolean) -> Unit,
+    colors: CardColors,
     modifier: Modifier = Modifier
 ) {
     Card(
-        colors = CardDefaults.cardColors(
-            containerColor = MaterialTheme.colorScheme.primaryContainer,
-        ),
+        colors = colors,
         border = BorderStroke(2.dp, MaterialTheme.colorScheme.primary),
         modifier = Modifier
             .fillMaxWidth()
@@ -190,12 +188,11 @@ fun ClickCardLayout(
     text: String,
     painter: Int,
     contentDescription: String,
+    colors: CardColors,
     modifier: Modifier = Modifier,
 ) {
     Card(
-        colors = CardDefaults.cardColors(
-            containerColor = MaterialTheme.colorScheme.primaryContainer,
-        ),
+        colors = colors,
         border = BorderStroke(2.dp, MaterialTheme.colorScheme.primary),
         modifier = Modifier
             .fillMaxWidth()

diff --git a/app/src/main/java/com/sqz/writingboard/ui/component/Scrollbar.kt b/app/src/main/java/com/sqz/writingboard/ui/component/Scrollbar.kt
@@ -56,11 +56,13 @@ import androidx.compose.ui.graphics.drawscope.DrawScope
 import androidx.compose.ui.input.nestedscroll.NestedScrollConnection
 import androidx.compose.ui.input.nestedscroll.NestedScrollSource
 import androidx.compose.ui.input.nestedscroll.nestedScroll
+import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.LayoutDirection
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.util.fastSumBy
+import com.sqz.writingboard.settingState
 import kotlinx.coroutines.channels.BufferOverflow
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.flow.MutableSharedFlow
@@ -251,7 +253,18 @@ private fun Modifier.drawScrollbar(
 }
 
 private val barColor: Color
-    @Composable get() = MaterialTheme.colorScheme.surfaceTint.copy(alpha = 0.5f)
+    @Composable get() = colors().copy(alpha = 0.5f)
+
+@Composable
+fun colors(): Color {
+    val context = LocalContext.current
+    return when (settingState.readSegmentedButtonState("theme", context)){
+        0 -> MaterialTheme.colorScheme.secondary
+        1 -> MaterialTheme.colorScheme.surfaceTint
+        2 -> MaterialTheme.colorScheme.primary
+        else -> MaterialTheme.colorScheme.onSurfaceVariant
+    }
+}
 
 private val thickness = 4.dp
 private val fadeOutAnimationSpec =