Doris Liu @doris4lt Twitter profile

Pinned Tweet

Doris Liu

3 months

Have you tried the all new shared element transition API 💫as a part of today's compose-animation 1.7.0-alpha07 release? If you have any feedback/questions/demos, we would love to hear/answer/see them! 😊

Compose Animation | Jetpack | Android Developers

developer.android.com

3

10

114

Last Seen Profiles

@Serad87630

@SpicyCubanGirl

@Sn0wBreeze_VR

@pipionsolana

@ashishmode

@XplanXplanet

@rainswalls

@alucard_AOF

@OndrejKolar6

@LesMarjorie14

@_Godmara

@mdmacxe

@anst_sn_nw

@GhostinaGarage

@DeCachoni

@Donaydos

@Jake15539433

@dilfscentral

@sitiazieraa

@heavy_marx

@KantWilde

@tsunodako2023

@Daylightttdream

@nyano9o9_

@SoulChild868

@Chaudhary937426

@Leadsoldier3

@critterflux

@NOTSNFTS

@k_art_u

@curta_ctf

@mogulofficial_

@RTEsport

@JovLideresIB

@Wald_alqidoom

@Robertdrew82

Doris Liu

@doris4lt

1 year

Have you used our newly improved diagram? Easier life awaits (I hope)? 😋 #JetpackCompose #animation

$_Sudo_Shashank

@Sha_nk_s

1 year

Not using this diagram for your Jetpack Compose animation API choice? You're missing out, my friend! Easy life awaits! 🚀 #JetpackCompose #Android #androidev #animation

0

2

24

8

117

528

Doris Liu

@doris4lt

3 years

Starting to learn about `Row`in #JetpackCompose ? Here's an animation that could help illustrate how `Row`s behave when resized. We might add something like this in the API reference soon! 😀 Inspired by:

13

113

526

Doris Liu

@doris4lt

2 years

Yup, LookaheadLayout is a new concept that we've been building. I can barely contain my excitement about the possibilities it opens up, shared element, auto-resizing, and more! 🤩🥰 Should be ready to release soon. Spoiler: LookaheadLayout + movableContentOf = 🤯 Sneak peek: 👇

Jaewoong Eum

@github_skydoves

2 years

Introduce LookaheadLayout for Jetpack Compose. This allows us to look ahead and calculate a new layout while allowing the actual measurement & placement of every frame to be different than the pre-calculation. Morph animation, SharedElementTransition.

4

28

208

15

99

513

Doris Liu

@doris4lt

3 years

Animating content in and out of a container in #JetpackCompose has been made easy with the 🆕 `AnimatedContent`, coming in beta09 release! ✨ Here's sneak peek of what you can build with AnimatedContent using ~10 lines of animation code (Neo not included 😜):

13

58

345

Doris Liu

@doris4lt

3 years

What can you accomplish with 3 lines of animation code in #JetpackCompose ⁉️ I'm glad you asked.... 😋😆 1⃣line (in a loop) for a spring chain 1⃣line for expanding/collapsing 1⃣line for icon rotation on click Full source code:

3

37

231

Doris Liu

@doris4lt

3 years

📥Enter/Exit📤 Transition has just been made more powerful and fun in #JetpackCompose with the new `AnimatedVisibilityScope`. (🆕 in beta07.) 🤩 Children of `AnimatedVisibility` now can have their own enter/exit transition via convenient `Modifier.animateEnterExit`💫

10

35

230

Doris Liu

@doris4lt

4 months

Here's a sneak peek of a shared element transition demo that I recently built👇 in #JetpackCompose The new APIs will be released soon, along with sample code for building this demo.☺️ If you feel impatient, try it out in the latest snapshot build at:

Halil Özercan

@halilozercan

4 months

You know what else got merged today?

1

3

55

4

42

230

Doris Liu

@doris4lt

3 years

Are you looking to add some spark to your app with animations? ✨🤩 We have a carefully designed #JetpackCompose animation code lab to give your learning curve just the right amount of `Easing`. 😛🤣

Animating elements in Jetpack Compose | Android Developers

In this codelab, you’ll learn how to use some Compose Animation APIs.

developer.android.com

2

37

184

Doris Liu

@doris4lt

3 years

The new #jetpackCompose animation 1.1.0-alpha02 comes with a couple of highly requested features. See: 🆕 Scale Enter/ExitTransition for AnimatedVisibility/Content and Nav transition 🆕 StartOffset for repeatables ➡️ You can create this with ~20LOC: 👇

6

26

155

Doris Liu

@doris4lt

3 years

