Flutter (Glassmorphism) Translucent/Frosted AppBar | Frosted Glass/Blur Effect | Speed Code

Flutter (Glassmorphism) Translucent/Frosted AppBar | Frosted Glass/Blur Effect | Speed Code

Yash Moon

4 года назад

4,217 Просмотров

Hello people, 😊
This is a speed code of implementing a beautiful custom Translucent or Frosted AppBar with background blur. Everything can be set from the "blur strength" (custom) to "Title", "leading" , "actions" widgets just like the standard AppBar 🙂

Tools/Softwares Used -
1. VS Code (Flutter IDE)
2. scrcpy (for android device screen mirroring)

Additional Packages Used -
- none

GitHub Repo Link - https://github.com/yash-moon/frosted_app_bar

Thanks For Watching 😊
Consider Subscribing if you loke to watch more Flutter Speed Code Videos

Chapters/Time Stamps :-
0:00 End Result Demo
0:32 Implementation
1:42 Coding custom AppBar
3:00 Creating custom parameters for AppBar
6:04 Testing the custom parameters and adding more
7:57 End Result

Music Credits:
1. By Dimatis -
https://www.youtube.com/channel/UC9jMkbMJwsk1bUp2xwIY63A
2. Music By - Sappheiros -
https://www.youtube.com/channel/UCxLKyBhC6igFhLEb0gxvQNg

Тэги:

#flutter_ui #flutter #mobile_app #flutter_ui_design #google_flutter #framework #ui #ux #flutter_beautiful_design #flutter_ui_ux #flutter_transparent_appbar #flutter_translucent_appbar #flutter_appbar #appbar_flutter #frosted_glass #flutter_frosted_glass_effect #flutter_frosted_appbar #flutter_backdrop_filter #flutter_backdropfilter #flutter_custom_appbar #flutter_transparent_container #transparent_background_flutter #glass_morphism #glassmorphism #flutter_glassmorphism
Ссылки и html тэги не поддерживаются


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