CODEWITHSUNDEEP
androidandroid-animationandroid-jetpack-compose
Ziv Kesten
Ziv Kesten

Reputation: 1242

Jetpack Compose play pause animation

I would like to achieve this UI using only canvas in jetpack compose, I can draw the circle, the pause lines and even the rounded corner triangle (using Path) But i don't know how to animate one to the other.

The triangle is a shape and the pause is 2 drawLine() on a Canvas object.

enter image description here

Upvotes: 2

Views: 1290

Answers (1)

Jawad
Jawad

Reputation: 31

You need to combine different shapes you have made using transform like below translate and rotate a triangle on the canvas. For Reference Graphics Docs

withTransform({
translate(left = canvasWidth / 5F)
rotate(degrees = 45F)}) {
drawRect(
    color = Color.Gray,
    topLeft = Offset(x = canvasWidth / 3F, y = canvasHeight / 3F),
    size = canvasSize / 3F
)}

Upvotes: 0

Related Questions