Ever wondered what you can animate with a one-liner in your #JetpackCompose code?🤩 Does that make you curious about what else you can do using the animation system?🧐 We have answers for you in our hot off the press animation tutorial:

Animations in Compose | Jetpack Compose | Android Developers

Animations in Compose are easy to use, and provide great interactions in your apps.

developer.android.com

9

18

132

Doris Liu

@doris4lt

4 months

How well does the new Compose shared element API handle text❓🧐 Well... I'll let you be the judge of that.😉 See 👇 for shared texts transforming the font size change BTW, this is the default behavior for `shareBounds` in the latest androidX snapshots:

6

14

135

Doris Liu

@doris4lt

4 years

Check out the new `Animatable` API in #JetpackCompose that achieved this bounce-off-the-wall animation with <30 lines of animation code! (API available in compose alpha 10) Code is here:

8

14

128

Doris Liu

@doris4lt

3 years

From the thrill of rendering the first rectangle (3+ years ago), to now celebrating the stable release, it's been an incredible journey!🤩 Seeing how Compose enables easy and even fun Android dev has made agonizing over little details, design & re-design totally worthwhile! 🥳🎉

Android Developers

@AndroidDev

3 years

#JetpackCompose 1.0 is ready and waiting for you. See how Compose makes it faster and easier to build beautiful, high quality apps. 🤖🎉 🎉🤖

5

106

414

3

7

125

Doris Liu

@doris4lt

2 years

#JetpackCompose animation debugging just got more fun. 🥰 With the support for "Animator Duration Scale" you can inspect your compose animations in slo-mo. 🐌🐌 Thanks @ppvi for filing the feature request!

3

7

112

Doris Liu

@doris4lt

4 months

🔥💯🥰🥳 Super thrilled to see the new shared element API enable apps to add polish and delight. ♥️ Please feel free to tag me with the shared elements you build, 🤩 or ask me questions about the API.

Stylianos Gakis

@GakisStylianos

4 months

With the current androidx SNAPSHOT builds that include shared element transition support and with androidx.navigation supporting in-app predictive back gesture animations , you can with very few lines of code get shared elements that are also animating as you are gesturing back!

7

9

110

1

10

101

Doris Liu

@doris4lt

3 years

compose-animation 1.1.0-alpha05 was released today! 🎉🎉 🙂Good news: Non-extension AnimatedVisibility APIs graduated from experimental 🙃Another news: There was one last round of API tweaks (parameter re-order only) on Enter/ExitTransition 🙇‍♀️

Compose Animation | Jetpack | Android Developers

developer.android.com

2

16

86

Doris Liu

@doris4lt

3 years

Source code below. You'll also find this sample code in the API reference. 🥳

0

6

77

Doris Liu

@doris4lt

3 years

The collapsible Toolbar looks super playful! 🔥🤩 I also love the item enter animation and the fun mode-switch animation in the Toolbar! 🥰 Well done!

racka🚀👨‍💻 🐀

@rackadev

3 years

Animations are just so easy & fluid with #JetpackCompose You can do whatever you want. I made a collapsing TopBar that changes size with scrollOffset & it's smooth af. Twitter will probably butcher the frame rate so here's full res: #AndroidDev

4

15

122

1

7

76

Doris Liu

@doris4lt

4 months

This looks incredible!!!🔥🔥 Wow....just wow..... 😇🥳😍🧁

Abdul Basit

@abdulbasitgd

4 months

After seeing some demos with Shared Element Transactions, I wanted to give it a try with Recipe App and it turned out to be great. Also, the configuration was super easy. #androiddev #JetpackCompose

8

16

185

1

3

76

Doris Liu

@doris4lt

2 years

🤔🤔Thinking about building a modifier that animates size and position as a result of modifiers change: Modifier.animateLayout( if (condition) someModifiers else otherModifiers ).restOfModifierChain() Would 👆be useful? If so, I'd love to see your use cases! ✨

9

70

Doris Liu

@doris4lt

19 days

Can't wait for the video to come out! 😆🥳❤️

Rebecca Franks

@riggaroo

19 days

Just finished recording the Advanced Layout Animations in Compose talk with @doris4lt 😎 coming soon to YouTube 📺

4

2

100

2

69

Doris Liu

@doris4lt

2 years

The tooling for Compose animation is super cool. There's been some recent improvements on curves visualization. 🤩🥰 Another awesome new feature is the support for `AnimatedVisibility`. Woohoo! 🎉🎉 Definitely recommend check it out:

Tools for Compose | Jetpack Compose | Android Developers

Android Studio brings a lot of new features specifically for Jetpack Compose. It embraces a code-first approach while improving the developer productivity without having to choose between using...

