From 38be352ab7a66625e397ccbb264436daf8dc0ed6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Gabriel=20Font=C3=A1n?= Date: Mon, 12 Aug 2024 18:10:53 +0200 Subject: [PATCH] refactor(ui): Migrated deprecated components This commit migrates the UI components that has been deprecated in the latest versions of Material 3: - Replaced `Divider` with `HorizontalDivider`. - Updated `ExposedDropdownMenuBox` to use `MenuAnchorType`. - Added `progress` lambda to `CircularProgressIndicator`. - Updated `HorizontalPagerIndicator` syntax. - Added animation to `DialogCheckBoxItem`. - Updated `LinearProgressIndicator` syntax. - Replaced `AlertDialog` with `BasicAlertDialog`. - Replaced `ClickableText` with `Text` and `AnnotatedString` with links. --- - HorizontalPagerIndicator has to be updated --- .../com/junkfood/seal/ui/component/Dialogs.kt | 2 +- .../seal/ui/component/DownloadQueueItem.kt | 5 +- .../seal/ui/page/command/TaskLogPage.kt | 3 +- .../ui/page/download/PlaylistSelectionPage.kt | 5 +- .../seal/ui/page/downloadv2/DownloadPageV2.kt | 4 +- .../seal/ui/page/downloadv2/FormatPage.kt | 23 +++++++-- .../seal/ui/page/settings/about/AboutPage.kt | 50 +++++++++---------- .../appearance/AppearancePreferences.kt | 3 +- .../general/GeneralDownloadPreferences.kt | 6 ++- 9 files changed, 60 insertions(+), 41 deletions(-) diff --git a/app/src/main/java/com/junkfood/seal/ui/component/Dialogs.kt b/app/src/main/java/com/junkfood/seal/ui/component/Dialogs.kt index 2c87311ba..66ab36356 100644 --- a/app/src/main/java/com/junkfood/seal/ui/component/Dialogs.kt +++ b/app/src/main/java/com/junkfood/seal/ui/component/Dialogs.kt @@ -273,7 +273,7 @@ fun SealDialogVariant( tonalElevation: Dp = AlertDialogDefaults.TonalElevation, properties: DialogProperties = DialogProperties() ) { - AlertDialog( + BasicAlertDialog( onDismissRequest = onDismissRequest, modifier = modifier, properties = properties diff --git a/app/src/main/java/com/junkfood/seal/ui/component/DownloadQueueItem.kt b/app/src/main/java/com/junkfood/seal/ui/component/DownloadQueueItem.kt index 51e6be7a7..472890a32 100644 --- a/app/src/main/java/com/junkfood/seal/ui/component/DownloadQueueItem.kt +++ b/app/src/main/java/com/junkfood/seal/ui/component/DownloadQueueItem.kt @@ -273,12 +273,13 @@ fun CustomCommandTaskItem( ) else CircularProgressIndicator( + progress = { animatedProgress }, modifier = Modifier .padding(8.dp) .size(24.dp), + color = accentColor, strokeWidth = 5.dp, - progress = animatedProgress, - color = accentColor + trackColor = ProgressIndicatorDefaults.circularDeterminateTrackColor, ) } diff --git a/app/src/main/java/com/junkfood/seal/ui/page/command/TaskLogPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/command/TaskLogPage.kt index a46aac948..9f63b2ca5 100644 --- a/app/src/main/java/com/junkfood/seal/ui/page/command/TaskLogPage.kt +++ b/app/src/main/java/com/junkfood/seal/ui/page/command/TaskLogPage.kt @@ -24,6 +24,7 @@ import androidx.compose.material3.AssistChipDefaults import androidx.compose.material3.Divider import androidx.compose.material3.ElevatedAssistChip import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme @@ -84,7 +85,7 @@ fun TaskLogPage(onNavigateBack: () -> Unit, taskHashCode: Int) { .navigationBarsPadding(), verticalArrangement = Arrangement.Center ) { - Divider(modifier = Modifier.fillMaxWidth()) + HorizontalDivider(modifier = Modifier.fillMaxWidth()) Row( Modifier .fillMaxWidth() diff --git a/app/src/main/java/com/junkfood/seal/ui/page/download/PlaylistSelectionPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/download/PlaylistSelectionPage.kt index 076ff9e3e..daeca7e05 100644 --- a/app/src/main/java/com/junkfood/seal/ui/page/download/PlaylistSelectionPage.kt +++ b/app/src/main/java/com/junkfood/seal/ui/page/download/PlaylistSelectionPage.kt @@ -15,10 +15,9 @@ import androidx.compose.foundation.selection.selectable import androidx.compose.material.icons.Icons import androidx.compose.material.icons.automirrored.outlined.PlaylistAdd import androidx.compose.material.icons.outlined.Close -import androidx.compose.material.icons.outlined.PlaylistAdd import androidx.compose.material3.Checkbox -import androidx.compose.material3.Divider import androidx.compose.material3.ExperimentalMaterial3Api +import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.MaterialTheme @@ -117,7 +116,7 @@ fun PlaylistSelectionPage(onNavigateBack: () -> Unit = {}) { .navigationBarsPadding(), verticalArrangement = Arrangement.Center ) { - Divider(modifier = Modifier.fillMaxWidth()) + HorizontalDivider(modifier = Modifier.fillMaxWidth()) Row(verticalAlignment = Alignment.CenterVertically) { Row( modifier = Modifier.selectable(selected = selectedItems.size == playlistCount && selectedItems.size != 0, diff --git a/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/DownloadPageV2.kt b/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/DownloadPageV2.kt index 4b23bd99a..e37ff3ae1 100644 --- a/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/DownloadPageV2.kt +++ b/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/DownloadPageV2.kt @@ -322,7 +322,7 @@ fun InputUrl( .clip(MaterialTheme.shapes.large), ) else LinearProgressIndicator( - progress = progressAnimationValue, + progress = { progressAnimationValue }, modifier = Modifier .weight(0.75f) .clip(MaterialTheme.shapes.large), @@ -599,8 +599,8 @@ fun VideoCardV2( modifier = Modifier.fillMaxWidth(), ) else LinearProgressIndicator( + progress = { progressAnimationValue / 100f }, modifier = Modifier.fillMaxWidth(), - progress = progressAnimationValue / 100f, ) } } diff --git a/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/FormatPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/FormatPage.kt index f77d66d4e..ec9a9577d 100644 --- a/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/FormatPage.kt +++ b/app/src/main/java/com/junkfood/seal/ui/page/downloadv2/FormatPage.kt @@ -2,6 +2,8 @@ package com.junkfood.seal.ui.page.downloadv2 import android.content.Intent import androidx.compose.animation.AnimatedVisibility +import androidx.compose.animation.core.Spring +import androidx.compose.animation.core.VisibilityThreshold import androidx.compose.animation.core.spring import androidx.compose.animation.fadeOut import androidx.compose.foundation.ExperimentalFoundationApi @@ -35,7 +37,6 @@ import androidx.compose.material.icons.outlined.Delete import androidx.compose.material.icons.outlined.Edit import androidx.compose.material.icons.outlined.FileDownload import androidx.compose.material.icons.outlined.Subtitles -import androidx.compose.material.icons.rounded.Download import androidx.compose.material3.AlertDialog import androidx.compose.material3.Button import androidx.compose.material3.ExperimentalMaterial3Api @@ -73,6 +74,7 @@ import androidx.compose.ui.res.stringResource import androidx.compose.ui.semantics.clearAndSetSemantics import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.tooling.preview.Preview +import androidx.compose.ui.unit.IntOffset import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.sp import com.junkfood.seal.Downloader @@ -108,9 +110,9 @@ import com.junkfood.seal.util.VIDEO_CLIP import com.junkfood.seal.util.VideoClip import com.junkfood.seal.util.VideoInfo import com.junkfood.seal.util.toHttpsUrl +import kotlinx.coroutines.delay import kotlin.math.min import kotlin.math.roundToInt -import kotlinx.coroutines.delay private const val TAG = "FormatPage" @@ -882,7 +884,13 @@ private fun SubtitleSelectionDialog( for ((code, formats) in suggestedSubtitlesFiltered) { item(key = code) { DialogCheckBoxItem( - modifier = Modifier.animateItemPlacement(), + modifier = Modifier.animateItem( + fadeInSpec = null, fadeOutSpec = null, + placementSpec = spring( + stiffness = Spring.StiffnessMediumLow, + visibilityThreshold = IntOffset.VisibilityThreshold + ) + ), checked = selectedSubtitles.contains(code), onClick = { if (selectedSubtitles.contains(code)) { @@ -906,7 +914,14 @@ private fun SubtitleSelectionDialog( for ((code, formats) in autoCaptionsFiltered) { item(key = code) { DialogCheckBoxItem( - modifier = Modifier.animateItemPlacement(), + modifier = Modifier.animateItem( + fadeInSpec = null, + fadeOutSpec = null, + placementSpec = spring( + stiffness = Spring.StiffnessMediumLow, + visibilityThreshold = IntOffset.VisibilityThreshold + ) + ), checked = selectedSubtitles.contains(code), onClick = { if (selectedSubtitles.contains(code)) { diff --git a/app/src/main/java/com/junkfood/seal/ui/page/settings/about/AboutPage.kt b/app/src/main/java/com/junkfood/seal/ui/page/settings/about/AboutPage.kt index ca6cdd089..268f2243e 100644 --- a/app/src/main/java/com/junkfood/seal/ui/page/settings/about/AboutPage.kt +++ b/app/src/main/java/com/junkfood/seal/ui/page/settings/about/AboutPage.kt @@ -1,13 +1,12 @@ package com.junkfood.seal.ui.page.settings.about +import android.util.Log import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.padding import androidx.compose.foundation.lazy.LazyColumn -import androidx.compose.foundation.text.ClickableText import androidx.compose.material.icons.Icons import androidx.compose.material.icons.automirrored.outlined.ContactSupport import androidx.compose.material.icons.outlined.AutoAwesome -import androidx.compose.material.icons.outlined.ContactSupport import androidx.compose.material.icons.outlined.Description import androidx.compose.material.icons.outlined.Info import androidx.compose.material.icons.outlined.NewReleases @@ -39,11 +38,13 @@ import androidx.compose.ui.res.painterResource import androidx.compose.ui.res.stringResource import androidx.compose.ui.text.AnnotatedString import androidx.compose.ui.text.ExperimentalTextApi +import androidx.compose.ui.text.LinkAnnotation import androidx.compose.ui.text.SpanStyle -import androidx.compose.ui.text.UrlAnnotation +import androidx.compose.ui.text.TextLinkStyles import androidx.compose.ui.text.buildAnnotatedString import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextDecoration +import androidx.compose.ui.text.withLink import androidx.compose.ui.tooling.preview.Preview import com.junkfood.seal.App import com.junkfood.seal.App.Companion.packageInfo @@ -200,7 +201,6 @@ fun AboutPage( }) } -@OptIn(ExperimentalTextApi::class) @Composable @Preview fun AutoUpdateUnavailableDialog(onDismissRequest: () -> Unit = {}) { @@ -213,22 +213,27 @@ fun AutoUpdateUnavailableDialog(onDismissRequest: () -> Unit = {}) { ) val annotatedString = buildAnnotatedString { - append(text) + append(text.substring(0, text.indexOf(hyperLinkText))) val startIndex = text.indexOf(hyperLinkText) val endIndex = startIndex + hyperLinkText.length - addUrlAnnotation( - UrlAnnotation("https://github.com/JunkFood02/Seal/releases/latest"), - start = startIndex, - end = endIndex - ) - addStyle( - SpanStyle( - color = MaterialTheme.colorScheme.tertiary, - textDecoration = TextDecoration.Underline, - ), start = startIndex, - end = endIndex - ) + withLink( + LinkAnnotation.Clickable( + tag = "Link to the latest app release in GitHub", + styles = TextLinkStyles( + SpanStyle( + color = MaterialTheme.colorScheme.tertiary, + textDecoration = TextDecoration.Underline, + ) + ), + linkInteractionListener = { _ -> + uriHandler.openUri("https://github.com/JunkFood02/Seal/releases/latest") + hapticFeedback.performHapticFeedback(HapticFeedbackType.LongPress) + } + ) + ) { + append(text.substring(startIndex, endIndex)) + } } AlertDialog( onDismissRequest = onDismissRequest, @@ -245,16 +250,11 @@ fun AutoUpdateUnavailableDialog(onDismissRequest: () -> Unit = {}) { ) }, text = { - ClickableText( + Text( text = annotatedString, - onClick = { index -> - annotatedString.getUrlAnnotations(index, index).firstOrNull()?.let { - hapticFeedback.performHapticFeedback(HapticFeedbackType.LongPress) - uriHandler.openUri(it.item.url) - } - }, style = MaterialTheme.typography.bodyMedium.copy(MaterialTheme.colorScheme.onSurfaceVariant) ) - }) + } + ) } diff --git a/app/src/main/java/com/junkfood/seal/ui/page/settings/appearance/AppearancePreferences.kt b/app/src/main/java/com/junkfood/seal/ui/page/settings/appearance/AppearancePreferences.kt index 5adb6908d..bab9d0588 100644 --- a/app/src/main/java/com/junkfood/seal/ui/page/settings/appearance/AppearancePreferences.kt +++ b/app/src/main/java/com/junkfood/seal/ui/page/settings/appearance/AppearancePreferences.kt @@ -183,7 +183,8 @@ fun AppearancePreferences( } } - HorizontalPagerIndicator(pagerState = pagerState, + HorizontalPagerIndicator( + pagerState = pagerState, pageCount = pageCount, modifier = Modifier .clearAndSetSemantics { } diff --git a/app/src/main/java/com/junkfood/seal/ui/page/settings/general/GeneralDownloadPreferences.kt b/app/src/main/java/com/junkfood/seal/ui/page/settings/general/GeneralDownloadPreferences.kt index 41f0faf0a..0401dfccb 100644 --- a/app/src/main/java/com/junkfood/seal/ui/page/settings/general/GeneralDownloadPreferences.kt +++ b/app/src/main/java/com/junkfood/seal/ui/page/settings/general/GeneralDownloadPreferences.kt @@ -47,6 +47,7 @@ import androidx.compose.material3.Icon import androidx.compose.material3.IconButton import androidx.compose.material3.LargeTopAppBar import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.MenuAnchorType import androidx.compose.material3.OutlinedTextField import androidx.compose.material3.RadioButton import androidx.compose.material3.Scaffold @@ -456,7 +457,7 @@ fun GeneralDownloadPreferences( title = { Text(text = stringResource(id = R.string.update)) }, icon = { Icon(Icons.Outlined.SyncAlt, null) }, text = { - LazyColumn() { + LazyColumn { item { Text( text = stringResource(id = R.string.update_channel), @@ -500,6 +501,7 @@ fun GeneralDownloadPreferences( } item { var expanded by remember { mutableStateOf(false) } + val type = MenuAnchorType.PrimaryNotEditable ExposedDropdownMenuBox( modifier = Modifier.padding(horizontal = 20.dp), @@ -513,7 +515,7 @@ fun GeneralDownloadPreferences( readOnly = true, modifier = Modifier .fillMaxWidth() - .menuAnchor(), + .menuAnchor(type = type, enabled = true), colors = ExposedDropdownMenuDefaults.outlinedTextFieldColors(), trailingIcon = { ExposedDropdownMenuDefaults.TrailingIcon(expanded = expanded)