refactor: bump material3 lib and use segmented buttons for button gro…

…up preferences
you-apps · Apr 15, 2024 · ce08cd1 · ce08cd1
1 parent a39ca3a
commit ce08cd1
Show file tree

Hide file tree

Showing 6 changed files with 52 additions and 70 deletions.
diff --git a/app/build.gradle.kts b/app/build.gradle.kts
@@ -6,7 +6,7 @@ plugins {
 
 android {
     namespace = "com.bnyro.contacts"
-    compileSdk = 33
+    compileSdk = 34
 
     androidResources {
         generateLocaleConfig = true
@@ -78,7 +78,7 @@ dependencies {
     implementation("androidx.activity:activity-compose:1.7.2")
     implementation("androidx.compose.ui:ui:$compose_version")
     implementation("androidx.compose.ui:ui-tooling-preview:$compose_version")
-    implementation("androidx.compose.material3:material3:1.2.0-alpha02")
+    implementation("androidx.compose.material3:material3:1.2.0")
     implementation("androidx.compose.material:material-icons-extended:1.4.3")
     implementation("com.github.nanihadesuka:LazyColumnScrollbar:1.9.0")
 

diff --git a/app/src/main/java/com/bnyro/contacts/ui/components/SmsThreadItem.kt b/app/src/main/java/com/bnyro/contacts/ui/components/SmsThreadItem.kt
@@ -18,13 +18,13 @@ import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Person
 import androidx.compose.material3.DismissDirection
-import androidx.compose.material3.DismissValue
 import androidx.compose.material3.ElevatedCard
 import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.SwipeToDismiss
+import androidx.compose.material3.SwipeToDismissBox
+import androidx.compose.material3.SwipeToDismissBoxValue
 import androidx.compose.material3.Text
-import androidx.compose.material3.rememberDismissState
+import androidx.compose.material3.rememberSwipeToDismissBoxState
 import androidx.compose.material3.surfaceColorAtElevation
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
@@ -60,20 +60,20 @@ fun SmsThreadItem(
         mutableStateOf(false)
     }
 
-    val dismissState = rememberDismissState(
+    val dismissState = rememberSwipeToDismissBoxState(
         confirmValueChange = {
-            if (it == DismissValue.DismissedToEnd) {
+            if (it == SwipeToDismissBoxValue.StartToEnd) {
                 showDeleteThreadDialog = true
             }
-            return@rememberDismissState false
+            return@rememberSwipeToDismissBoxState false
         }
     )
 
-    SwipeToDismiss(
+    SwipeToDismissBox(
         modifier = Modifier.padding(horizontal = 10.dp, vertical = 5.dp),
         state = dismissState,
-        background = {},
-        dismissContent = {
+        backgroundContent = {},
+        content = {
             val shape = RoundedCornerShape(20.dp)
 
             ElevatedCard(
@@ -147,7 +147,7 @@ fun SmsThreadItem(
                 }
             }
         },
-        directions = setOf(DismissDirection.StartToEnd)
+        enableDismissFromStartToEnd = true
     )
 
     if (showDeleteThreadDialog) {

diff --git a/app/src/main/java/com/bnyro/contacts/ui/components/base/ClickableIcon.kt b/app/src/main/java/com/bnyro/contacts/ui/components/base/ClickableIcon.kt
@@ -18,9 +18,17 @@ fun ClickableIcon(
     onClick: () -> Unit
 ) {
     if (contentDescription != null) {
-        PlainTooltipBox(tooltip = { Text(stringResource(contentDescription)) }) {
+        TooltipBox(
+            tooltip = {
+                PlainTooltip {
+                    Text(stringResource(contentDescription))
+                }
+            },
+            positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider(),
+            state = rememberTooltipState(),
+        ) {
             IconButton(
-                modifier = modifier.tooltipTrigger(),
+                modifier = modifier,
                 onClick = onClick
             ) {
                 Icon(

diff --git a/app/src/main/java/com/bnyro/contacts/ui/components/conversation/Message.kt b/app/src/main/java/com/bnyro/contacts/ui/components/conversation/Message.kt
@@ -66,18 +66,18 @@ fun ColumnScope.Messages(
                     mutableStateOf(false)
                 }
 
-                val state = rememberDismissState(
+                val state = rememberSwipeToDismissBoxState(
                     confirmValueChange = {
-                        if (it == DismissValue.DismissedToEnd) {
+                        if (it == SwipeToDismissBoxValue.StartToEnd) {
                             showDeleteSmsDialog = true
                         }
-                        return@rememberDismissState false
+                        return@rememberSwipeToDismissBoxState false
                     }
                 )
-                SwipeToDismiss(
+                SwipeToDismissBox(
                     state = state,
-                    background = {},
-                    dismissContent = {
+                    backgroundContent = {},
+                    content = {
                         Message(
                             msg = smsData,
                             isUserMe = isUserMe

diff --git a/app/src/main/java/com/bnyro/contacts/ui/components/prefs/BlockPreference.kt b/app/src/main/java/com/bnyro/contacts/ui/components/prefs/BlockPreference.kt
@@ -1,80 +1,46 @@
 package com.bnyro.contacts.ui.components.prefs
 
-import androidx.compose.foundation.BorderStroke
 import androidx.compose.foundation.horizontalScroll
-import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.offset
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.rememberScrollState
-import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material3.ButtonDefaults
-import androidx.compose.material3.MaterialTheme
-import androidx.compose.material3.OutlinedButton
+import androidx.compose.material3.ExperimentalMaterial3Api
+import androidx.compose.material3.SegmentedButton
+import androidx.compose.material3.SegmentedButtonDefaults
+import androidx.compose.material3.SingleChoiceSegmentedButtonRow
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.zIndex
 import com.bnyro.contacts.util.rememberPreference
 
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun BlockPreference(
     preferenceKey: String,
     entries: List<String>,
     onSelectionChange: (Int) -> Unit = {}
 ) {
-    val state = rememberScrollState()
+    val scrollState = rememberScrollState()
 
-    Row(
+    SingleChoiceSegmentedButtonRow(
         modifier = Modifier
             .fillMaxWidth()
             .padding(vertical = 8.dp)
-            .horizontalScroll(state)
+            .horizontalScroll(scrollState)
     ) {
-        val cornerRadius = 20.dp
-
         var selectedItem by rememberPreference(key = preferenceKey, defaultValue = 0)
 
         entries.forEachIndexed { index, entry ->
-            val startRadius = if (index != 0) 0.dp else cornerRadius
-            val endRadius = if (index == entries.size - 1) cornerRadius else 0.dp
-
-            OutlinedButton(
+            SegmentedButton(
+                selected = selectedItem == index,
                 onClick = {
                     selectedItem = index
-                    onSelectionChange.invoke(index)
+                    onSelectionChange(index)
                 },
-                modifier = Modifier
-                    .offset(if (index == 0) 0.dp else (-1 * index).dp, 0.dp)
-                    .zIndex(if (selectedItem == index) 1f else 0f),
-                shape = RoundedCornerShape(
-                    topStart = startRadius,
-                    topEnd = endRadius,
-                    bottomStart = startRadius,
-                    bottomEnd = endRadius
-                ),
-                border = BorderStroke(
-                    1.dp,
-                    if (selectedItem == index) {
-                        MaterialTheme.colorScheme.primary
-                    } else {
-                        MaterialTheme.colorScheme.primary.copy(alpha = 0.75f)
-                    }
-                ),
-                colors = if (selectedItem == index) {
-                    ButtonDefaults.outlinedButtonColors(
-                        containerColor = MaterialTheme.colorScheme.primary.copy(alpha = 0.2f),
-                        contentColor = MaterialTheme.colorScheme.primary
-                    )
-                } else {
-                    ButtonDefaults.outlinedButtonColors(
-                        containerColor = MaterialTheme.colorScheme.surface,
-                        contentColor = MaterialTheme.colorScheme.onSurface
-                    )
-                }
+                shape = SegmentedButtonDefaults.itemShape(index = index, count = entries.size)
             ) {
                 Text(entry)
             }

diff --git a/app/src/main/java/com/bnyro/contacts/ui/screens/SmsThreadScreen.kt b/app/src/main/java/com/bnyro/contacts/ui/screens/SmsThreadScreen.kt
@@ -22,10 +22,13 @@ import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.FilledIconButton
 import androidx.compose.material3.Icon
 import androidx.compose.material3.OutlinedButton
-import androidx.compose.material3.PlainTooltipBox
+import androidx.compose.material3.PlainTooltip
 import androidx.compose.material3.Scaffold
 import androidx.compose.material3.Text
+import androidx.compose.material3.TooltipBox
+import androidx.compose.material3.TooltipDefaults
 import androidx.compose.material3.TopAppBar
+import androidx.compose.material3.rememberTooltipState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.collectAsState
@@ -91,12 +94,17 @@ fun SmsThreadScreen(
                     val interactionSource = remember {
                         MutableInteractionSource()
                     }
-                    PlainTooltipBox(
-                        tooltip = { Text(address) }
+                    TooltipBox(
+                        tooltip = {
+                            PlainTooltip {
+                                Text(address)
+                            }
+                        },
+                        state = rememberTooltipState(),
+                        positionProvider = TooltipDefaults.rememberPlainTooltipPositionProvider()
                     ) {
                         Text(
                             modifier = Modifier
-                                .tooltipTrigger()
                                 .clickable(interactionSource, null) {
                                     if (contactData != null) showContactScreen = true
                                 },