Flutter UI Tip 3: Popup Card

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

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

50% 1

Easily create a popup effect for cards or buttons. Invest in yourself! Use my link and check out the first chapter of any course for FREE! bit.ly/3qLlX7g
--
Program I use for mockups: bit.ly/rotatopro
This is an affiliate link, if you purchase from this link then I'll earn a small commission. Which is a great way to support the channel :)
--
Check out my Flutter Animation and Performance course.
Discounted link: bit.ly/funwithcourse
Or use the promo code: FUN
for a discount at checkout: courses.funwith.app
--
Github code: github.com/funwithflutter/flu...
--
Join me on the socials.
Twitter: / gordonphayes
This video was sponsored by DataCamp.

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

4 авг 2024

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист

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

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

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

Invest in yourself! Use my link and check out the first chapter of any course for FREE! bit.ly/3qLlX7g

@enchance Год назад

This is great man. I'm working on my own app right now and I think I might have a place for this. Amazing stuff.

@AndreasR.95 3 года назад

Best Flutter channel out there!

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

:) Glad you think so!

@dylanroman7738 Год назад

thank u sm brother... this is just what I needed

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

Hey great video! Im having trouble updating the list with the new note (once someone hits the "add button"). Can you point me to the part of your code that does this update? would be really helpful!

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

Absolutely love this design! I am however having issues with the popup card going into full screen. I have copied the code exactly, and its still showing me a full screen of the dialog box. Has this happened to anyone else?

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

Great video! You have the nicest UI designs 🔥

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

☺️

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

great tutorial!

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

Thank you so much 💓

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

What a nice video!!

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

Thanks bro, this video really helped me

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

No problem 👍

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

Very nice 👍

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

Looks great, awesome video!

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

Thanks Robert!

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

thanks，it's usefully！

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

Thank You!Great job!

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

Thanks!

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

This is what container transform transition looks like, just add fade to exiting and entering widgets. Currently there's a package called "animations" officially release by flutter team long ago, the only problem is their container transform always transition to fullscreen not a dialog. btw Great job sir :)

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

Thanks for the info. Yeah I've used that OpenContainer before. Sometimes it works great, but I've also had times where I needed more control.

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

I think that container transition best works when using search box like use case. Like you tap on a search box and it opens up to a new screen.

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

Super explanation. Carry on please.

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

I will try my best

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

Hello Fun with Flutter, I love your tutorials. Can i use this animation code for my own Apps?

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

Yes you can!

@Raziem Год назад

Is your animation course still up to date? if so I'd willing to buy it!

@artemartem6993 Год назад

Hi ! Could you help me with one question? How can I transfer entering text from popup card to field on another creen if popup card is StatelessWidget? If I understend right, we can't using TextEditingController for StatelessWidget.

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

perfecttttttt thank you sooo much

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

Welcome!

@weareorpheez 6 месяцев назад

Can someone use this for any kind of popup? and also how can I add dark background overlay under the popup so there is contrast on the app?

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

Your voice bro, gaddamn❤️

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

😜

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

You are a Flutter Rockstar 😎

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

☺️

@duarteleal5964 6 месяцев назад

A like, a comment and a sub for providing the source code

@rc-pilot9131 3 года назад

Thanks a lot, but how did you that amazing intro with the turned phone?

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

Rotato.xyz link in the description

@santosvision Год назад

Thank you for this awesome tutotiral. however, with the no-null-safety upgrade in flutter 3.0 this is getting a lot of errors. would you be so kind to revise and update the tutorial or the github? or if you know any other video tutorial that you can point us out with would be really helpful and appreciated it. nevertheless thank you for sharing this bro!

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

Which font ?

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

this code is outdated having issue with rect tween file can you please help or tell the right way

@lamo5751 Год назад

i have a problem with herodialogroute settings flutter showing me error can u help pls (flutter 3.3.2)

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

how do I dismiss after submit

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

Thanks bro

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

Any time

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

Is there any reason why the animation is not occurring for me? I copied the tutorial exactly and the button doesn't animate into the popup. Instead the popup just appears. Help please.

@anomihekenneth9586 Год назад

is your animation class here on youtube

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

Fucking legend man, love you

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

There is no discount code bloc at the purchase

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

Hi When I run flutter cmd it shows BITS Transfer Can you help

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

its probably updating

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

Plz post smart water bottle app in flutter bcz no one did before

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

Hey! It's not a design tutorial, but can you make a tutorial on how to make Streak days? I am in the process of programming a Streak app (just for practice) and have no idea how to solve this.

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

I don't know what Streak means :)

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

thx m8t

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

hey buddy , i've just copied your code , but i'm facing an issue , when the dialog pop up , the screen beneath are black and opaque , although opacity = false ,

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

Eh not sure. You can get the code used in the video from Github

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

very very difficult...please teach us how to do this using GETX package...and make it simpler like a packge

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

If somebody skips the whole materialApp setup, and goes without material or cupertino, using the WidgetsApp , you need to add navigatorObservers: [HeroController()], to the widgetsApp, without that no transforming animation happens.