mazzouzi

@Composable
private fun Toolbar(scroll: ScrollState, headerHeightPx: Float, toolbarHeightPx: Float) {
    val toolbarBottom = headerHeightPx - toolbarHeightPx
    val showToolbar by remember {
        derivedStateOf { scroll.value >= toolbarBottom }
    }

    AnimatedVisibility(
        visible = showToolbar,
        enter = fadeIn(animationSpec = tween(300)),

mazzouzi

val titleXFirstInterpolatedPoint = lerp(
    titlePaddingStart,
    (titlePaddingEnd - titleExtraStartPadding) * 5 / 4,
    collapseFraction
)

val titleXSecondInterpolatedPoint = lerp(
    (titlePaddingEnd - titleExtraStartPadding) * 5 / 4,
    titlePaddingEnd - titleExtraStartPadding,
    collapseFraction

mazzouzi

val titleExtraStartPadding = titleWidthPx.toDp() * (1 - scaleXY.value) / 2

mazzouzi

@Composable
private fun Title(scroll: ScrollState, headerHeightPx: Float, toolbarHeightPx: Float) {
    var titleHeightPx by remember { mutableStateOf(0f) }
    val titleHeightDp = with(LocalDensity.current) { titleHeightPx.toDp() }

    Text(
        text = "New York",
        fontSize = 30.sp,
        fontWeight = FontWeight.Bold,
        modifier = Modifier

mazzouzi

private const val titleFontScaleStart = 1f
private const val titleFontScaleEnd = 0.66f
@Composable
private fun Title(scroll: ScrollState, headerHeightPx: Float, toolbarHeightPx: Float) {
    val collapseRange: Float = (headerHeightPx - toolbarHeightPx)
    val collapseFraction: Float = (scroll.value / collapseRange).coerceIn(0f, 1f)

    val scaleXY = lerp(
        titleFontScaleStart.dp,
        titleFontScaleEnd.dp,

mazzouzi

.
.
    Text(
        text = "New York",
        fontSize = 30.sp,
        fontWeight = FontWeight.Bold,
        modifier = Modifier
            .graphicsLayer {
                val collapseRange: Float = (headerHeightPx - toolbarHeightPx)
                val collapseFraction: Float = (scroll.value / collapseRange).coerceIn(0f, 1f)

mazzouzi

.
.
    Text(
        text = "New York",
        fontSize = 30.sp,
        fontWeight = FontWeight.Bold,
        modifier = Modifier
            .graphicsLayer {
                translationY = titleY.toPx()
                translationX = titleX.toPx()

mazzouzi

val titleY = lerp(
    titleYFirstInterpolatedPoint,
    titleYSecondInterpolatedPoint,
    collapseFraction
)

mazzouzi

val titleX = lerp(
    titleXFirstInterpolatedPoint,
    titleXSecondInterpolatedPoint,
    collapseFraction
)

mazzouzi

val titleXSecondInterpolatedPoint = lerp(
    titlePaddingEnd * 5 / 4,
    titlePaddingEnd,
    collapseFraction
)