I Want to create custom Vertical Pager In Jetback Compose as like this design
i want first card become in the top and when scroll the next card then should become the card in the center of screen as the design and i want add animation to text1 and text2 to To appear from bottom to top, how can i do that?
the code:
@Composable
private fun CustomVerticalPager(
shiftItems: List<ShiftItem>,
pagerState: PagerState,
shiftState: ShiftState,
onStartShiftCLicked: () -> Unit,
) {
Column(
modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.Center
) {
VerticalPager(
modifier = Modifier
.fillMaxSize()
.wrapContentHeight(),//todo test this
state = pagerState,
) { position ->
ShiftCard(
modifier = Modifier
.heightIn(min = if (shiftState.isSelected(shiftItems[position])) 700.dp else 250.dp)
.carouselTransition(
page = position,
pagerState = pagerState,
orientation = Orientation.Vertical
),
shiftItems = shiftItems,
selectedPosition = position,
pagerState = pagerState,
shiftState = shiftState,
onStartShiftCLicked = onStartShiftCLicked,
)
}
}
}