<https://twitter.com/chrisbanes/status/1293200464734019584?s=21>

# compose

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

https://twitter.com/chrisbanes/status/1293200464734019584?s=21

[Andrew Neal]

https://android-review.googlesource.com/c/platform/frameworks/support/+/1392720

[caelum19]

that's so cool

[Doris Liu]

The AnimatedVisibilty composable will be available in dev17. Please give it a try. Any feedback will be highly appreciated! 🙏

[Vinay Gaba]

looks slick!

[brandonmcansh]

This is giving me so many ideas now lol

[Joost Klitsie]

This looks very awesome, very smooth! Even better than the old school layout transitions (which are very helpful on their part) 🙂

[Colton Idle]

@Doris Liu looks awesome. I was one of the people who said that expand/collapse was at the top of my compose wishlist.

I haven't used compose yet, but I have two more questions:
1. Typically when my designer gives me an expand/collapse design like this they also give me a down arrow V that should animate to an up arrow ^. Is there an easy way to do this with AnimatedVisibility?
2. Typically when you're at the bottom of a list, lets say you have an FAQ or something. And each time you click a Question, you get a paragraph of an answer. If I use ANimatedVisibility, if you open the last question will it scroll down to show you the answer? If not, maybe thats a good feature request? I get this all the time from my PM and designers because they click the last item and I animate my arrow, but you can't actually tell that something opened below it.

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

1 seems like a good use case for the transition animation API, not this.

[Doris Liu]

@Colton Idle Yes to question 1, the expanding/collapsing is supported out-of-the-box, along with fading and sliding.

[Doris Liu]

2 is a great feature request for list. We should make it easy to wire up. 🙂

[Doris Liu]

AnimatedVisibility animates the content in while reporting an animated size (in between size 0 to full size) to its parent, if you position the to-be-expanded content right below where the down arrow is, you should get the expanding/collapsing behavior for free

[Doris Liu]

@Colton Idle I had no idea this was on the top of your wishlist. 😄 Curious what are the other things on your compose wishlist?

[Doris Liu]

https://github.com/chrisbanes/tivi/pull/682/commits/d8720e4a080b0f3af539490a0994209e5ff378ce Here's how Chris achieved the animated expansion in the demo linked above. 🙂

[Doris Liu]

@Zach Klippenstein (he/him) [MOD] I can't wait for you to give AnimatedVisibilty a try. 😄

[Colton Idle]

@Doris Liu my wishlist isn't all that long... but I do have a number two.

Number one was admittedly this:
https://twitter.com/ColtonIdle/status/1254846542126690311

Number 2 is text bounding box spacing:
i.e. In the current UI toolkit even if you stack 3 textviews on top of each other (or horizontally) and you dont want padding because this is what your designer gave you... the text views bounding boxes touch in the design, but at runtime they don't because of font padding. Even when you disable fontPadding, then you still have spacing/gaps, which makes it super tricky to match exactly what design gave you.

Maybe that's just me though, but I swear that even with fontPadding = false in xml, I still can't sometimes get my text to actually line up with each other the way my designer wants. (and I sometimes have had to resort to negative margin, etc)

[Doris Liu]

Looping in @Siyamed for the text feature request