Hey folks, I wanted to play with animations in Com...
# compose
w
Hey folks, I wanted to play with animations in Compose. And I found that there are several ways to do it. But I couldn't find good comparisons and reasoning behind those. It got me confused and curious. That's why I put together different methods and prepared a talk on creating animations in Compose. I gave it at droidcon EMEA today. Just wanted to share it with you. Here are the slides and demo repository. Slides: https://slides.com/wajahatkarim/composeanimations Github: https://github.com/wajahatkarim3/droidcon2020
โค๏ธ 3
๐ŸŽ‰ 22
z
these demos are great!! just reading descriptions of animations in code is nowhere near as fun as seeing actual GIFs of them in action beside the code.
โž• 1
๐Ÿ‘€ 1
w
Thanks zacklipp. Yeah I had to do some work to make GIFs. I always look for GIFs in the GitHub readme of repositories.
g
Very cool! Any easy spin animation recommendations?
I want to spin a fan control.
image
z
I bet you could create a thing that would create a gif of an animated composable by providing a custom frame clock.
w
I think this would be a fantastic idea. I will try to find some time to do this and see if I get any luck
a
Love it! I wanted to learn about animations with Compose so this is perfect!
g
animated gifs donโ€™t seem to work with the latest compose.
We have a really cool mutagent animation for batteries that comes up static.
grrr
Got the rotating image working. Here is the code:
Copy code
val animRotation = animatedFloat(initVal = 0f)
        onActive {
            animRotation.animateTo (
                targetValue = 360f,
                anim = repeatable (
                    iterations = AnimationConstants.Infinite,
                    animation = tween (
                        durationMillis = 1000,
                        easing = LinearEasing
                    )
                )
            )
        }
        Image(
            modifier = Modifier.drawLayer(rotationZ = animRotation.value),
            asset = fanSettingIconMap.get(mDataModel.fanSetting)!!,
            alignment = Alignment.Center
        )
๐Ÿ‘ 1
p
hi, @Wajahat Karim bottom app bar using animated visibility is really useful.. great work overall
๐Ÿ‘ 1
a
@Wajahat Karim sent a PR your way for the exploding Fab. Unless, for some reason, I'm the only one having this issue. https://github.com/wajahatkarim3/droidcon2020/pull/1
๐Ÿ‘ 1
๐Ÿ”ฅ 1
w
Thank you @Afzal Najam . I was actually looking into it and had plan to fix this after my talk at droidcon due to time issue. PR looks awesome and going to merge it. Thank you. ๐Ÿ™
๐Ÿ‘ 1
@Prashant Priyadarshi Glad that you liked it. It was fun to build it. It took less than 100 lines of code and like 30 mins or so. Compose is really powerful.
@Guy Bieber Heard at droidcon yesterday that Animated Vector Drawables support is coming to Compose, so GIF will probably follow then
๐Ÿ‘ 1
๐ŸŽ‰ 1
p
@Wajahat Karim, right, I always hated the xml way of doing ui and the amount of code one had to write. I feel that compose is going to be a big big change
even simple things like recycler view for showing items in a list was complicated