I am working with accompanist pager. Would to create own pager indicator. Also i would to indicator change color smoothly when page changing from active to inactive. I have pager state

currentPage

and

currentPageOffset

values. What is the best way in compose to blend colors one with another for current case? It is not an animation, colors must change on drag (recompose), so somehow i must change color based on

currentPage

and

currentPageOffset

. Would be the good solution is changing the alpha? Or i can somehow blend colors?

You probably to

lerp

between the 2 colours: https://developer.android.com/reference/kotlin/androidx/compose/ui/graphics/package-summary#lerp(androidx.compose.ui.graphics.Color,androidx.compose.ui.graphics.Color,kotlin.Float)

val currentPage = pagerState.currentPage
    val nexPage = if (pagerState.currentPageOffset < 0) currentPage - 1 else currentPage + 1
    val absoluteOffset = min(abs(pagerState.currentPageOffset), 1f)

….

.background(
                            when (index) {
                                currentPage -> activeColor
                                    .copy(alpha = 1f - absoluteOffset)
                                    .compositeOver(inactiveColor)

                                nexPage -> activeColor
                                    .copy(alpha = absoluteOffset)
                                    .compositeOver(inactiveColor)

                                else -> inactiveColor
                            }, shape = RoundedCornerShape(50)
                        )