feat: no picture mode for recommend gallery.

oxyroid · Jan 15, 2024 · 64874d1 · 64874d1
1 parent 67489fc
commit 64874d1
Show file tree

Hide file tree

Showing 3 changed files with 131 additions and 51 deletions.
diff --git a/...res/foryou/src/main/java/com/m3u/features/foryou/components/recommend/RecommendGallery.kt b/...res/foryou/src/main/java/com/m3u/features/foryou/components/recommend/RecommendGallery.kt
@@ -1,9 +1,12 @@
 package com.m3u.features.foryou.components.recommend
 
+import androidx.compose.animation.ExperimentalAnimationApi
 import androidx.compose.animation.animateContentSize
 import androidx.compose.animation.core.tween
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
+import androidx.compose.animation.slideInHorizontally
+import androidx.compose.animation.slideOutHorizontally
 import androidx.compose.animation.togetherWith
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.PaddingValues
@@ -14,13 +17,13 @@ import androidx.compose.runtime.Composable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.tv.material3.Carousel
-import androidx.tv.material3.rememberCarouselState
 import com.m3u.material.components.HorizontalPagerIndicator
 import com.m3u.material.ktx.isTelevision
 import com.m3u.material.model.LocalSpacing
 import com.m3u.ui.LocalHelper
 import kotlin.math.absoluteValue
 
+@OptIn(ExperimentalAnimationApi::class)
 @Composable
 internal fun RecommendGallery(
     recommend: Recommend,
@@ -69,9 +72,7 @@ internal fun RecommendGallery(
             )
         }
     } else {
-        val state = rememberCarouselState()
         Carousel(
-            carouselState = state,
             itemCount = recommend.size,
             contentTransformEndToStart =
             fadeIn(tween(1000)).togetherWith(fadeOut(tween(1000))),
@@ -96,9 +97,12 @@ internal fun RecommendGallery(
 
                         }
                     }
-                }
+                },
+                modifier = Modifier.animateEnterExit(
+                    enter = slideInHorizontally(animationSpec = tween(1000)) { it / 2 },
+                    exit = slideOutHorizontally(animationSpec = tween(1000))
+                )
             )
         }
     }
-
 }
diff --git a/features/foryou/src/main/java/com/m3u/features/foryou/components/recommend/RecommendItem.kt b/features/foryou/src/main/java/com/m3u/features/foryou/components/recommend/RecommendItem.kt
@@ -1,6 +1,8 @@
 package com.m3u.features.foryou.components.recommend
 
+import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -13,10 +15,19 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.graphicsLayer
+import androidx.compose.ui.layout.ContentScale
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.util.lerp
+import androidx.tv.material3.CardScale
+import coil.compose.AsyncImage
+import coil.request.ImageRequest
+import com.m3u.core.architecture.pref.LocalPref
+import com.m3u.features.foryou.R
 import com.m3u.i18n.R.string
+import com.m3u.material.ktx.isTelevision
 import com.m3u.material.model.LocalSpacing
 import kotlinx.datetime.Clock
 import kotlinx.datetime.Instant
