This message was deleted.

# compose-android

[Slackbot]

This message was deleted.

[Stylianos Gakis]

Maybe this is what you’re looking for
https://developer.android.com/jetpack/compose/layouts/alignment-lines

[Stylianos Gakis]

Not sure then.
Maybe provide a screenshot of what you want and a screenshot of what you get

[Stylianos Gakis]

Is it for the vertical line between the points?

[Stylianos Gakis]

Don’t think you can do that with a simple column/row setup like that.

I’d do something like this

Column {
  LineWithText(filledCircle = true, text = "AED ...")
  LineWithText(filledCircle = false, text = "AED ...")
}

Where LineWithText would be responsible for drawing this part [pic] (Yes with the line cutoff like that)

[Stylianos Gakis]

The API could look smth like this

@Composable
fun LineWithText(
  text: String,
  isCircleFilled: Boolean,
  hasPreviousItem: Boolean,
  hasNextItem: Boolean,
)

Where the has[X]Item would control if the line is drawn above/below the circle too

[Stylianos Gakis]

Or just try out some existing solutions https://github.com/yeocak/ComposableTimelineView

[Advitiay Anand]

I think you'd have to draw this yourself using canvas-related APIs. I would certainly prefer that.

Otherwise you can try to find some libraries if they provide you with appropriate customisation.

[yschimke]

I think this talk might be a good starting point.

https://youtu.be/xcfEQO0k_gU▾

[Stylianos Gakis]

Honestly, I can definitely imagine each text item to be one which has a fixed width canvas at the beginning, and the text with weight(1f) at the end.
With a pure canvas approach you need to draw text in there, which makes me feel like it'd be at least more complicated no?

[yschimke]

Watch the video, you can lay out the text items in a custom layout, then use positioning to render just the joined dots with info from that layout.

[Pushpal Roy]

@huthefa You can checkout my library for drawing a timeline view in Compose. I have used Canvas to draw the lines and points.

https://github.com/pushpalroy/jetlime