Fixed known issues & Push beta apk

[Fixed UI may be obscured in landscape mode] [Optimize task history top bar design] [Push 0.2.0-Beta03 apk]
Z-Siqi · Oct 19, 2024 · 3123fa3 · 3123fa3
1 parent 66f7851
commit 3123fa3
Show file tree

Hide file tree

Showing 11 changed files with 154 additions and 95 deletions.
diff --git a/app/build.gradle.kts b/app/build.gradle.kts
@@ -13,7 +13,7 @@ android {
         minSdk = 26
         targetSdk = 35
         versionCode = 10
-        versionName = "0.2.0-Beta02-Build_CI"
+        versionName = "0.2.0-Beta03-Build_CI"
 
         testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
         vectorDrawables {

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
@@ -12,7 +12,7 @@
       "filters": [],
       "attributes": [],
       "versionCode": 10,
-      "versionName": "0.2.0-Beta02",
+      "versionName": "0.2.0-Beta03",
       "outputFile": "app-release.apk"
     }
   ],

diff --git a/app/src/main/java/com/sqz/checklist/MainActivity.kt b/app/src/main/java/com/sqz/checklist/MainActivity.kt
@@ -42,7 +42,7 @@ class MainActivity : ComponentActivity() {
             val navigationBars = WindowInsets.navigationBars.toString()
             try {
                 getNavHeight = navigationBars.replace("0", "").replace(Regex("\\D"), "").toInt()
-            } catch (e: Exception) {
+            } catch (e: NumberFormatException) {
                 val report =
                     "Report this error to developer, if this log happened frequently, especially when not rotate the screen."
                 Log.w("MainActivity", "Failed to get navigation bar height. $report")

diff --git a/app/src/main/java/com/sqz/checklist/ui/main/NavBarLayout.kt b/app/src/main/java/com/sqz/checklist/ui/main/NavBarLayout.kt
@@ -5,12 +5,16 @@ import android.util.Log
 import androidx.compose.foundation.BasicTooltipBox
 import androidx.compose.foundation.BasicTooltipState
 import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.background
 import androidx.compose.foundation.isSystemInDarkTheme
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.displayCutout
+import androidx.compose.foundation.layout.fillMaxHeight
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.heightIn
 import androidx.compose.foundation.layout.navigationBars
@@ -37,6 +41,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.shadow
 import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
@@ -168,54 +173,62 @@ private fun NavRailBar(
     onNavClick: (index: MainLayoutNav) -> Unit,
     modifier: Modifier = Modifier
 ) {
-    NavigationRail(
-        modifier = modifier,
-        containerColor = MaterialTheme.colorScheme.primaryContainer,
-        contentColor = MaterialTheme.colorScheme.onPrimaryContainer
-    ) {
-        Spacer(modifier = modifier.weight(0.5f))
-        items().forEachIndexed { index, item ->
-            NavigationRailItem(
-                modifier = modifier.weight(1f),
-                colors = NavigationRailItemDefaults.colors(
-                    indicatorColor = MaterialTheme.colorScheme.inversePrimary,
-                    selectedIconColor = MaterialTheme.colorScheme.inverseSurface,
-                    disabledIconColor = MaterialTheme.colorScheme.primary
-                ),
-                icon = {
-                    Icon(
-                        painter = painterResource(id = item.icon),
-                        contentDescription = item.text,
-                        modifier = modifier.size(24.dp, 24.dp)
-                    )
-                },
-                label = { Text(item.text) },
-                selected = selected(selectedInNav(index)),
-                onClick = { onNavClick(selectedInNav(index)) }
-            )
-        }
-        Spacer(modifier = modifier.weight(0.5f))
-        HorizontalDivider(
-            modifier = modifier.width(50.dp), color = if (isSystemInDarkTheme()) {
-                MaterialTheme.colorScheme.onSurface
-            } else DividerDefaults.color
-        )
-        Column(modifier = modifier.weight(1f), verticalArrangement = Arrangement.Center) {
-            BasicTooltipBox(
-                positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider(),
-                tooltip = extendedButtonData.tooltipContent,
-                state = extendedButtonData.tooltipState
-            ) {
+    val right = WindowInsets.displayCutout.asPaddingValues()
+        .calculateRightPadding(LocalLayoutDirection.current)
+    val safeWidthForFullscreen =
+        if (Build.VERSION.SDK_INT > Build.VERSION_CODES.UPSIDE_DOWN_CAKE) modifier.width(right) else modifier
+    val bgColor = MaterialTheme.colorScheme.primaryContainer
+    Row {
+        NavigationRail(
+            modifier = modifier,
+            containerColor = bgColor,
+            contentColor = MaterialTheme.colorScheme.onPrimaryContainer
+        ) {
+            Spacer(modifier = modifier.weight(0.5f))
+            items().forEachIndexed { index, item ->
                 NavigationRailItem(
-                    modifier = modifier,
-                    colors = NavigationRailItemDefaults.colors(MaterialTheme.colorScheme.primary),
-                    icon = extendedButtonData.icon,
-                    label = extendedButtonData.label,
-                    selected = false,
-                    onClick = extendedButtonData.onClick
+                    modifier = modifier.weight(1f),
+                    colors = NavigationRailItemDefaults.colors(
+                        indicatorColor = MaterialTheme.colorScheme.inversePrimary,
+                        selectedIconColor = MaterialTheme.colorScheme.inverseSurface,
+                        disabledIconColor = MaterialTheme.colorScheme.primary
+                    ),
+                    icon = {
+                        Icon(
+                            painter = painterResource(id = item.icon),
+                            contentDescription = item.text,
+                            modifier = modifier.size(24.dp, 24.dp)
+                        )
+                    },
+                    label = { Text(item.text) },
+                    selected = selected(selectedInNav(index)),
+                    onClick = { onNavClick(selectedInNav(index)) }
                 )
             }
+            Spacer(modifier = modifier.weight(0.5f))
+            HorizontalDivider(
+                modifier = modifier.width(50.dp), color = if (isSystemInDarkTheme()) {
+                    MaterialTheme.colorScheme.onSurface
+                } else DividerDefaults.color
+            )
+            Column(modifier = modifier.weight(1f), verticalArrangement = Arrangement.Center) {
+                BasicTooltipBox(
+                    positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider(),
+                    tooltip = extendedButtonData.tooltipContent,
+                    state = extendedButtonData.tooltipState
+                ) {
+                    NavigationRailItem(
+                        modifier = modifier,
+                        colors = NavigationRailItemDefaults.colors(MaterialTheme.colorScheme.primary),
+                        icon = extendedButtonData.icon,
+                        label = extendedButtonData.label,
+                        selected = false,
+                        onClick = extendedButtonData.onClick
+                    )
+                }
+            }
         }
+        Spacer(modifier = safeWidthForFullscreen.fillMaxHeight() then modifier.background(bgColor))
     }
 }
 

diff --git a/app/src/main/java/com/sqz/checklist/ui/main/task/history/TaskHistory.kt b/app/src/main/java/com/sqz/checklist/ui/main/task/history/TaskHistory.kt
@@ -1,6 +1,5 @@
 package com.sqz.checklist.ui.main.task.history
 
-import android.os.Build
 import android.view.SoundEffectConstants
 import android.view.View
 import androidx.compose.animation.animateContentSize
@@ -13,6 +12,9 @@ import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.displayCutout
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@@ -35,6 +37,7 @@ import androidx.compose.runtime.setValue
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalConfiguration
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
@@ -68,9 +71,13 @@ fun TaskHistory(
     val view = LocalView.current
     val localConfig = LocalConfiguration.current
     val screenIsWidth = localConfig.screenWidthDp > localConfig.screenHeightDp * 1.2
+    val left = WindowInsets.displayCutout.asPaddingValues()
+        .calculateLeftPadding(LocalLayoutDirection.current)
     val safePaddingForFullscreen = if (
-        Build.VERSION.SDK_INT > Build.VERSION_CODES.UPSIDE_DOWN_CAKE && screenIsWidth
-    ) modifier.padding(start = 22.dp, end = 10.dp) else modifier
+        screenIsWidth
+    ) modifier.padding(
+        start = left, end = if (left / 3 > 15.dp) 15.dp else left / 3
+    ) else modifier
     Surface(
         modifier = modifier,
         color = MaterialTheme.colorScheme.surfaceContainer

diff --git a/app/src/main/java/com/sqz/checklist/ui/main/task/history/TaskHistoryNavBar.kt b/app/src/main/java/com/sqz/checklist/ui/main/task/history/TaskHistoryNavBar.kt
@@ -1,9 +1,17 @@
 package com.sqz.checklist.ui.main.task.history
 
+import android.os.Build
 import android.util.Log
 import android.view.SoundEffectConstants
 import android.view.View
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.displayCutout
+import androidx.compose.foundation.layout.fillMaxHeight
+import androidx.compose.foundation.layout.width
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Delete
 import androidx.compose.material.icons.filled.Refresh
@@ -25,6 +33,7 @@ import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.res.stringResource
 import com.sqz.checklist.R
 import com.sqz.checklist.ui.main.NavMode
@@ -101,7 +110,7 @@ private fun NavigationSelector(
     selected: Boolean, deleteClick: () -> Unit, redoClick: () -> Unit,
     view: View, modifier: Modifier = Modifier,
 ) {
-    val colors = TaskHistoryColors (
+    val colors = TaskHistoryColors(
         containerColor = MaterialTheme.colorScheme.primaryContainer,
         contentColor = MaterialTheme.colorScheme.onPrimaryContainer,
         indicatorColor = MaterialTheme.colorScheme.inversePrimary,
@@ -172,39 +181,47 @@ private fun NavRailBar(
     view: View,
     modifier: Modifier = Modifier,
 ) {
+    val right = WindowInsets.displayCutout.asPaddingValues()
+        .calculateRightPadding(LocalLayoutDirection.current)
+    val safeWidthForFullscreen =
+        if (Build.VERSION.SDK_INT > Build.VERSION_CODES.UPSIDE_DOWN_CAKE) modifier.width(right) else modifier
+    val bgColor = colors.containerColor
     val buttonColors = NavigationRailItemDefaults.colors(
         indicatorColor = colors.indicatorColor,
         selectedIconColor = colors.selectedIconColor,
         disabledIconColor = colors.disabledIconColor
     )
-    NavigationRail(
-        containerColor = colors.containerColor, contentColor = colors.contentColor,
-        modifier = modifier
-    ) {
-        Spacer(modifier = modifier.weight(0.58f))
-        val deleteText = stringResource(R.string.delete)
-        NavigationRailItem(
-            colors = buttonColors,
-            icon = { Icon(imageVector = Icons.Filled.Delete, contentDescription = deleteText) },
-            label = { Text(text = deleteText) },
-            selected = selected,
-            onClick = {
-                deleteClick()
-                view.playSoundEffect(SoundEffectConstants.CLICK)
-            }
-        )
-        Spacer(modifier = modifier.weight(0.5f))
-        val redoText = stringResource(R.string.redo)
-        NavigationRailItem(
-            colors = buttonColors,
-            icon = { Icon(imageVector = Icons.Filled.Refresh, contentDescription = redoText) },
-            label = { Text(text = redoText) },
-            selected = selected,
-            onClick = {
-                redoClick()
-                view.playSoundEffect(SoundEffectConstants.CLICK)
-            }
-        )
-        Spacer(modifier = modifier.weight(0.5f))
+    Row {
+        NavigationRail(
+            containerColor = colors.containerColor, contentColor = colors.contentColor,
+            modifier = modifier
+        ) {
+            Spacer(modifier = modifier.weight(0.58f))
+            val deleteText = stringResource(R.string.delete)
+            NavigationRailItem(
+                colors = buttonColors,
+                icon = { Icon(imageVector = Icons.Filled.Delete, contentDescription = deleteText) },
+                label = { Text(text = deleteText) },
+                selected = selected,
+                onClick = {
+                    deleteClick()
+                    view.playSoundEffect(SoundEffectConstants.CLICK)
+                }
+            )
+            Spacer(modifier = modifier.weight(0.5f))
+            val redoText = stringResource(R.string.redo)
+            NavigationRailItem(
+                colors = buttonColors,
+                icon = { Icon(imageVector = Icons.Filled.Refresh, contentDescription = redoText) },
+                label = { Text(text = redoText) },
+                selected = selected,
+                onClick = {
+                    redoClick()
+                    view.playSoundEffect(SoundEffectConstants.CLICK)
+                }
+            )
+            Spacer(modifier = modifier.weight(0.5f))
+        }
+        Spacer(modifier = safeWidthForFullscreen.fillMaxHeight() then modifier.background(bgColor))
     }
 }
diff --git a/app/src/main/java/com/sqz/checklist/ui/main/task/history/TaskHistoryTopBar.kt b/app/src/main/java/com/sqz/checklist/ui/main/task/history/TaskHistoryTopBar.kt
@@ -9,8 +9,11 @@ import androidx.compose.material3.TopAppBar
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.shadow
+import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.unit.dp
 import com.sqz.checklist.R
 import com.sqz.checklist.ui.material.TextTooltipBox
 
@@ -20,13 +23,18 @@ fun HistoryTopBar(
     onClick: () -> Unit,
     modifier: Modifier = Modifier
 ) {
+    val localConfig = LocalConfiguration.current
+    val screenIsWidth = localConfig.screenWidthDp > localConfig.screenHeightDp * 1.2
     TopAppBar(
         colors = TopAppBarDefaults.topAppBarColors(
-            containerColor = MaterialTheme.colorScheme.primaryContainer,
+            containerColor = if (screenIsWidth) MaterialTheme.colorScheme.secondaryContainer else MaterialTheme.colorScheme.primaryContainer,
             titleContentColor = MaterialTheme.colorScheme.primary,
         ),
         title = { Text(text = stringResource(R.string.task_history)) },
-        modifier = modifier,
+        modifier = modifier.shadow(
+            elevation = 1.dp,
+            ambientColor = MaterialTheme.colorScheme.primaryContainer
+        ),
         navigationIcon = {
             TextTooltipBox(
                 textRid = R.string.back,

diff --git a/app/src/main/java/com/sqz/checklist/ui/main/task/layout/TaskLayout.kt b/app/src/main/java/com/sqz/checklist/ui/main/task/layout/TaskLayout.kt
@@ -9,6 +9,9 @@ import androidx.compose.foundation.horizontalScroll
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.WindowInsets
+import androidx.compose.foundation.layout.asPaddingValues
+import androidx.compose.foundation.layout.displayCutout
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
@@ -46,6 +49,7 @@ import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.platform.LocalLayoutDirection
 import androidx.compose.ui.platform.LocalView
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
@@ -97,9 +101,13 @@ fun TaskLayout(
     ) {
         val localConfig = LocalConfiguration.current
         val screenIsWidth = localConfig.screenWidthDp > localConfig.screenHeightDp * 1.2
+        val left = WindowInsets.displayCutout.asPaddingValues()
+            .calculateLeftPadding(LocalLayoutDirection.current)
         val safePaddingForFullscreen = if (
             Build.VERSION.SDK_INT > Build.VERSION_CODES.UPSIDE_DOWN_CAKE && screenIsWidth
-        ) modifier.padding(start = 23.dp, end = 10.dp) else modifier
+        ) modifier.padding(
+            start = left, end = if (left / 3 > 15.dp) 15.dp else left / 3
+        ) else modifier
         LazyList( // LazyColumn lists
             listState = listState,
             lazyState = lazyState,
@@ -206,7 +214,7 @@ private fun taskSearchBar(
         ) {
             Row(verticalAlignment = Alignment.CenterVertically) {
                 Icon(
-                    modifier = modifier.padding(start =  10.dp),
+                    modifier = modifier.padding(start = 10.dp),
                     imageVector = Icons.Filled.Search,
                     contentDescription = stringResource(id = R.string.search)
                 )