@@ -30,12 +41,10 @@ internal fun RecommendItem(
     modifier: Modifier = Modifier
 ) {
     val spacing = LocalSpacing.current
-    RecommendItemLayout(pageOffset, modifier) {
+    RecommendItemLayout(pageOffset, onClick, modifier) {
         Column(
             modifier = Modifier
                 .fillMaxWidth()
-                .clickable(onClick = onClick)
-                .padding(spacing.medium)
         ) {
             when (spec) {
                 is Recommend.UnseenSpec -> UnseenContent(spec)
@@ -48,66 +57,113 @@ internal fun RecommendItem(
 @Composable
 private fun RecommendItemLayout(
     pageOffset: Float,
+    onClick: () -> Unit,
     modifier: Modifier = Modifier,
     content: @Composable () -> Unit
 ) {
-    Card(
-        modifier = Modifier
-            .graphicsLayer {
-                lerp(
-                    start = 0.65f,
-                    stop = 1f,
-                    fraction = 1f - pageOffset.coerceIn(0f, 1f)
-                ).also { scale ->
-                    scaleX = scale
-                    scaleY = scale
+    val tv = isTelevision()
+    if (!tv) {
+        Card(
+            modifier = Modifier
+                .clickable { onClick() }
+                .graphicsLayer {
+                    lerp(
+                        start = 0.65f,
+                        stop = 1f,
+                        fraction = 1f - pageOffset.coerceIn(0f, 1f)
+                    ).also { scale ->
+                        scaleX = scale
+                        scaleY = scale
+                    }
+                    alpha = lerp(
+                        start = 0.5f,
+                        stop = 1f,
+                        fraction = 1f - pageOffset.coerceIn(0f, 1f)
+                    )
                 }
-                alpha = lerp(
-                    start = 0.5f,
-                    stop = 1f,
-                    fraction = 1f - pageOffset.coerceIn(0f, 1f)
-                )
-            }
-            .then(modifier),
-        content = { content() }
-    )
+                .then(modifier),
+            content = { content() }
+        )
+    } else {
+        androidx.tv.material3.Card(
+            scale = CardScale.None,
+            onClick = onClick,
+            modifier = modifier,
+            content = { content() }
+        )
+    }
+
 }
 
 @Composable
 private fun UnseenContent(spec: Recommend.UnseenSpec) {
+    val context = LocalContext.current
     val spacing = LocalSpacing.current
+    val pref = LocalPref.current
+
     val stream = spec.stream
-    Text(
-        text = stringResource(string.feat_foryou_recommend_unseen_label).uppercase(),
-        style = MaterialTheme.typography.labelLarge,
-        maxLines = 1
-    )
     val duration = remember(stream.seen) {
         Clock.System.now() - Instant.fromEpochMilliseconds(stream.seen)
     }
-    Text(
-        text = when {
-            duration > 30.days -> stringResource(
-                string.feat_foryou_recommend_unseen_more_than_days,
-                30
+    val noPictureMode = pref.noPictureMode
+
+    Box(Modifier.fillMaxWidth()) {
+        if (!noPictureMode) {
+            val request = remember(stream.cover) {
+                ImageRequest.Builder(context)
+                    .data(stream.cover.orEmpty())
+                    .crossfade(1600)
+                    .build()
+            }
+            AsyncImage(
+                model = request,
+                contentScale = ContentScale.Crop,
+                contentDescription = stream.title,
+                modifier = Modifier.matchParentSize()
             )
+            Image(
+                painter = painterResource(R.drawable.scrim),
+                contentScale = ContentScale.Crop,
+                contentDescription = null,
+                // tint = androidx.tv.material3.MaterialTheme.colorScheme.background,
+                modifier = Modifier.matchParentSize()
+            )
+        }
 
-            duration > 1.days -> stringResource(
-                string.feat_foryou_recommend_unseen_days,
-                duration.inWholeDays
+        Column(Modifier.padding(spacing.medium)) {
+            Text(
+                text = stringResource(string.feat_foryou_recommend_unseen_label).uppercase(),
+                style = MaterialTheme.typography.labelLarge,
+                maxLines = 1
             )
+            Text(
+                text = when {
+                    duration > 30.days -> stringResource(
+                        string.feat_foryou_recommend_unseen_more_than_days,
+                        30
+                    )
 
-            else -> stringResource(string.feat_foryou_recommend_unseen_hours, duration.inWholeHours)
-        },
-        style = MaterialTheme.typography.labelMedium,
-    )
-    Spacer(modifier = Modifier.height(spacing.extraSmall))
-    Text(
-        text = stream.title,
-        style = MaterialTheme.typography.displaySmall,
-        fontWeight = FontWeight.Black,
-        maxLines = 1
-    )
+                    duration > 1.days -> stringResource(
+                        string.feat_foryou_recommend_unseen_days,
+                        duration.inWholeDays
+                    )
+
+                    else -> stringResource(
+                        string.feat_foryou_recommend_unseen_hours,
+                        duration.inWholeHours
+                    )
+                },
+                style = MaterialTheme.typography.labelMedium,
+            )
+            Spacer(modifier = Modifier.height(spacing.extraSmall))
+            Text(
+                text = stream.title,
+                style = MaterialTheme.typography.displaySmall,
+                fontWeight = FontWeight.Black,
+                maxLines = 1
+            )
+        }
+    }
 }
 
 @Composable

diff --git a/features/foryou/src/main/res/drawable/scrim.xml b/features/foryou/src/main/res/drawable/scrim.xml
@@ -0,0 +1,20 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    xmlns:aapt="http://schemas.android.com/aapt"
+    android:width="192dp"
+    android:height="108dp"
+    android:viewportWidth="192"
+    android:viewportHeight="108">
+  <path
+      android:pathData="M0,0h758v428h-758z">
+    <aapt:attr name="android:fillColor">
+      <gradient 
+          android:centerX="128"
+          android:centerY="24"
+          android:gradientRadius="130"
+          android:type="radial">
+        <item android:offset="0.15" android:color="#19131314"/>
+        <item android:offset="0.85" android:color="#FF131314"/>
+      </gradient>
+    </aapt:attr>
+  </path>
+</vector>