developer.android.com

Anton Shilov

@antonshilov_

2 years

One of the cool things about Compose transitions api is that you can debug them frame by frame in Android Studio

1

7

62

1

9

60

Doris Liu

@doris4lt

3 years

Highly recommend this tutorial to anyone who's looking to add navigation transition animations to their #JetpackCompose app! Well done Mitch! 👏👏

Mitch Tabian

@mitch_tabian

3 years

New animations for compose navigation transitions:

2

15

92

1

5

62

Doris Liu

@doris4lt

3 years

Check out this super cool elastic tab indicator that my coworker Louis Pullen-Freilich built. Full demo code:

2

6

59

Doris Liu

@doris4lt

2 years

Cascading menu was one of the canonical use cases that AnimatedContent was designed for. It was a fun challenge to support size transform animation _while_ the content is changing (rather than after). Glad to see it working out beautifully in this DropDown library. 😍

✨Ranbir Singh

@android_poet

2 years

Published a new open-source library, Dropdown! 💧Dropdown is a Jetpack Compose customizable dropdown menu with cascade and animations. Github: #android #opensource #github #colorpicker #jetpackcompose #AndroidDev

1

6

36

0

4

58

Doris Liu

@doris4lt

2 years

Glad to see folks playing with the API already! 🤩 LookaheadLayout is designed to be powerful and flexible rather than convenient, as it's a low level API. We are actively working on it and building convenient animation APIs on top of it. Stay tuned!✨✨

Jaewoong Eum

@github_skydoves

2 years

So you can achieve the shared element transition and auto-resizing animations with Compose UI 1.3.0-alpha01. LookaheadLayout + movableContentWithReceiverOf = 🚀

2

11

100

1

4

58

Doris Liu

@doris4lt

2 months

We just deprecated scaleSharedContentToBounds. Instead, we introduced two ResizeModes: ScaleToBounds and RemeasureToBounds to make the choice more explicit in sharedBounds.👇 If you only use fade in sharedBounds, you may want to specify RemeasureToBounds to keep the behavior

Rebecca Franks

@riggaroo

2 months

🗞️A small update to Shared element APIs: resizeMode parameter on Modifier.sharedBounds(). Allowing you to specify how the item should be resized between the two states. More information: #JetpackCompose

3

8

79

1

5

54

Doris Liu

@doris4lt

3 years

Are we getting uncomfortably excited about this or what! 😆🥳

Android Developers

@AndroidDev

3 years

🤔 Tweet your questions on Jetpack Compose using #TheAndroidShow . Join us on February 24 at 9AM PT for #TheAndroidShow with @KariByron , where you'll hear the latest on Compose from devs including @davey_burke . Go behind the scenes →

13

151

530

2

5

51

Doris Liu

@doris4lt

2 years

It was a pleasure to chat with @FMuntenescu about building #JetpackCompose animation system. Lots of fond memories rushed back.😊 It's also been inspiring 🤩 to see a constant stream of creativity from the community.🎉 Glad we were able to showcase some of the awesome animations.

Android News

@AndroidNewsOk

2 years

#TheAndroidShow : Behind the scenes with animations & Jetpack Compose | Android Developers - Youtube Channel | #android #AndroidDev

0

3

10

1

5

49

Doris Liu

@doris4lt

3 years

Getting this ready for the official Android reference doc! Woohoo! 🥳 Is there anything else in #JetpackCompose you'd like to see an animated visualization of? 😀

2

7

48

Doris Liu

@doris4lt

3 years

Check out Animation Reimagined💫✨ at , where we'll show you cool animation APIs for #JetpackCompose Special thanks to @bentrengrove for inspiring the last weather example, and to @manueldidonna @MaciejCiemiega & @_aurimas for creating awesome animations

Reimagine animations system for a delightful development experience...

In Jetpack Compose, we have completely reimagined what the animations system can be like for a delightful development experience. In this talk, we first high...

www.youtube.com

0

15

49

Doris Liu

@doris4lt

2 years

Check out Orbitary! 🥳 The size and position animation APIs offered in Orbitary are very similar to what I imagined animations built on top of LookaheadLayout would look like.🤩👍 I'm super excited to see them released in a library! Well done!👏🎉

Jaewoong Eum

@github_skydoves

2 years

Published a new open-source library, Orbitary. 🪐 Jetpack Compose animation library that allows you to implement animations such as shared element transition. This is experimental and you can check how to modulate LookaheadLayout and examples.

2

24

163

1

4

48

Doris Liu

@doris4lt

3 months

