Add page fade-in/fade-out transition to CalendarPager and WeekPager

Use pagerState.currentPageOffsetFraction to compute alpha for page content:
alpha drops from 1 to 0 as offset goes from 0% to 30%, preventing
mid-point brightness dip (combined alpha of adjacent pages always >= 1f).

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
xfy 2026-05-15 17:47:23 +08:00
parent 11ace14e10
commit 2411416eb7
2 changed files with 11 additions and 1 deletions

View File

@ -9,10 +9,12 @@ import androidx.compose.runtime.remember
import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.snapshotFlow
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import kotlinx.coroutines.flow.drop
import kotlinx.coroutines.launch
import kotlinx.datetime.LocalDate
import kotlinx.datetime.number
import kotlin.math.abs
/**
* 月度日历分页器HorizontalPager 实现无限左右滑动切换月份
@ -63,6 +65,8 @@ fun CalendarPager(
flingBehavior = PagerDefaults.flingBehavior(state = pagerState),
modifier = modifier
) { page ->
val pageOffset = abs(pagerState.currentPageOffsetFraction)
val alpha = 1f - pageOffset.coerceIn(0f, 0.3f) / 0.3f
val (year, month) = pageToYearMonth(page, initialYear, initialMonth)
CalendarMonthPage(
year = year,
@ -87,7 +91,8 @@ fun CalendarPager(
collapseProgress = collapseProgress,
rowHeightPx = rowHeightPx,
effectiveWeeks = effectiveWeeks,
onRowHeightMeasured = onRowHeightMeasured
onRowHeightMeasured = onRowHeightMeasured,
modifier = Modifier.alpha(alpha)
)
}
}

View File

@ -11,7 +11,9 @@ import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.remember
import androidx.compose.runtime.snapshotFlow
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.alpha
import androidx.compose.ui.unit.dp
import kotlin.math.abs
import kotlinx.coroutines.flow.drop
import kotlinx.datetime.DatePeriod
import kotlinx.datetime.LocalDate
@ -53,9 +55,12 @@ fun WeekPager(
flingBehavior = PagerDefaults.flingBehavior(state = pagerState),
modifier = modifier
) { page ->
val pageOffset = abs(pagerState.currentPageOffsetFraction)
val alpha = 1f - pageOffset.coerceIn(0f, 0.3f) / 0.3f
val weekMonday = pageToWeekMonday(page, initialWeekMonday)
Row(
modifier = Modifier
.alpha(alpha)
.fillMaxWidth()
.padding(vertical = ROW_PADDING_DP.dp)
) {