I want to create a card flip animation (<like this>), and the only way I found is using `Modifier.dr...

# compose

[Alexander Sitnikov]

I want to create a card flip animation (

like this▾

), and the only way I found is using Modifier.drawLayer(rotationY = someValue), but this animation looks too distorted (

like this▾

). View has setCameraDistance() method, and RenderNode has this method too, but Compose doesn't use any of them. It seems to me that rotationY parameter is kinda useless without camera distance. Is there any way to create this card flip animation other than drawLayer ? Or maybe there's plans to include support for camera distance in future versions of Compose?

[Leland Richardson [G]]

cc @Nader Jawad

[romainguy]

That’s because Skia doesn’t do perspective correc transformations

[romainguy]

Camera distance would help but only to a certain point

[romainguy]

Still, seems worth adding

[romainguy]

(or picking a better default)

[Halil Ozercan]

@romainguy

Camera distance would help but only to a certain point

I was also going to say the same thing. Maybe scaling the view while also doing the animation help but not sure about that either

[romainguy]

No, the problem is more fundamental

[Zach Klippenstein (he/him) [MOD]]

You can kinda fake camera distance by scaling, like I do here: https://github.com/zach-klippenstein/compose-backstack/blob/main/compose-backstack/src/main/java/com/zachklipp/compose/backstack/BackstackInspector.kt

[Halil Ozercan]

yes, now thinking about scaling, the far end would look very weird

[Zach Klippenstein (he/him) [MOD]]

looks like this:

https://github.com/zach-klippenstein/compose-backstack/raw/main/.images/inspector.gif▾

[romainguy]

The text looks very very wrong in your example 😛

[romainguy]

These “3D” rotations are just shears/skews, which is why it looks bad on text or images

[Alexander Sitnikov]

should I file an issue then?

[romainguy]

Yes please

[Sergey Y.]

@Alexander Sitnikov But keep in mind that changes to the Skia runtime can only ship with a newer version of Android. Compose does not ship with its own version of Skia. 🙄

[Alexander Sitnikov]

https://issuetracker.google.com/issues/171492100

[romainguy]

We’re not talking about introducing true 3D transforms here, just the camera distance 🙂

[romainguy]

This doesn’t require touching Skia

[Nader Jawad]

camera distance has been added to the layer APIs in compose and should be available in a future release of compose

[romainguy]

Awesome, thanks Nader!