Update to latest compose stable versions (#1113)

Adventech · Sep 7, 2024 · d8b6f99 · d8b6f99
1 parent 16a4ff0
commit d8b6f99
Show file tree

Hide file tree

Showing 31 changed files with 2,466 additions and 24,685 deletions.
diff --git a/app-tv/build.gradle.kts b/app-tv/build.gradle.kts
@@ -45,7 +45,7 @@ android {
     defaultConfig {
         applicationId = BuildAndroidConfig.APP_ID
         versionCode = appVersionCode
-        versionName = "0.7.0 - $appVersionCode"
+        versionName = "0.8.0 - $appVersionCode"
         minSdk = 25
     }
 
@@ -76,7 +76,6 @@ android {
     }
 
     kotlinOptions {
-        freeCompilerArgs = freeCompilerArgs + "-opt-in=androidx.tv.material3.ExperimentalTvMaterial3Api"
         freeCompilerArgs = freeCompilerArgs + "-opt-in=androidx.tv.foundation.ExperimentalTvFoundationApi"
     }
 

diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/account/AccountScreenUi.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/account/AccountScreenUi.kt
@@ -29,6 +29,8 @@ import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
@@ -46,8 +48,6 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Devices
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.tv.foundation.lazy.list.TvLazyColumn
-import androidx.tv.foundation.lazy.list.itemsIndexed
 import androidx.tv.material3.DenseListItem
 import androidx.tv.material3.Icon
 import androidx.tv.material3.MaterialTheme
@@ -80,7 +80,7 @@ fun AccountScreenUi(state: State, modifier: Modifier = Modifier) {
             .fillMaxSize()
             .padding(horizontal = childPadding.start, vertical = childPadding.top)
     ) {
-        TvLazyColumn(
+        LazyColumn(
             modifier = Modifier
                 .fillMaxWidth(fraction = SIDE_BAR_WIDTH_FRACTION)
                 .fillMaxHeight()

diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/account/languages/LanguagesScreenUi.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/account/languages/LanguagesScreenUi.kt
@@ -25,6 +25,10 @@ package app.ss.tv.presentation.account.languages
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.LazyListScope
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.rounded.Check
 import androidx.compose.runtime.Composable
@@ -37,10 +41,6 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.tv.foundation.lazy.list.TvLazyColumn
-import androidx.tv.foundation.lazy.list.TvLazyListScope
-import androidx.tv.foundation.lazy.list.itemsIndexed
-import androidx.tv.foundation.lazy.list.rememberTvLazyListState
 import androidx.tv.material3.DenseListItem
 import androidx.tv.material3.Icon
 import androidx.tv.material3.MaterialTheme
@@ -57,14 +57,14 @@ import app.ss.translations.R as L10nR
 @CircuitInject(LanguagesScreen::class, ActivityComponent::class)
 @Composable
 fun LanguagesScreenUi(state: State, modifier: Modifier = Modifier) {
-    val tvLazyListState = rememberTvLazyListState()
+    val lazyListState = rememberLazyListState()
     var scrollToIndex by remember { mutableIntStateOf(0) }
 
-    TvLazyColumn(
+    LazyColumn(
         modifier = modifier
             .fillMaxSize()
             .padding(horizontal = 72.dp),
-        state = tvLazyListState
+        state = lazyListState
     ) {
         item {
             Text(
@@ -86,12 +86,12 @@ fun LanguagesScreenUi(state: State, modifier: Modifier = Modifier) {
     }
 
     LaunchedEffect(scrollToIndex) {
-        tvLazyListState.animateScrollToItem(scrollToIndex, -200)
+        lazyListState.animateScrollToItem(scrollToIndex, -200)
     }
 }
 
 
-private fun TvLazyListScope.languagesUi(state: State.Languages) {
+private fun LazyListScope.languagesUi(state: State.Languages) {
     itemsIndexed(state.languages, key = { _, model -> model.code }) { _, model ->
         DenseListItem(
             selected = model.selected,

diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/extentions/PositionFocusedItemInLazyLayout.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/extentions/PositionFocusedItemInLazyLayout.kt
@@ -0,0 +1,50 @@
+package app.ss.tv.presentation.extentions
+
+import androidx.compose.foundation.ExperimentalFoundationApi
+import androidx.compose.foundation.gestures.BringIntoViewSpec
+import androidx.compose.foundation.gestures.LocalBringIntoViewSpec
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.CompositionLocalProvider
+import androidx.compose.runtime.remember
+
+@OptIn(ExperimentalFoundationApi::class)
+@Composable
+fun PositionFocusedItemInLazyLayout(
+    parentFraction: Float = 0.07f,
+    childFraction: Float = 0f,
+    content: @Composable () -> Unit,
+) {
+    // a bring into view spec that pivots around the center of the scrollable container
+    val bringIntoViewSpec = remember(parentFraction, childFraction) {
+        object : BringIntoViewSpec {
+            override fun calculateScrollDistance(
+                // initial position of item requesting focus
+                offset: Float,
+                // size of item requesting focus
+                size: Float,
+                // size of the lazy container
+                containerSize: Float
+            ): Float {
+                val childSmallerThanParent = size <= containerSize
+                val initialTargetForLeadingEdge =
+                    parentFraction * containerSize - (childFraction * size)
+                val spaceAvailableToShowItem = containerSize - initialTargetForLeadingEdge
+
+                val targetForLeadingEdge =
+                    if (childSmallerThanParent && spaceAvailableToShowItem < size) {
+                        containerSize - size
+                    } else {
+                        initialTargetForLeadingEdge
+                    }
+
+                return offset - targetForLeadingEdge
+            }
+        }
+    }
+
+    // LocalBringIntoViewSpec will apply to all scrollables in the hierarchy.
+    CompositionLocalProvider(
+        LocalBringIntoViewSpec provides bringIntoViewSpec,
+        content = content,
+    )
+}
diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/home/HomeTopBar.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/home/HomeTopBar.kt
@@ -57,7 +57,6 @@ import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.tooling.preview.Devices
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.tv.material3.ExperimentalTvMaterial3Api
 import androidx.tv.material3.Icon
 import androidx.tv.material3.LocalContentColor
 import androidx.tv.material3.MaterialTheme
@@ -78,7 +77,7 @@ val TopBarFocusRequesters = List(size = TopBarTabs.size + 1) { FocusRequester()
 
 private const val ACCOUNT_SCREEN_INDEX = -1
 
-@OptIn(ExperimentalComposeUiApi::class, ExperimentalTvMaterial3Api::class)
+@OptIn(ExperimentalComposeUiApi::class)
 @Composable
 fun HomeTopBar(
     modifier: Modifier = Modifier,

diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/home/TopBarItemIndicator.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/home/TopBarItemIndicator.kt
@@ -38,13 +38,12 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.Shape
 import androidx.compose.ui.unit.DpRect
+import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.height
 import androidx.compose.ui.unit.width
 import androidx.compose.ui.zIndex
-import androidx.tv.material3.ExperimentalTvMaterial3Api
 import androidx.tv.material3.MaterialTheme
 
-@OptIn(ExperimentalTvMaterial3Api::class)
 @Composable
 fun TopBarItemIndicator(
     currentTabPosition: DpRect,
@@ -68,7 +67,12 @@ fun TopBarItemIndicator(
         modifier
             .fillMaxWidth()
             .wrapContentSize(Alignment.BottomStart)
-            .offset(x = leftOffset, y = topOffset)
+            .offset {
+                IntOffset(
+                    x = leftOffset.value.toInt(),
+                    y = topOffset.value.toInt()
+                )
+            }
             .width(width)
             .height(height)
             .background(color = pillColor, shape = shape)

diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/theme/Theme.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/theme/Theme.kt
@@ -25,12 +25,10 @@ package app.ss.tv.presentation.theme
 import androidx.compose.material3.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.CompositionLocalProvider
-import androidx.tv.material3.ExperimentalTvMaterial3Api
 import androidx.tv.material3.LocalContentColor
 import androidx.tv.material3.MaterialTheme
 import androidx.tv.material3.darkColorScheme
 
-@OptIn(ExperimentalTvMaterial3Api::class)
 private val DarkColorScheme = darkColorScheme(
     primary = md_theme_dark_primary,
     onPrimary = md_theme_dark_onPrimary,
@@ -61,7 +59,6 @@ private val DarkColorScheme = darkColorScheme(
     scrim = md_theme_dark_scrim,
 )
 
-@OptIn(ExperimentalTvMaterial3Api::class)
 @Composable
 fun SSTvTheme(content: @Composable () -> Unit) {
     MaterialTheme(

diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/videos/VideosScreenUi.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/videos/VideosScreenUi.kt
@@ -34,6 +34,11 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.LazyColumn
+import androidx.compose.foundation.lazy.LazyListScope
+import androidx.compose.foundation.lazy.LazyRow
+import androidx.compose.foundation.lazy.itemsIndexed
+import androidx.compose.foundation.lazy.rememberLazyListState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.derivedStateOf
@@ -45,18 +50,13 @@ import androidx.compose.ui.platform.LocalConfiguration
 import androidx.compose.ui.tooling.preview.Devices
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
-import androidx.tv.foundation.PivotOffsets
-import androidx.tv.foundation.lazy.list.TvLazyColumn
-import androidx.tv.foundation.lazy.list.TvLazyListScope
-import androidx.tv.foundation.lazy.list.TvLazyRow
-import androidx.tv.foundation.lazy.list.itemsIndexed
-import androidx.tv.foundation.lazy.list.rememberTvLazyListState
 import androidx.tv.material3.Border
 import androidx.tv.material3.Card
 import androidx.tv.material3.CardDefaults
 import androidx.tv.material3.MaterialTheme
 import androidx.tv.material3.StandardCardContainer
 import androidx.tv.material3.Text
+import app.ss.tv.presentation.extentions.PositionFocusedItemInLazyLayout
 import app.ss.tv.presentation.extentions.asPlaceholder
 import app.ss.tv.presentation.theme.BorderWidth
 import app.ss.tv.presentation.theme.Padding
@@ -73,15 +73,15 @@ import dagger.hilt.android.components.ActivityComponent
 @CircuitInject(VideosScreen::class, ActivityComponent::class)
 @Composable
 fun VideosScreenUi(state: State, modifier: Modifier = Modifier) {
-    val tvLazyListState = rememberTvLazyListState()
+    val tvLazyListState = rememberLazyListState()
     val shouldShowTopBar by remember {
         derivedStateOf {
             tvLazyListState.firstVisibleItemIndex == 0 &&
                 tvLazyListState.firstVisibleItemScrollOffset < 300
         }
     }
 
-    TvLazyColumn(
+    LazyColumn(
         modifier = modifier.fillMaxSize(),
         state = tvLazyListState,
     ) {
@@ -115,7 +115,7 @@ fun VideosScreenUi(state: State, modifier: Modifier = Modifier) {
     }
 }
 
-private fun TvLazyListScope.errorItem() {
+private fun LazyListScope.errorItem() {
     item {
         Box(
             modifier = Modifier.fillMaxSize(),
@@ -129,7 +129,7 @@ private fun TvLazyListScope.errorItem() {
     }
 }
 
-private fun TvLazyListScope.loadingItem() {
+private fun LazyListScope.loadingItem() {
     item { Spacer(modifier = Modifier.padding(top = 54.dp)) }
 
     item { LoadingRow(count = 8) }
@@ -153,12 +153,13 @@ private fun LoadingRow(
         label = "",
     ) { targetCount ->
         FocusGroup {
-            TvLazyRow(
-                pivotOffsets = PivotOffsets(parentFraction = 0.07f),
-                contentPadding = PaddingValues(start = childPadding.start, end = childPadding.end)
-            ) {
-                items(targetCount) {
-                    LoadingCard(modifier = Modifier.restorableFocus())
+            PositionFocusedItemInLazyLayout {
+                LazyRow(
+                    contentPadding = PaddingValues(start = childPadding.start, end = childPadding.end)
+                ) {
+                    items(targetCount) {
+                        LoadingCard(modifier = Modifier.restorableFocus())
+                    }
                 }
             }
         }

diff --git a/app-tv/src/main/kotlin/app/ss/tv/presentation/videos/ui/CategoryVideos.kt b/app-tv/src/main/kotlin/app/ss/tv/presentation/videos/ui/CategoryVideos.kt
@@ -32,6 +32,8 @@ import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.lazy.LazyRow
+import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.derivedStateOf
@@ -47,13 +49,11 @@ import androidx.compose.ui.focus.focusProperties
 import androidx.compose.ui.focus.onFocusChanged
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
-import androidx.tv.foundation.PivotOffsets
-import androidx.tv.foundation.lazy.list.TvLazyRow
-import androidx.tv.foundation.lazy.list.itemsIndexed
 import androidx.tv.material3.MaterialTheme
 import androidx.tv.material3.Text
 import app.ss.tv.data.model.CategorySpec
 import app.ss.tv.data.model.VideoSpec
+import app.ss.tv.presentation.extentions.PositionFocusedItemInLazyLayout
 import app.ss.tv.presentation.theme.Padding
 import app.ss.tv.presentation.theme.rememberChildPadding
 
@@ -75,33 +75,33 @@ fun CategoryVideos(
             .fillMaxWidth()
             .height(280.dp)
     ) {
+        Text(
+            text = category.title,
+            modifier = Modifier
+                .padding(start = childPadding.start, top = childPadding.top),
+            color = MaterialTheme.colorScheme.onSurface.copy(alpha = titleAlpha),
+            style = MaterialTheme.typography.titleLarge.copy(
+                fontWeight = FontWeight.Medium,
+            ),
+        )
+
+        AnimatedVisibility(visible = isListFocused) {
             Text(
-                text = category.title,
+                text = subTitle ?: "",
                 modifier = Modifier
-                    .padding(start = childPadding.start, top = childPadding.top),
-                color = MaterialTheme.colorScheme.onSurface.copy(alpha = titleAlpha),
-                style = MaterialTheme.typography.titleLarge.copy(
+                    .padding(start = childPadding.start, end = childPadding.end, bottom = childPadding.bottom),
+                color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.60f),
+                style = MaterialTheme.typography.titleSmall.copy(
                     fontWeight = FontWeight.Medium,
                 ),
             )
 
-            AnimatedVisibility(visible = isListFocused) {
-                Text(
-                    text = subTitle ?: "",
-                    modifier = Modifier
-                        .padding(start = childPadding.start, end = childPadding.end, bottom = childPadding.bottom),
-                    color = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.60f),
-                    style = MaterialTheme.typography.titleSmall.copy(
-                        fontWeight = FontWeight.Medium,
-                    ),
-                )
-
-                Spacer(modifier = Modifier.height(24.dp))
-            }
+            Spacer(modifier = Modifier.height(24.dp))
+        }
 
-            TvLazyRow(
+        PositionFocusedItemInLazyLayout {
+            LazyRow(
                 modifier = Modifier,
-                pivotOffsets = PivotOffsets(parentFraction = 0.07f),
                 contentPadding = PaddingValues(
                     start = childPadding.start,
                     top = childPadding.top,
@@ -135,6 +135,7 @@ fun CategoryVideos(
                 }
             }
         }
+    }
 
     LaunchedEffect(key1 = focusedIndex) {
         subTitle = focusedIndex?.let { index -> category.videos[index].title }

diff --git a/app/build.gradle.kts b/app/build.gradle.kts
@@ -218,7 +218,7 @@ object BuildAndroidConfig {
 
     object Version {
         private const val MAJOR = 4
-        private const val MINOR = 58
+        private const val MINOR = 59
         private const val PATCH = 0
 
         const val name = "$MAJOR.$MINOR.$PATCH"