@android_I_AM @metehanbolatt @JorgeCastilloPr @mobiledev_pro We are working on an official guide that will go into details on how to build shared elements, different use cases, and tips. Spoiler alert😉: it has a section about modifier order. It should be released soon. Stay tuned!

4

46

Doris Liu

@doris4lt

2 years

👆 Wireframes indicate the layout bounds of the items calculated by the LookaheadLayout. ✨Each item is a movableContentOf, which made it possible to move them between a single column and a double-column layout without losing their animation states. 🤯

3

2

45

Doris Liu

@doris4lt

4 years

@chrisbanes `AnimatedVisibility` is now available in compose animation library as a part of the compose dev17 release 😀: Here's an example of using AnimatedVisibility for adding/removing items in a `LazyColumn`. (Demo code: )

0

8

43

Doris Liu

@doris4lt

3 years

Super thrilled to chat about the motivations and decisions that went into designing the #jetpackCompose animation and graphics system on ADB podcast with @nadewad . 😆✨ @crafty and @chethaase were amazing hosts, as usual! 🎉

Nick Butcher

@crafty

3 years

2 of my favourite topics in this next episode: #JetpackCompose Graphics & Animations (🤫 don't tell the other topics!) @doris4lt & @nadewad join us to discuss how these traditionally imperative systems work in this brave new declarative world.

1

8

25

3

2

42

Doris Liu

@doris4lt

3 months

🎉👏🍕

Metehan Bolat

@metehanbolatt

3 months

[EN] We can write the codes as required and create a transition with a single Modifier function. The whole secret is only in shareBounds. You can get the demo with small touches on the code in the video. I would be happy if you could try it and share your ideas. [TR] Olması

3

6

73

1

41

Doris Liu

@doris4lt

3 years

Visitors are lining up at the visitor entrance. Very civilized. 👏😆

1

40

Doris Liu

@doris4lt

3 years

Wait no more! Jetpack Compose Beta is finally here! 🥳🥳 Oh boy, I'm gonna have to recompose myself for this! 😉 #TheAndroidShow

Karen Ng

@karenkayliu

3 years

It's here! Jetpack Compose Beta 🥳 🚀 New animation APIs, accessibility, coroutines and arch components support. 🛠 New tools with layout inspector, animation preview, live literals, and interactive previews. 🎬 Watch the fun live at #TheAndroidShow

3

99

366

1

37

Doris Liu

@doris4lt

3 years

This looks amazing! Love this Jetpack Compose version of Newton's Cradle! 😻😻😻

Maciej Ciemięga

@MaciejCiemiega

3 years

@intelligibabble Thanks @intelligibabble :) Sure, here it is. I've also just added gif to the README on GitHub. It was really fun to implement!

13

38

278

1

36

Doris Liu

@doris4lt

3 years

Check out our ongoing effort on use case driven demos: 🎉🎉 Please let us know if there's any particular use case you'd like to see added to the collection. 👆

Yuichi Araki

@yuichi_araki

3 years

マテリアルデザインの頻出アニメーションパターンを Jetpack Compose で実装したサンプル MotionCompose を公開しました。これからもパターンを追加していきます。何か見たいアニメーションがあればリクエストください。

1

30

137

1

10

36

Doris Liu

@doris4lt

3 years

This was the statue last time I was in the office. Two thoughts: 1️⃣ The pandemic has lasted too long! 😤 2️⃣ We have accomplished so much during that time! 👏🤩

Android Developers

@AndroidDev

3 years

📸 Say Android! 📸 Join us for a virtual Android developer community group photo, and tag a friend to come along! Where: Android 12 statue in the #GoogleIO Adventure When: May 20th at 9:15 AM PT Register for #GoogleIO to join us in Adventure →

14

89

463

0

34

Doris Liu

@doris4lt

9 months

So smooooooooth! 😍😍

sinasamaki

@sinasamaki

9 months

#ComposeMultiplatform will never reach 100% adoption in the platforms it targets But it will enable many kotlin developers(🙋‍♂️) to build beautiful apps beyond Android and I am excited for that 🥳 thanks @kotlin team

5

13

194

0

34

Doris Liu

@doris4lt

4 years

Really thrilled to see the amazing work that our community has done using #JetpackCompose . 🎉🎉

Elye

@elye_project

4 years

Program Flappy Bird using #JetpackCompose . Thanks to @alexjlockwood for the initial inspiration on the UI Animation in #JetpackCompose . Code and sharing in

6

26

231

1

3

33

Doris Liu

@doris4lt

4 years

Such beautiful work!! @_gurupreet 👏👏🥳 The creativity from our amazing developer community never ceases to amaze me! 😁🎉

