Skip to content

Timeline with your own markers

Timeline rows with any marker and any content; positions worked out from the list.

Timeline with your own markers Timeline with your own markers

val stages = listOf(
    "Deposit paid",
    "Installed",
    "Handover",
)
stages.forEachIndexed { index, stage ->
    JengaTimelineItem(
        position = JengaTimelinePosition.of(
            index = index,
            count = stages.size,
        ),
        marker = {
            JengaTimelineMarker(
                color = JengaTheme.colors.brand,
                content = {
                    JengaText(
                        text = "${index + 1}",
                    )
                },
            )
        },
        content = {
            JengaText(
                text = stage,
            )
        },
    )
}