Summary
Keywords
Full Transcript
Today I will show you how to build this custom bottom navigation bar in Flutter with animated icons from Rive. đ„ Animated Icons: https://rive.app/community/1298-2487-animated-icon-set-1-color/ đ° Article: https://medium.com/flutter-community/build-a-custom-bottom-navigation-bar-in-flutter-with-animated-icons-from-rive-13651bc80629 đŠ Source Code: https://www.flutterlibrary.com/templates/animated-app-with-rive [Full animated app] đ Live preview: https://abuanwar072.github.io/Build-an-Animated-App-with-Rive-and-Flutter/ âșFor the 3D intro, I'm using Rotato: https://bit.ly/3heGagj âșSupport Us: https://www.patreon.com/theflutterway âș Social Media GitHub: https://github.com/abuanwar072 Twitter: https://twitter.com/theflutterway Twitter: https://twitter.com/abuanwar072 (my personal profile) Facebook: https://www.facebook.com/theflutterway âș Timestamps 0:00 Intro 0:15 Project Setup 0:34 Download Free Animated Icons 0:40 Animated icons setup 0:57 RiveModel 1:04 What is an Artboard & State Machine? 2:00 Build a custom bottom nav bar 3:10 Show Animated Icons on the bottom nav bar 4:15 Animated Icons controller 6:02 Code refactor 6:57 AnimatedBar 8:27 Performance Optimization: Dispose the controllers 9:03 Setup pages for each tab 9:25 Thank you đ Thanks for watching! Make sure to like + Subscribe For More!
