Тёмный

🖥📱RESPONSIVE DESIGN • Flutter Tutorial 

Mitch Koko
Подписаться 131 тыс.
Просмотров 289 тыс.
50% 1

💰 I'll develop your MVP app: mitchkoko.app/mvp
📱 Code: mitchkoko.app/
🎓 Flutte Beginner Course: • 📱 FULL Flutter Beginne...
💌 Email: business@mitchkoko.app
~;
/ createdbykoko
/ createdbykoko
/ createdbykoko
/ mitchkoko
~;

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

 

2 окт 2024

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 176   
@createdbykoko
@createdbykoko Год назад
🔥📱 Flutter Templates • mitchkoko.app/ 🥷🏽📱 Minimal Social App • mitchkoko.gumroad.com/l/MinimalSocialApp 💰📱 Minimal Ecommerce App • mitchkoko.gumroad.com/l/MinimalEcommerceApp
@FlutterMapp
@FlutterMapp 2 года назад
Mitch, your thumbnail is great! Thanks for sharing with the Flutter community 👏
@createdbykoko
@createdbykoko 2 года назад
My pleasure ✌🏾❤️
@asterjoules
@asterjoules 2 года назад
@@createdbykoko Ah Such a great thumbnanil
@tahseenahmadansari-g1o
@tahseenahmadansari-g1o Год назад
Hi ,, how are you hope you will be fine as many people are earning by your effort so people's prayers are definitely with you .. i want you to give us a free copy of Zero to Hero playlist as i could learn more about state management fire base authentication and publishing app on Android and Ios Store as well .. Hope you may understand that i am stuck in middle of your playlist. thanks
@HermanPalmgren
@HermanPalmgren 2 года назад
I have been making some programming videos myself, and I must say that your language, tone and video style is so clear. Great video!
@theguanche
@theguanche 2 года назад
Can you link the setuper channel, soft and track, so you don't have to color and rena 3 tis ? Btw aweso video!
@vothanhbinh2k
@vothanhbinh2k 2 года назад
engaging voices, quality videos, and useful content, keep these series going sir
@g0keyn
@g0keyn 7 месяцев назад
Why did you write 2 widgets? If will change any thing, you should write twice. Is this best practice? or what is the best practice?
@amandeepthakur7847
@amandeepthakur7847 12 дней назад
Having same doubt, did u find the answer?
@PiratesZombies
@PiratesZombies 2 года назад
how to Singlescrollview Row and listview? error "RenderBox was not laid out: RenderRepaintBoundary#085e6 relayoutBoundary=up5 NEEDS-PAINT" because comment section need scrolldown
@saimaheshparuchuri9826
@saimaheshparuchuri9826 2 года назад
My question we are writing the code twice right separately for mobile and desktop? Is it good practice 🤔
@whoadityanawandar
@whoadityanawandar 2 года назад
I don't think this is a good choice. Practically, any web app will have a LOT more code than this and repeating all that code doesn't look like a good idea.
@mohammadw2000
@mohammadw2000 Год назад
No, it is not!
@Sebastian-cz3vk
@Sebastian-cz3vk 2 года назад
​ @Mitch Koko , So because my app is mostly UI i basically double or 3x the code and modify for tablet and desktop devices. Doesn't get the app size too big ?
@sebastianmartinezsantos5289
@sebastianmartinezsantos5289 8 месяцев назад
I wish flutter could implement a simpler approach like bootstrap.
@sakinahtajuddin7233
@sakinahtajuddin7233 2 года назад
Such a great explanation! 1 question, if there are multiple screens in one app , that means we need to do the mobile_body & desktop_body file for each one of the screens , right?
@thestars1220
@thestars1220 2 года назад
did u find an answer to that?
@OMGdon
@OMGdon 2 года назад
I guess that it's true for all layouts in app. But content can be reached by common classes from all layouts.
@namanpatel252
@namanpatel252 2 года назад
Hey is there any way to give constraints to window frame on web, like have a project with responsive layout but whenever I try to reduce its height it gives me renderflex issues.
@eduardo_pedroso
@eduardo_pedroso Год назад
I have to watch this in 0.5x slow down man
@abdullahbensaleim2253
@abdullahbensaleim2253 Месяц назад
Yabbb but is very clean
@notKhalid
@notKhalid 20 дней назад
i had to watch this in 2x
@jeslinjacob6472
@jeslinjacob6472 3 месяца назад
U should also share about how business logics can be shared between all. These views
@TomTurnerIT
@TomTurnerIT Год назад
This is very well spoken and easy to listen to, but my dude, for beginners, you really rocket through some of that code and I think you used code snippets that not everyone watching might have and don't reference that you did that. Still a great resource though!
@createdbykoko
@createdbykoko Год назад
Try this one ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-9bo1V9STW2c.html
@hardiklakhalani6268
@hardiklakhalani6268 2 года назад
What about code duplication? How to eliminate that? This will replace existing widgets with new one so how to deal with keeping the state?
@martinpalmer2036
@martinpalmer2036 Год назад
Honestly Dude, Simple! Clear! Concise! Every other example I've seen is too complex and seems like the Author is trying to show how big his brain/ego is (i.e. Google...) . Totally awesome!
@createdbykoko
@createdbykoko Год назад
Haha martin! Glad it helps you! 💜💜 how is Flutter going for u so far?
@martinpalmer2036
@martinpalmer2036 Год назад
@@createdbykoko So far so good! I have a small number of customers and am getting better at it every day (thanks to several of your tutorials). I think you're in Australia? I live in the Seattle area but have family in Surfers Paradise 🙂
@MissMyMusicAddiction
@MissMyMusicAddiction 11 дней назад
is there a way to query the device type, not just the width/height? some frameworks in other dev tools will return iphone, ipad, androidphone, androidtablet, windows, mac, web, etc.
@swiftieforever5152
@swiftieforever5152 4 месяца назад
Hey, I have just started learning coding with Flutter and I'm curious: how is this code deployed so that people can access the website link as well as the app link? Please don't mind if this question seems silly 😅
@yupickmyusername
@yupickmyusername 2 года назад
You just earn new subscriber bro, keep up with the flutter content, Love your videos!
@createdbykoko
@createdbykoko 2 года назад
Thanks 🙏 ❤️
@tonkroew
@tonkroew 2 года назад
problems and than volu automate the boi cuz I didn’t know how to sidechain. My one buddy produces riddim and he legit saw my daw
@basssdeso
@basssdeso Год назад
hi bro,,how to tutorial music streming player with flutter full step by step,thanks :)
@redwanahmedfahim7028
@redwanahmedfahim7028 Месяц назад
Great tutorial as always. But couldn't find the link to this code. Anyone got it?
@MrIMacro
@MrIMacro Год назад
Not adding the expanded widget at 07:15 is the cause of the famous error (black and yellow lines on the edge of the screen) right?
@codenuts29
@codenuts29 9 месяцев назад
Hi, It's there any future scope to develop web app using fluttter
@AniMatrixXD
@AniMatrixXD Год назад
Why didn´t I know you earlier
@createdbykoko
@createdbykoko Год назад
Haha welcome 🤗
@develo9er727
@develo9er727 4 месяца назад
So what if i want to add a part or option to a big project? Should I do it 3 times for 3 platforms?
@Mkrabs
@Mkrabs Год назад
How would you save the state of, let's say a card with the number of times it has been clicked, between the two layouts ?
@createdbykoko
@createdbykoko Год назад
That’s up to your choice of state management! Provider, bloc etc
@giulicon
@giulicon 2 года назад
Nice video! One question tho, at 4:42, what did you press for the column to expand nicely to other columns I mean transforming ResponsiveLayout(mobileBody: , desktopbody: ) To: ResponsiveLayout( mobileBody: , DesktopBody: , )
@createdbykoko
@createdbykoko 2 года назад
Good question haha. If you add a comma after the last item (before the closing bracket) , it will reformat it nicely. Let me know if that wasn’t clear haha
@giulicon
@giulicon 2 года назад
@@createdbykoko thanks alot lol, that's a pretty nice feature
@colegioasturiasprimariaalt2940
@colegioasturiasprimariaalt2940 2 года назад
and had an aneurysm before forcing to get serum....now I’m tryna make jazz and am using softex and the sampler cuz, I’m less
@SuluXuluS
@SuluXuluS 2 месяца назад
Hmm it could be cool when using it with a check, like if width>height (desktop layout) else (phone layout)
@TGR-wf6gd
@TGR-wf6gd 2 года назад
Awesome and concise video. What is your take on packages like responsive_framework and would you prefer using those over the approach you demonstrated in this video?
@adeirwan-l5s
@adeirwan-l5s 8 месяцев назад
how about Text FontSize? do we need to change the font size?
@mehmetcakmaktas9758
@mehmetcakmaktas9758 Год назад
how can I make it scrollable? (SingleChildScrollView doesn't work)
@kmax2356
@kmax2356 2 года назад
Good video...but coding video is very fast... I think beginner also watch this video... ❤️❤️
@QuietStorm_
@QuietStorm_ 2 года назад
Thanks for the video, it's easy to understand 👍🏼
@createdbykoko
@createdbykoko 2 года назад
No problem ✌🏾
@goodman3434
@goodman3434 2 года назад
It seems there is a problem inside the "desktop_body.dart" file and it gives this error message by extending the running window page size: ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════ The following assertion was thrown during layout: A RenderFlex overflowed by 19 pixels on the bottom. The relevant error-causing widget was: Column
@morshedraiankhan6968
@morshedraiankhan6968 Год назад
Same here
@kkubigames8477
@kkubigames8477 8 месяцев назад
Same here
@lifeoffancypigeons8631
@lifeoffancypigeons8631 27 дней назад
You are the best flutter app teacher ever on RU-vid...thankyou bro
@KARTHIKr8642
@KARTHIKr8642 Год назад
Can you make a video on how to convert a existing website to a responsive disign for mobile, tablet and website which is in flutter. It would be good if you used responsive framework.
@justinus
@justinus 6 месяцев назад
what is the main.dart look like? video is way too fast
@colinhehn
@colinhehn Год назад
im just here for the Splice beat samples lmao
@frankmwale1580
@frankmwale1580 2 года назад
You wouldn't want to use packages after this...responsive design, size...etc
@ShujaatSunasara
@ShujaatSunasara Год назад
Is it worth learning state-management, why you are not using it and if it is not nessesary, are you still satisfied with your package?
@CodeEnthusiast78912
@CodeEnthusiast78912 Год назад
This approach is fine unless your app will have more than 5 tabs, then it becomes really hard to maintain.
@burmaentertainment3055
@burmaentertainment3055 2 года назад
Turns out they aren't for . SO I hear literally notNice tutorialng inside soft...
@muayyedsiraj
@muayyedsiraj 3 месяца назад
so your basically coding for two or more screens?
@keflat23
@keflat23 2 года назад
best channel over the tube for flutter learning very good job mate
@createdbykoko
@createdbykoko 2 года назад
Thank you! Means a lot to me :D
@makisetakashi
@makisetakashi Год назад
so we need write code twice right ? for desktop view and mobile view ? can we do in one code base ?
@pawnalakecottages
@pawnalakecottages Год назад
can we make common code for other pages or we need to every time write for both mobile and desktop, is there any tutorial for this ? flutter is new for me
@hakimkac5088
@hakimkac5088 10 месяцев назад
Great video ! what about duplicate code ? Can't we use the same video component for desktop and mobile in the same file, and just put specific parameters in separate files (like width and color) ?
@abhaykumarbhumihar6166
@abhaykumarbhumihar6166 Год назад
So we need creat two separate file of one page?
@nadislat
@nadislat Год назад
Very useful. Thanks a lot! But when the browser is maximized, I got "BOTTOM OVERFLOWED BY 41 PIXELS". Any ideas? (I used the same code).
@abasilis
@abasilis Год назад
Thanks for this awesome video, as always. Something that happened to me is that I used the structured way method for a project, but what I turn my phone in landscape mode, the width is 800.6, should I control the layout using the MediaQuery.of(context).orientation to control that?, or there is a more convenient way? Thank you very much fro your time, I really appreciate it!
@doulainc.498
@doulainc.498 2 года назад
Thank you for this. I have a question please. Does this responsiveness works with the whole app UI. Meaning there wouldn't be render overflow error. Idk if you get Me. For example will the font size.. container height of widgets be responsive as well?
@abdoufma
@abdoufma 2 года назад
No, you'd still need to handle all those issues as usual. The only thing LayoutBuilder does is give you an easy way to know what viewport constraints your app is working with, and by extension, what *layout* it should be using.
@doulainc.498
@doulainc.498 2 года назад
@@abdoufma alright thanks. Please for a fact I'm a beginner can you please guide me on how to achieve such ? The best practices for that?
@doulainc.498
@doulainc.498 2 года назад
@@abdoufma please can u tell me the usual way of handling such?
@pratyushvaibhaw6170
@pratyushvaibhaw6170 Год назад
Mine bad luck, I found your channel too late.
@001Debjeet
@001Debjeet 2 года назад
this is quality flutter video with easy explanation ... can make videos like this for any state management
@createdbykoko
@createdbykoko 2 года назад
Yep I'm going to look more deeply into state management and make a video soon
@001Debjeet
@001Debjeet 2 года назад
@@createdbykoko thanks mate
@omkarp9943
@omkarp9943 Год назад
I hope you will be having 1M subscribers soon !!
@clickbatemotivation3260
@clickbatemotivation3260 Год назад
What emulator are you using?? to be able to resize at will
@certificaminascertificamin1013
@certificaminascertificamin1013 2 года назад
I'd recomnd going through a soft theory video on YT and making notes, there's a good 2h30 one wNice tutorialch softs looong but it will
@createdbykoko
@createdbykoko 2 года назад
Heyy what do you mean soft theory? Can you elaborate
@nevillelam7999
@nevillelam7999 Год назад
Thank you for giving such a quick but informative tutorial!
@createdbykoko
@createdbykoko Год назад
No worries glad it helped! 💜
@abdullahbensaleim2253
@abdullahbensaleim2253 Месяц назад
Cocacolastic ❤️
@createdbykoko
@createdbykoko Месяц назад
@@abdullahbensaleim2253 ❤️❤️❤️
@positiveknowledge4045
@positiveknowledge4045 Год назад
aaah you're doing great I saw your website and it was fantastic 💯👌👍
@AmirBaruchPreciseAsteroid
@AmirBaruchPreciseAsteroid 2 года назад
Great video! learned a lot. quick question: I am assuming your are using chrome for live preview and the results seem to update immediately as you save. I thought hot reload is not supported with web. Do you use a different setup?
@Terandium
@Terandium Год назад
Bit late but I think web has hot reload support, otherwise just use the windows/macos desktop variant ^^
@rishabhvishwakarma5745
@rishabhvishwakarma5745 Год назад
you just explained one of the most imp. and kind of difficult topic in min.. , just wow thanks man😎😎
@arafathussain851
@arafathussain851 Год назад
Very clean and clear explanation, thank you for the video!
@milandol321
@milandol321 Год назад
Isn't it better to do it based on aspect ratio?
@createdbykoko
@createdbykoko Год назад
Aspect ratio is great for responsive designs yes. There are many ways to achieve it :D
@letmeflutter6644
@letmeflutter6644 Год назад
thank you
@MuhammadAnas-r1x
@MuhammadAnas-r1x Месяц назад
where's the code?
@shuku_yega
@shuku_yega Год назад
can you please a video on dynamic widgets
@MaxwellRios
@MaxwellRios 2 года назад
Muito bom, obrigado por compartilhar conhecimento.👍
@Abomin81onVlog
@Abomin81onVlog 2 года назад
This was a clear, well explained video thanks.
@createdbykoko
@createdbykoko 2 года назад
no problem :D
@EmanueleTozzato
@EmanueleTozzato Год назад
Professor Koko just became my hero tutorialist. Perfect speed, clear and effective speech, pleasant colors, 10+
@Neerajkumar-xl9kx
@Neerajkumar-xl9kx 2 года назад
I have subscribed you for this, loved it
@ashikurrahaman7967
@ashikurrahaman7967 2 года назад
. thanks
@julianwebb9222
@julianwebb9222 11 месяцев назад
Awesome and aesthetic explanation. Thank you!
@ayushmuley1907
@ayushmuley1907 11 месяцев назад
Thank you for sharing
@stefan263
@stefan263 2 года назад
Nice video and precise. However, as myself I am developing very complex apps in Flutter having as backend a microservice architecture in .net hosted in docker, I found the responsiveness technic pretty cumbersome. Because, based on the screens size, basically, per implementation speaking, we have to manually construct again some widgets just for layout. Also, DRY is violated cuz multiple widgets cannot be used, or they need be based always on MediaQuery and calculate the correct height and width per screen size. I would expect a better approach from Google team in terms of responsiveness layour as Flutter framework wants to be hybrid. Do not get me wrong, I love Flutter, and I am saying this as developing in Angular as well from 5 years now. But I was expecting to be done better in terms of responsiveness and to not do all the tweaks that has to be done in CSS.
@Ondraasha
@Ondraasha 2 года назад
You sound like someone who threw a bunch of tech words into a comment to sound smart.
@sundaramoorthykuppuswamy2745
Such a simple and great content buddy ; )
@createdbykoko
@createdbykoko Год назад
Ate glad it helps you man! 💜💜💜
@itsahmed-dev
@itsahmed-dev Год назад
100th Comment: Thank You 🤗
@createdbykoko
@createdbykoko Год назад
Hii thank YOU 🥰
@ikennaumeh_io
@ikennaumeh_io 2 года назад
what exactly was the aspect ratio used for
@JohanLibert-k9g
@JohanLibert-k9g Год назад
man your explanation is just legendary
@createdbykoko
@createdbykoko Год назад
haha Johan you are too nice. Your words mean a lot to me 💜
@MrAhbill1
@MrAhbill1 2 года назад
just started to learn fluttern from native ios and android background, didn't realize there's a code snippet if you write "stf" or "stl" haha. Thanks mate!
@createdbykoko
@createdbykoko 2 года назад
No problem haha yeah you’re going to need to those shortcuts :)
@gggg-no6rm
@gggg-no6rm 2 года назад
how to change font size
@obong_samjoe
@obong_samjoe Год назад
Thanks
@xixnineteen6322
@xixnineteen6322 2 года назад
Thank you, it works perfect!
@maneeshapte6883
@maneeshapte6883 2 года назад
This was an extremely helpful video!! Thank you
@learningbrains910
@learningbrains910 11 месяцев назад
So simple and handy tutorial. Thanks man 🖤
@muhamadhaydar8419
@muhamadhaydar8419 2 года назад
Thanks, clear and slice to eat
@MustafaKilic01
@MustafaKilic01 Год назад
Nice, thanks
@speedtnt7591
@speedtnt7591 2 года назад
Very useful thanks
@createdbykoko
@createdbykoko 2 года назад
no problem
@CHHATRAPHULARA
@CHHATRAPHULARA 8 месяцев назад
love your tutorials❤❤❤❤
@mahin1i823
@mahin1i823 2 месяца назад
@eboatwright_
@eboatwright_ 2 года назад
This is awesome! You make everything so simple
@createdbykoko
@createdbykoko 2 года назад
👨🏽‍💻❤️❤️
@luisgonzaloguarnizogarcia7587
Thanks for sharing
@sudipraaz
@sudipraaz 2 года назад
great work + greate contribution to make it easily understandable. Keep up the good work
@createdbykoko
@createdbykoko 2 года назад
thanks!
@AashikaBhat
@AashikaBhat Год назад
thank you
@soumen81
@soumen81 Год назад
This is awesome. Thank you.
@john7Doe9
@john7Doe9 2 года назад
Thanks a lot!
@izmir175
@izmir175 2 года назад
Bro you are awesome!
@byzramku
@byzramku Год назад
this is what I need to implement now
@createdbykoko
@createdbykoko Год назад
nice good luck with it 💜 let me know if there are any issues
Далее
10x Your Speed With Flutter
8:04
Просмотров 50 тыс.
ВЫЗВАЛ ЗЛОГО СОНИКА #Shorts
00:38
Просмотров 58 тыс.
Teeth gadget every dentist should have 😬
00:20
Просмотров 1,6 млн
Adaptive vs. Responsive | Decoding Flutter
5:09
Просмотров 106 тыс.
Top 10 Flutter Widgets (for Responsive Layouts)
13:17
Flutter Responsive Design Tutorial 📲
11:00
Просмотров 67 тыс.
Top 30 Flutter Tips and Tricks
6:50
Просмотров 559 тыс.
Best 30 Flutter Widgets, Packages & Tips
5:11
Просмотров 121 тыс.
📱DOPE Introduction Screens • Flutter Tutorial ♡
12:08
React Native vs Flutter - Which should you use?
22:31
Flutter Fully Responsive Design for Web, Tab and Mobile
26:12
ВЫЗВАЛ ЗЛОГО СОНИКА #Shorts
00:38
Просмотров 58 тыс.