Gurupreet singh

@_gurupreet

4 years

Finished some charts demo in #jetpackcompose and using latest Animatable suspend animation api thanks to @doris4lt for that. To showcase the use of chart also integrated it to crypto app in cookbook. check it out at #AndroidDev

4

27

160

2

1

31

Doris Liu

@doris4lt

4 months

@GakisStylianos @midofnowhere02 There's a `placeHolderSize` param in `Modifier.sharedBounds` that you can configure to change the space that sharedBounds occupies in its parent layout. By default, the parent sees no change. If you set `placeHolderSize = animatedSize`, parent layout will animate to accommodate🔥

1

31

Doris Liu

@doris4lt

3 years

It was so much fun to hang out with @seebrock3r and @hamen , and chat about animations! Thanks for having me! ☺️ Highly recommend checking out @codewiththeita channel on both Twitch and Youtube. Lots of fun explorations in Compose.🤩🤩

Code with the Italians

@codewiththeita

3 years

We've had a lot of fun, and as usual, learnt a ton from our guest! Thanks a lot @doris4lt and everyone who participated 🙌 The recording is already available on Twitch, and we'll have it on our YouTube archive in 2 days. Don't forget to subscribe 🤗

0

2

11

2

4

30

Doris Liu

@doris4lt

3 years

Check out this video where @mitch_tabian walks you through building an infinite shimmer animation. Really impressed with how well explained the animation and graphics concepts are! Well done, Mitch! 👏

Mitch Tabian

@mitch_tabian

3 years

Jetpack Compose (beta) Animations (Shimmer animation)

0

8

77

1

0

30

Doris Liu

@doris4lt

2 years

What fancy effect can you achieve with `animateContentSize` modifier? 😉 In case you 🤔, see 👇👇

Cengiz TORU

@cengiztoru1

2 years

Hi 🖐. Dynamic Island in Android with Jetpack Compose. Don't forget to star the repo 🌟 #Android #AppleEvent #iPhone14 #iPhone14ProMax #AndroidDev #DynamicIsland #JetpackCompose #programming #100DaysOfCode

6

22

105

2

6

27

Doris Liu

@doris4lt

7 years

Super excited about me and @chethaase 's animation talk (Android Animation Spring to Life) today at 2:30PM! #IO17

1

9

29

Doris Liu

@doris4lt

2 years

Super excited about chatting with @codewiththeita tomorrow! 😀 If you have any questions about #JetpackCompose animations (APIs, roadmap, tips, etc), please let us know in the slido below👇

Code with the Italians

@codewiththeita

2 years

Imagine there was a new Animation API in #JetpackCompose , and imagine we wanted to chat about that with the Queen of Animations Doris Liu ( @doris4lt ). Stop imagining it, join us tomorrow, and if you have questions, head here #AndroidDev #LearningTogether

1

5

16

0

8

29

Doris Liu

@doris4lt

4 months

@heyrikin That's so great to hear! ♥️🥳 In case at some point you need a way to animate out the bottom bar in the overlay, consider `Modifier.renderInSharedTransitionOverlay(). animateEnterExit(.., slideOutVertically(..))` 😉

2

1

28

Doris Liu

@doris4lt

2 months

Super excited about meeting everyone @droidconBerlin .🥳❤️ Is there anything particular that you are curious about on the topic of Advanced Layout Animations? If so, please let us know! 📣

Rebecca Franks

@riggaroo

2 months

I'll be (*hopefully) speaking at @droidconBerlin alongside my colleague @doris4lt about Advanced Layout Animations in Compose! I'll be giving out my latest creation android keyrings 🔑 #dcbln24 * say a prayer to the visa overlords for me 😁🤞

11

10

83

2

28

Doris Liu

@doris4lt

7 years

@crafty and I will be talking about cool new moves in Android animations @360andev on July 13th. Can't wait to see you all there!

1

7

28

Doris Liu

@doris4lt

4 months

@heyrikin lol How true!! The best time to take a vacation is after the build cut for the release, but before the release is out of the door. It's the "quiet period". 🤣

2

0

25

Doris Liu

@doris4lt

3 years

A place to showcase open source compose animations sounds like a cool idea! 🤩🤩

Dr.

@__Doci__

3 years

@fatih_grs Thanks for your talk at Android Worldwide. I asked this question there but, what I mean is a website that developers put their compose animations there and we could get the code easily for different animations. I didn't mean if compose supports Lottie or not.

3

0

6

4

0

24

Doris Liu

@doris4lt

2 years

