From 11ace14e104eae4d8bdebfab38dba04f0af674ba Mon Sep 17 00:00:00 2001
From: xfy <i@rua.plus>
Date: Fri, 15 May 2026 17:46:47 +0800
Subject: [PATCH] Add fade-out effect for non-selected rows during calendar
 collapse

Non-selected rows now fade out with alpha = 1f - collapseProgress via
graphicsLayer, naturally following the spring animation curve. When
rowScale < 0.1f and collapseProgress > 0.9f, DayCell rendering is
skipped and replaced with an empty Spacer to reduce draw overhead at
the end of the collapse animation.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
---
 .../plus/rua/project/ui/CalendarMonthPage.kt  | 30 +++++++++++++------
 1 file changed, 21 insertions(+), 9 deletions(-)

diff --git a/shared/src/commonMain/kotlin/plus/rua/project/ui/CalendarMonthPage.kt b/shared/src/commonMain/kotlin/plus/rua/project/ui/CalendarMonthPage.kt
index 7594a80..544dc6a 100644
--- a/shared/src/commonMain/kotlin/plus/rua/project/ui/CalendarMonthPage.kt
+++ b/shared/src/commonMain/kotlin/plus/rua/project/ui/CalendarMonthPage.kt
@@ -2,6 +2,7 @@ package plus.rua.project.ui
 
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.offset
@@ -10,6 +11,7 @@ import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clipToBounds
+import androidx.compose.ui.graphics.graphicsLayer
 import androidx.compose.ui.layout.onSizeChanged
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.dp
@@ -110,6 +112,8 @@ fun CalendarMonthPage(
 
             val shouldShow = rowHeightDp == null || rowHeightDp > 0.dp
 
+            val skipDayCells = (isAbove || isBelow) && rowScale < 0.1f && collapseProgress > 0.9f
+
             if (shouldShow) {
                 Row(
                     modifier = Modifier
@@ -130,16 +134,24 @@ fun CalendarMonthPage(
                             } else Modifier
                         )
                         .padding(vertical = ROW_PADDING_DP.dp)
-                ) {
-                    week.forEach { dayData ->
-                        DayCell(
-                            date = dayData.date,
-                            isCurrentMonth = dayData.isCurrentMonth,
-                            isSelected = dayData.date == selectedDate,
-                            isToday = dayData.date == today,
-                            onClick = { onDateClick(dayData.date) },
-                            modifier = Modifier.weight(1f)
+                        .then(
+                            if (isAbove || isBelow) Modifier.graphicsLayer { alpha = 1f - collapseProgress }
+                            else Modifier
                         )
+                ) {
+                    if (skipDayCells) {
+                        Spacer(Modifier.weight(1f))
+                    } else {
+                        week.forEach { dayData ->
+                            DayCell(
+                                date = dayData.date,
+                                isCurrentMonth = dayData.isCurrentMonth,
+                                isSelected = dayData.date == selectedDate,
+                                isToday = dayData.date == today,
+                                onClick = { onDateClick(dayData.date) },
+                                modifier = Modifier.weight(1f)
+                            )
+                        }
                     }
                 }
             }