Flutter Tutorial - Animated Switcher - Deep Dive

Подписаться 200 тыс.

Просмотров 15 тыс.

50% 1

With the Animated Switcher you can change between widgets with the help of custom-built animations in Flutter.
Click here to Subscribe to Johannes Milke: ru-vid.com...
👉 12 Week Flutter Training | heyflutter.com
👉 Flutter Masterclass Courses | heyflutter.com/masterclass
Source Code | github.com/JohannesMilke/anim...
My Courses | heyflutter.com
Follow Newsletter | johannesmilke.com/newsletter
SUBSCRIBE HERE
bit.ly/JohannesMilke
SUPPORT & SPONSOR ME
github.com/sponsors/JohannesM...
RESOURCES
Page Transition Tutorial: • Flutter Tutorial - Pag...
Shared Axis Animation Tutorial: • Flutter Tutorial - Pag...
Animated Builder Tutorial: • Flutter Tutorial - Ani...
AnimatedList Tutorial: • Flutter Tutorial - Ani...
Sidekick Plugin: pub.dev/packages/flutter_side...
Complex Animations Tutorial: • Flutter Tutorial - Com...
Sequence Animation Tutorial: • Flutter Tutorial - Ani...
Flip & Rotate Animation Tutorial: • Flutter Tutorial - Tra...
Slide Transition Animation Tutorial: • Flutter Tutorial - Sli...
TIMELINE
0:00 Introduction Animated Switcher
0:20 Switch Between Two Widgets
2:44 Switch Between Multiple Widgets
4:43 Fade Transition Animated Switcher
4:51 Size Transition Animated Switcher
5:41 Change Animation Duration
5:59 Scale Transition Animated Switcher
6:36 Rotation Transition Animated Switcher
6:51 Change Animation Speed
7:45 Advanced Animated Switcher
SHARE | SUBSCRIBE | LIKE FOR MORE VIDEOS LIKE THIS
*********
SOCIAL MEDIA: Follow Us :-)
Twitter | / heyflutter_
Linkedin | / heyflutter
LEARN MORE
SOURCE CODE | github.com/JohannesMilke
ARTICLES | / johannesmilke
PLAYLISTS
All Flutter Videos | • Flutter Tutorial - Flu...
Widgets - Flutter | • Flutter Tutorial - Flu...
Plugins - Flutter | • Flutter Tutorial - Flu...
Animations - Flutter | • Flutter Tutorial - Tra...
Designs - Flutter | • Flutter Tutorial - Flu...
Firebase - Flutter | • Flutter Tutorial - Pag...
State Management - Flutter | • Flutter Tutorial - Riv...
CREDITS
Copyright song "Corporate Technology" by scottholmesmusic.com
#Flutter #Tutorial #JohannesMilke
LIKE & SHARE & ACTIVATE THE BELL
Thanks For Watching :-)
bit.ly/JohannesMilke

Наука

Опубликовано:

3 авг 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 29

@HeyFlutter 2 года назад

This might help you :) 👉 12 Week Flutter Training from Newbie to Expert: heyflutter.com Source Code: github.com/JohannesMilke/animated_switcher_example Page Transition Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-1nwuihDA8pE.html Shared Axis Animation Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-7dl_Cxo2FN0.html Animated Builder Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-LrrKOJjoHcc.html AnimatedList Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-rDFJhIobj7I.html Sidekick Plugin: pub.dev/packages/flutter_sidekick Complex Animations Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-7VqJo_Xeb98.html Sequence Animation Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-cknUItHktzs.html Flip & Rotate Animation Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-FHgqEay3VUI.html Slide Transition Animation Tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-cxxHE0TTGbU.html

@EricPLMobileDeveloper 3 года назад

your tutorial video makes me interested on flutter animation skill ! thanks a lot

@priyadarshinichettiar6750 3 года назад

Best video as usual ❤️

@hectorprx 3 года назад

Thanks, Look forward to these videos everyday, ever expanding list of creative options.

@flaasher 3 года назад

Cool stuff as usual 🙏

@fabianfischer56 3 года назад

As always great Video. Thanks!

@mehmetpeker9047 3 года назад

Thanks man your videos are very helpful.

@user-vr9qb5rj4j 2 года назад

Great tutorial!!! Thanks a lot)

@AlfaSanga 3 года назад

Thanks man.

@user-xx1ex9hb6l 11 месяцев назад

Thank you, you really help me!

@HeyFlutter 11 месяцев назад

Glad I could be of help, You are welcome @user-xx1ex9hb6l! 😊

@asif_imtiaz 2 года назад

THANK YOU SO SO SO MUCH! Even the flutter guys didn't provide that one vital info, that the key is a must! Thank you!

@mohitvats5850 3 года назад

Thanks for this aswm lecture...Please make a video on phone authentication in flutter

@mehmethasanilkbahar7730 3 года назад

The flag saved my time Thank you.

@sovrinfo 3 года назад

Спасибо за видео.Коммент в поддержку!

@faisalahmad2445 3 года назад

Is there a way to create your own custom transition and pass it to the transition builder, I have been trying to build a flip animation (like flipping a card) that triggers every time an event happens, with the animation switcher, but I haven't found a way. Since there are only a few transitions scale, size etc. That are provided by flutter. Any help would be amazing.

@HeyFlutter 2 года назад

Thanks, Faisal! 🙂 Check my tutorial out about flipping & rotating Cards: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-FHgqEay3VUI.html Also this tutorial about Animating Cards is really helpful: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-cknUItHktzs.html

@youribroerse3827 9 месяцев назад

Hi, Is the AnimatedSwitcher widget also useful when you want to use scrolling to animate a switch between two widgets?

@HeyFlutter 9 месяцев назад

Yes, @youribroerse3827 🙂 you can use it.

@daviidon 3 года назад

Do you think you’d be able to recreate the video minimizing animation on the RU-vid mobile app?

@HeyFlutter 2 года назад

You could watch my Container Transformer Animation tutorial here: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-1nwuihDA8pE.html This might help you to create this minimizing animation of videos. Thanks, Starboy 🙂, will also add it to my list of ideas, for future videos!

@AlfaSanga 3 года назад

Is there a way to place a link of image between text so that to display image? Thanks.

@AlfaSanga 3 года назад

@@HeyFlutter i mean fo place a picture in storage like Cloudinary and when i write my message (text) i can include the link o f my image any where in text And the link will be displayed as image and not as a link

@anomihekenneth9586 3 года назад

Thanks a lot for this tutorial, but can you do another one on how to use gesture detector to zoom images

@anomihekenneth9586 3 года назад

@@HeyFlutter thank you so much

@HeyFlutter 2 года назад

Thanks, Anomihe! 🙂 You could use the Interactive Viewer Widget to zoom images etc. Watch this tutorial: ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-Jb5SUSlJrqc.html I will do a deep dive about GestureDetectors somewhere in the future!

@sanketsingh7575 2 года назад

what about when you have more than 2 else if conditions?

@HeyFlutter 2 года назад

Thank You Sanket Singh! Follow this link: flutter-examples.com/if-else-conditional-statement-in-flutter-dart/ I hope you will get your answer 🙂

@mohammedhamdan5323 2 года назад

Johannes Milke : Are you human ? .. i think you are a flutter engine machine .. your tutorials has genius way with getting knowledge into brains deeply rooted , really mullions thanks