Check out Orbitary - an amazing animation library leveraging the new LookaheadLayout in #JetpackCompose ! 🥰👏🔥🪄

Jaewoong Eum

@github_skydoves

2 years

Orbitary version 0.1.2 has been released! 🪐 Jetpack Compose animation library that allows you to implement animations, such as shared element transition. Thank you @doris4lt for sharing your amazing insights for this release.

1

13

72

0

1

22

Doris Liu

@doris4lt

3 months

@viru1100 You didn't do anything wrong. I have a fix for that in code review right now.☺️ My test for the fix is basically what you did in the video, but done programmatically. 😸 Once the fix lands, you could try out the snapshot, or wait for the next alpha.

2

0

22

Doris Liu

@doris4lt

2 years

We would love to hear about your experience building animations, not just in Compose but on any platform! 🤩👇 Your past experience and pain points in building complex animations could help us design a happy path in the upcoming features for Compose animation.🙂

Rebecca Franks

@riggaroo

2 years

We have been working to enhance Compose animations (I'm excited!) and would love to hear what you think ✨ Want to participate in the user study for it between 5/31 - 6/3? 🤩 Sign up here 👇🏻 #JetpackCompose #AndroidDev

7

31

74

2

22

Doris Liu

@doris4lt

1 year

For more animation content, see Kudos to @riggaroo 🎉

Animations in Compose | Jetpack Compose | Android Developers

Animations in Compose are easy to use, and provide great interactions in your apps.

developer.android.com

0

22

Doris Liu

@doris4lt

4 months

@GakisStylianos perhaps we could start a # sharedElementTips series together here, with bite sized tips in each short post. 😊 Would people find it helpful❓

Stylianos Gakis

@GakisStylianos

4 months

PSA for the Compose devs playing around with the new `.sharedElement` modifier. Do not do this ``` Box(Modifier.size(...).background(...).sharedElement(...)) ``` Do this instead ``` Box(Modifier.sharedElement(...).size(...).background(...)) ``` Don't ask me how I know 🥹

5

95

1

0

22

Doris Liu

@doris4lt

7 years

If you are looking to bring the animations on your Android app to the next level, this talk might be just what you need. ;)

0

9

21

Doris Liu

@doris4lt

3 years

@objcode @zachklipp Animate with Compose and convert screen recording to gif... 😝

3

0

21

Doris Liu

@doris4lt

2 years

Very helpful visual for different ContentScale options. 👏👏

sinasamaki

@sinasamaki

2 years

I get confused sometimes how to scale images in #JetpackCompose . Here is an animation of all the possible ContentScale options. here is an article where I go over this and many more image loading options. #AndroidDev #kotlin

2

7

41

0

3

18

Doris Liu

@doris4lt

2 years

@ianhlake @JorgeCastilloPr @mikewolfson @shakil807 @dorisliu Yup. We intend for AnimatedContent to build on top of LookaheadLayout so that AnimatedContent supports shared element out of the box. AnimatedNavHost will get shared element as a result of being based on AnimatedContent.

1

0

19

Doris Liu

@doris4lt

6 years

A must-watch talk that shared all the thoughts that went into ShapeShifter, as well as its really cool path morphing algorithms. The tool makes creating AnimatedVectorDrawables a breeze.

Alex Lockwood

@alexjlockwood

7 years

my @droidconSF talk on path morphing is up!

4

17

74

0

7

17

Doris Liu

@doris4lt

3 years

Thank you Adriano, and everyone else who has been a part of the journey of helping #JetpackCompose get to Beta. Hopefully the ride wasn't too bumpy. 🤣 It was the numerous insightful feedback from the Android community that enabled us to continuously improve Compose. 🙏🥰🎉

Adriano Celentano

@SophosAdriano

3 years

Reading through the animation docs of #JetpackCompose makes me happy :) for me personally, it was totally worth changing those APIs last minute, especially making transitions is much more intuitive for me now.

0

1

14

0

1

18

Doris Liu

@doris4lt

3 years

Thinking about writing something about #JetpackCompose animation. Is there anything you are particular curious about?

Internals

58

Tips

48

Walk thru a fancy example

139

Other (please specify)

10

9

4

18

Doris Liu

@doris4lt

3 years

@fornewid Thanks! 🙂 Navigation transition is one of the major use cases that AnimatedContent is designed for. There's still some work remaining before AnimatedContent can be used with navigation. Stay tuned!

1

2

17

Doris Liu

@doris4lt

3 years

Want to have your work used by millions of developers, and seen by billions of users?🤩 Want to work with an awesome manager and great co-workers?🔥 We have a job opening on Android Toolkit/Text team (in Mountain View)! 👇👇

