MotionLayout - Android Study Jams 2021

Transcript

1. This work is licensed under the Apache 2.0 License North America Android Study Jams
2. This work is licensed under the Apache 2.0 License Start here: g.co/android/studyjams Collect your first badge!
3. This work is licensed under the Apache 2.0 License TOPIC DATE Intro Coroutine Sept 22 Return on Coroutine and intro to MotionLayout Sept 29 Return on MotionLayout and intro Using Hilt in your Android Apps Oct 6 Return on Hilt and intro to Advanced WorkManager Oct 13 Return on Advanced WorkManager and intro to Advanced Testing: Survey of Topics Oct 20 Return on Advanced Testing and intro to Jetpack Compose Basics Oct 27 Return on Jetpack Compose Basics and thank you Nov 3 Android study Jam Schedule
4. This work is licensed under the Apache 2.0 License Modern Android Development : MotionLayout Android Study Jams
5. This work is licensed under the Apache 2.0 License Learning Objectives ० How to add rich motion into your Android app. ० Animate anything that you can build using ConstraintLayout. ० Animate the location, size, visibility, alpha, color, elevation, rotation, and other attributes of multiple views at the same time. ० Create coordinated animations, involving multiple views, using declarative XML that are difficult to achieve in code. ० Animate collapsible headers with MotionLayout
6. This work is licensed under the Apache 2.0 License ० Familiarity with ConstraintLayout. Check this codelab to learn more about ConstraintLayout. ० Experience with Kotlin and XML syntax. ० Android Studio 4.0 or higher. Prerequisites
7. This work is licensed under the Apache 2.0 License Concept Overview What is MotionLayout?
8. This work is licensed under the Apache 2.0 License You can think of it in terms of capabilities as a mix between the property animation framework, TransitionManager, and CoordinatorLayout. : Nicolas Roard Source : https://medium.com/google-developers/introduction-to-motionlayout-part-i-29208674b10d
9. This work is licensed under the Apache 2.0 License It’s fully declarative You can describe the complex transitions in XML — no code is expected.
10. This work is licensed under the Apache 2.0 License Major components ★ Transition ◦ KeyFrameSet ▪ KeyAttribute ▪ KeyPosition ▪ KeyCycle ▪ KeyTrigger ▪ KeyTimeCycle ◦ OnSwipe ◦ OnClick ★ Start ConstraintSet ★ End ConstraintSet
11. This work is licensed under the Apache 2.0 License Available in Android Studio 4.0 & higher Motion Editor
12. This work is licensed under the Apache 2.0 License Quick tips
13. This work is licensed under the Apache 2.0 License What you’ll do • Define an animation with ConstraintSets and MotionLayout • Animate based on drag events • Change the animation with KeyPosition • Change attributes with KeyAttribute • Run animations with code • Animate collapsible headers with MotionLayout
14. This work is licensed under the Apache 2.0 License Let’s get started
15. This work is licensed under the Apache 2.0 License Start here: https://codelabs.developers.google.com/codelabs/motion-layou t#0 Collect your badges!
16. This work is licensed under the Apache 2.0 License Share what you’ve learned with #AndroidStudyJams #gdgmtl
17. This work is licensed under the Apache 2.0 License • Medium • Twitter • LinkedIn • Github Stay in touch
18. This work is licensed under the Apache 2.0 License Learn More
19. This work is licensed under the Apache 2.0 License Want to learn more about MotionLayout? • MotionLayout • MotionEditor • KeyCycle • Medium article series on MotionLayout Version 1.0
20. This work is licensed under the Apache 2.0 License Want to learn more? • Official Android Developers Site: https://developer.android.com/ • Android Samples on GitHub • Official Android Developers Blog (for announcements) • Android Developers Medium Blog (for more technical articles) • Android Developers YouTube channel • Follow @AndroidDev on Twitter • Subscribe to the Android Developer Newsletter • Official Kotlin language site Version 1.0
21. This work is licensed under the Apache 2.0 License Have a Question? Just ask Join our slack : bit.ly/gdgmontrealslack Joins our channel : #android-study-jams-2021
22. This work is licensed under the Apache 2.0 License Welcome back And congrats!
23. This work is licensed under the Apache 2.0 License Recap of MotionLayout ० MotionScene ० ConstraintSet ० Constraint ० Transition ० KeyFrameset ० KeyAttribute