1

18

Doris Liu

@doris4lt

4 years

Very cool blogpost on the new Jetpack Compose Transition API. 👏

Joe Birch

@HiThereJoe

4 years

I built this @materialdesign Multi-Action Floating Action Button in Jetpack Compose, utilising some of the new Transition API 🙌 I wrote up a deep-dive into how this was built, here 👉 #AndroidDev #GDE #JetpackCompose

1

17

110

1

17

Doris Liu

@doris4lt

7 years

If you are interested in animations and AnimatedVectorDrawable, you definitely should check this out!

Nick Butcher

@crafty

7 years

Here are the slides from @doris4lt and my #AnDev360 advanced Android animation talk (hit ℹ️ for notes):

4

66

192

0

8

17

Doris Liu

@doris4lt

3 months

On the leading edge... 🤩💫💯

junkfood

@midofnowhere02

3 months

🙂‍↔️🙇🤳☝️ nobody asked but isn't it cool to have all these new fancy animation APIs in a single demo? #AndroidDev #JetpackCompose

4

5

64

0

1

17

Doris Liu

@doris4lt

3 years

Yes, it's important to check for CancellationExceptions if you need to ensure an animation has finished successfully. The default interruption behavior for animations in coroutine is to throw a CancellationException and therefore cancel the subsequent work.

Jossi Wolf @[email protected]

@jossiwolf

3 years

Friendly reminder that with Compose animation APIs using Coroutines it's important to check for CancellationExceptions if you're relying on the animation to run! Bottom Sheets, Drawers and all swipeable components fall into that category too :) #JetpackCompose

2

4

45

0

16

Doris Liu

@doris4lt

2 years

@theapache64 This is one of the critical pieces for shared element. I'm currently building another essential piece for shared element in layout. Hopefully when this is all finished, your code snippet above would produce an animation with a couple of lines added. 😀

1

0

16

Doris Liu

@doris4lt

1 year

@JorgeCastilloPr I'm experimenting with supporting shared elements in AnimatedContent leveraging lookahead: http://aosp/2499518 We'll likely need to build the capability to render content in overlay as a prerequisite. Compose Navigation will get the shared element from AnimatedContent. 🙂

1

0

15

Doris Liu

@doris4lt

2 years

Super insightful and informative talk by @queencodemonkey on Compose animation. ❤️👏🔥 Loved the comparison between Compose and View, on the APIs and also on the mental model!

Droidcon Vietnam

@droidconVN

2 years

Watch @queencodemonkey sharing with us how to make Animations in Compose.

0

3

8

1

4

15

Doris Liu

@doris4lt

3 years

@alexjlockwood Let's do it! 🤩

0

15

Doris Liu

@doris4lt

2 years

Woohoo! 🙌🥳♥️✨

Code with the Italians

@codewiththeita

2 years

. @doris4lt we made it to @androidweekly 😍 🎊 Thank you all for the support ♥

0

6

17

0

15

Doris Liu

@doris4lt

3 months

PSA #2 We made both Modifier.approachLayout and ApproachLayoutModifierNode stable🥳, with one last change to them🙃: isMeasureApproachComplete has been changed to `isMeasureApproachInProgress`, same for placement If you use approachLayout, please make sure to negate the lambda

0

2

15

Doris Liu

@doris4lt

3 years

@theRyanSimon There are more demos in the code base: ComposeCookbook from @_gurupreet : , samples from our team: and @vinaygaba 's are all wonderful materials to learn compose 😃

1

2

14

Doris Liu

@doris4lt

2 years

Great article on LookaheadLayout!👏🤩 The concept of intermediate layouts is very well explained and illustrated! 🔥🥰 P.S. Google Translate works amazingly well in translating tech blogs 😉

0

1

13

Doris Liu

@doris4lt

3 years

Very elegant and playful! 🔥🥰

0

14

Doris Liu

@doris4lt

3 months

@metehanbolatt @JorgeCastilloPr @mobiledev_pro The order of modifiers definitely matter. 🙂 The rule of thumb is to put what's shared between two shared elements/bounds *after* the sharedFoo modifiers, such as shape, border, etc, and what's not shared before the sharedFoo modifier (e.g, padding, etc)

1

3

14

Doris Liu

@doris4lt

3 months

@ychescale9 Looking great! 🔥👏🤩 Thanks for sharing the initial impressions! 🙏 On a related note, we are exploring potentially providing a global SharedTransitionScope. Though there's non-trivial amount of prerequisite work. Stay tuned!

1

0

14

Doris Liu

@doris4lt

3 years

@chrisbanes I accidentally watched it at 2x and was super impressed at how fast you typed and how quickly AS gave suggestions. 🤣

2

0

14

Doris Liu

@doris4lt

3 months

PSA #1 We changed the default enter/exit for `Modifier.sharedBounds` from fade to fade + dynamically scale If you built shared elements using snapshot builds, you may see some behavior change/improvement. Changing enter/exit to fadeIn/Out will restore the previous behavior.

1

2

14

Doris Liu

@doris4lt

3 years

Woohoo! 🎉🎉🎉

Vivek Singh

@2307vivek

3 years

Implemented animations while navigating between screens in my #JetpackCompose sample app #Adopty using "accompanist-navigation-animation" library. Navigation animation library is great. Fun and easy. #AndroidDev

1

16

71

0

3

14

Doris Liu

@doris4lt

4 years

Great talk on building Jetpack Compose UI, with examples on themes, layout, and animation. Highly recommend! 👍🎉

Android Developers

@AndroidDev

4 years

😃 Easier Android UI with Jetpack Compose Join @crafty as he dives into #JetpackCompose examples showcasing Dynamic Theming, the modifier system, and more! #11WeeksOfAndroid Watch →

2

66

246

0

14

Doris Liu

@doris4lt

3 years

Here's the ~20LOC for the loading animation 👆😜 :

3

1

14

Doris Liu

@doris4lt

3 years

Very nice illustrations for different AnimationSpec behaviors! 👏🥰

Elye

@elye_project

3 years

In Jetpack Compose Animation, we have AnimationSpec with Easing (like interpolator). To understand their behavior, I have created an App that plots them into graphs as an example shown below. Checkout #JetpackCompose #AndroidDev

2

33

183

1

2

14

Doris Liu

@doris4lt

2 months

droidcon Berlin

@droidconBerlin

2 months

Two minds, one stage! 👏 Join @riggaroo & Doris at #dcbln24 as they explore the new #Android #Lookahead layout system in #Compose for smooth animations & shared element transitions. Learn how to take advantage of it for your #animations .

0

5

32

1

0

14

Doris Liu

@doris4lt

3 years

@_gurupreet Compose cookbook has inspired both the Android community and folks working on Compose with the variety of use cases it presents elegantly!🥰🤩 Thank you for the amazing work! It's been truly inspiring! 🔥🎇🎆

1

2

13

Doris Liu

@doris4lt

2 years

Woohoo, my chat with @codewiththeita on LookaheadLayout is out now on Youtube: !🔥🔥 Check it out and let me know if any of the ongoing explorations I shared is useful for you! Thank you @codewiththeita for being awesome hosts! 🙏

How to create animations Jetpack Compose

In this episode, we had Doris Liu from the #jetpackcompose team, and we talked about creating spectacular animations! Two Italian coders live-stream their sw...

www.youtube.com

Code with the Italians

@codewiththeita

2 years

VOD TIME!! 🎊 Our latest episode with Doris Liu ( @doris4lt ) about animations with #JetpackCompose is live! Check out the video Join the giveaway: 1. Subscribe 🔔 2. Like 👍 3. Comment with "LookAheadLayout" WIN A FREE TICKET FOR @droidconNYC ! 🤑🎟️

0

2

11

0

1

12

Doris Liu

@doris4lt

2 years

@csinco @codewiththeita @philipcdavis Very cool! 🤩🤩 Love the slingshot effect by pulling down in the end there!🔥🔥

1

0

13

Doris Liu

@doris4lt

4 months

@Snokbert Looking very nice already! 😻👏 By the time sharedBounds API is officially released, your app is probably ready to ship with shared elements already. 🥳 Let me know if you run into any issues using movable content.

1

0

12

Doris Liu

@doris4lt

2 years

@queencodemonkey @Android Aww.. Thank you Huyen! I'm super flattered!😊🤗 Hopefully everything that went into the APIs would bring a little delight to people using them. 😁

0

12

Doris Liu

@doris4lt

4 years

🎉👏

Gurupreet singh

@_gurupreet

4 years

@crafty Finally got to try @androidstudio animation inspector with #jetpackcompose . Thanks @amaurymedeiros for letting me know about it. Gonna definitely use it to fine tune animations. Super handy 🙌🙌 Check all animations at : #AndroidDev #androidstudio

1

11

64

0

12

Doris Liu

@doris4lt

2 years

@ppvi Haha, landing soon indeed, but not yet due to a small increase in memory usage from wiring up with ContentResolver to read settings. 🙃 Good news is because we don't rely on new framework APIs for duration scale, this will be available for all API levels that support Compose.😆

1

0

11