Тёмный

Flutter Onboarding Screen Tutorial - Flutter eCommerce App 

Coding With T
Подписаться 83 тыс.
Просмотров 51 тыс.
50% 1

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

 

21 окт 2024

Поделиться:

Ссылка:

Скачать:

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

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 148   
@alitalaee7468
@alitalaee7468 3 месяца назад
i watched 6 video of this tutorial. and it was amazing till here. thanks for your time
@CodingwithT
@CodingwithT 3 месяца назад
I am glad it’s useful
@MachineLearning-rw7jd
@MachineLearning-rw7jd 9 месяцев назад
Wow! He provided even the assets for us in the source code! What a legend!
@CodingwithT
@CodingwithT 9 месяцев назад
Thank you 🙏
@illumi98
@illumi98 9 месяцев назад
@@CodingwithT hello. i write a question to you 8 days ago. please answer. i write the question once again here: Hi! in 10:19 i can't find "new | package" menu context in android studio 2023. is there a way to show the menu? or is it the same thing with the command line: "flutter create --template=package your_package_name"?
@muhammadsiddiq3598
@muhammadsiddiq3598 2 месяца назад
@@illumi98 bro how did you access the code ,i saw its paid
@murtazaahmad1539
@murtazaahmad1539 13 дней назад
you are laying there are no assets free
@CodingwithT
@CodingwithT 13 дней назад
Dear, start kits for both Admin panel and App are available free at $0 since the launch of this project. Every asset that may require plus additional files are included in the starter kit project. If you need a full source code of the app, then you have to pay.
@hassanaly.1
@hassanaly.1 10 месяцев назад
A much needed tutorial for the beginners.❤
@CodingwithT
@CodingwithT 10 месяцев назад
Glad it's helpful ☺️
@krishnashrestha4154
@krishnashrestha4154 11 месяцев назад
While tapping nextPage function call, the page is loading directly, loosing smooth animation, Fixed it by //Update current page index and jump to the next page void nextPage() { print(currentPageIndex.value); if (currentPageIndex.value == 2) { //Login Screen } else { int page = currentPageIndex.value + 1; pageController.animateToPage( page, duration: const Duration(milliseconds: 300), // Adjust the duration as needed curve: Curves.easeInOut, // Adjust the animation curve if desired ); } }
@CodingwithT
@CodingwithT 11 месяцев назад
It might be helpful for someone. Thank you 🙏
@zeelax7345
@zeelax7345 10 месяцев назад
Thanks.
@bell3746
@bell3746 9 месяцев назад
Thank you mister T, really gratefull for these videos, may Allah bless you
@CodingwithT
@CodingwithT 9 месяцев назад
So nice of you
@azeemhassanch
@azeemhassanch 3 месяца назад
Awesome work brother, keep making such great tutorials to help mankind.
@CodingwithT
@CodingwithT 3 месяца назад
Thanks, will do!
@luis96xd
@luis96xd 2 месяца назад
Thanks for this tutorial!
@CodingwithT
@CodingwithT 2 месяца назад
You're welcome! 😊 I'm glad you found the tutorial helpful! 👍🎉
@neglasuleiman2355
@neglasuleiman2355 10 месяцев назад
perfect tutorial i cant wait to see the end if possible i need in deep tutorial on utilities helper and functions
@CodingwithT
@CodingwithT 10 месяцев назад
Glad it's helpful 🐱
@td8043
@td8043 8 месяцев назад
hii i have the done the code correctly , my screen isnt getting updated of the backend part though. Could you help me out please
@CodingwithT
@CodingwithT 8 месяцев назад
Make sure to have an Obx() widget or make sure to update the UI using setState if you are not using Getx
@maazafridi2090
@maazafridi2090 11 месяцев назад
Awesome Tutorial.... Thank u. keep it up
@CodingwithT
@CodingwithT 11 месяцев назад
I'm glad it was helpful 😀
@legardemontcho6739
@legardemontcho6739 Месяц назад
static Color darkContainer = Tcolors.white.withOpacity(0.1) can be changed by static const darkContainer = Color(0x1AFFFFFF). 1A here corresponds to 0.1 opacity. This way of doing things avoids creating a TColors class, which makes the code even cleaner. What do you think?
@garycampbell7077
@garycampbell7077 Месяц назад
The Idea behind the colors class is to be able to manage color differentiation in the containers. Your way is cleaner yet it is also less efficient in that, that particular container can only be used for a single purpose. It is better to have standardized containers that can be re purposed through the use of different color backgrounds etc. sometimes more is less. I like the way you're thinking though.
@s.m.asaduzzaman7520
@s.m.asaduzzaman7520 10 месяцев назад
whats the name of the website for gif icons? please
@CodingwithT
@CodingwithT 12 дней назад
Visit icons8.com
@cryptoairdroppp
@cryptoairdroppp Год назад
thank you for this amazing content, subbed :)
@CodingwithT
@CodingwithT Год назад
You welcome 😁
@ahmedfouad1802
@ahmedfouad1802 6 месяцев назад
Hi thanks you for amazing tutorials am following all the steps but next bottom on pressing didn’t go to next page also skip not working but swiping working.. what is missing or wrong please
@CodingwithT
@CodingwithT 6 месяцев назад
Make sure skipPage and nextPage functions in the controller are correctly implemented and bound to the skip and next buttons' onPressed callbacks. If you need further assistance, feel free to ask.
@disneldel
@disneldel Год назад
Thank you very much for the work and help But we start from part 4 to 6
@CodingwithT
@CodingwithT Год назад
You welcome. You can watch previous videos as well from the Playlist link provided in the description.
@shehzadhussain491
@shehzadhussain491 7 месяцев назад
Clicking on next button of onboarding screen page navigates to 2nd page only after that next button doesn't work and this error occurs: The following _TypeError was thrown while handling a gesture: type 'int' is not a subtype of type 'Rx'
@CodingwithT
@CodingwithT 7 месяцев назад
This error typically occurs when there's a mismatch in the expected type and the actual type being used. In this case, it seems like you might be trying to assign an int value to an Rx object, which is causing the error. To resolve this issue, ensure that you're using the correct types throughout your code, especially when working with reactive programming and Rx variables.
@shehzadhussain491
@shehzadhussain491 7 месяцев назад
@@CodingwithT thanks i was missing the . value
@drg7527
@drg7527 7 месяцев назад
Followed the codes line by line but im getting this problem too
@drg7527
@drg7527 7 месяцев назад
I even replaced the nextPage function into the skip button to see if it works but it still doesn't
@magedali4457
@magedali4457 7 месяцев назад
What do you use for the TdeviceUtils, how do you make that code? is it a package? or because i really need it.
@CodingwithT
@CodingwithT 7 месяцев назад
you can get the utils in the app project starter kit from the product link in the description
@wissammerheb69
@wissammerheb69 6 месяцев назад
Hi, perfect tutorial, I got this exception when trying to go nextPage() Exception has occurred. _AssertionError ('package:flutter/src/widgets/scroll_controller.dart': Failed assertion: line 158 pos 12: '_positions.length == 1': ScrollController attached to multiple scroll views.)
@CodingwithT
@CodingwithT 6 месяцев назад
It seems like you have attached the same ScrollController to multiple scroll views, which is causing the assertion error. Make sure that each scroll view has its own unique ScrollController. If you're using a single ScrollController, consider using a separate one for each scroll view to resolve the issue.
@MuhammadUsama-vv1wo
@MuhammadUsama-vv1wo 6 месяцев назад
Hello Sir!! at 22:50 i've done according to your instructions in the video, My whole code is error free and while swiping its working but i'm unable to navigate to next pages using next buttons and dot navigation buttons. Also it can't help me to go to the login page as i've created it & linked it successfully. Only Skip button is working properly. Can You tell me the reason and solution. Please
@CodingwithT
@CodingwithT 6 месяцев назад
You can use Get.to(() => const LoginScreen()); for nextPage() function. after removing the comments of Get.to(LoginScreen())
@muhammadkhalilurrehman6463
@muhammadkhalilurrehman6463 5 месяцев назад
@@CodingwithT have done this also but its not going too
@cscpurnia1038
@cscpurnia1038 7 месяцев назад
Height and width not work. gif is not resize according to value given in height and width. please help me
@CodingwithT
@CodingwithT 6 месяцев назад
You can also wrap it in a widget and give height and width of that widget.
@fhihung
@fhihung 11 месяцев назад
perfect tutorial. Will you use other state management ?
@CodingwithT
@CodingwithT 11 месяцев назад
That's the plan! For now GetX and after that other state managements as well.
@FelipeCampelo0
@FelipeCampelo0 9 месяцев назад
I am a very beginner. Could you please explain what is a controller in Flutter?
@CodingwithT
@CodingwithT 9 месяцев назад
You can learn the flow in ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-B-Zycy24Vno.html at 03:06 and if you want to learn about getx controller watch this video ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-RtGVKSLZnW0.html at 04:33
@Sonic20555
@Sonic20555 2 месяца назад
شكرا من كل قلبي T❤
@CodingwithT
@CodingwithT 2 месяца назад
You're welcome! I'm glad I could help. ❤️
@andal-s1726
@andal-s1726 3 месяца назад
I thought It was helpfull I code as you show in vidéo, but skip and next button does not work.. I lost so many times to find where is the problem.. if someone has the solution plz help
@CodingwithT
@CodingwithT 3 месяца назад
Please make sure you have added onPressed properly and you can reach me at WhatsApp +447456285429
@phantuoi_it_247
@phantuoi_it_247 5 дней назад
tôi nghĩ bạn quên dấu ' ( ) ' phía sau skipPage trong onboarding_skip
@TeguhHarits
@TeguhHarits 7 месяцев назад
hi sir what do you use for make this presentation slide show?
@CodingwithT
@CodingwithT 7 месяцев назад
Hi, I didn't get you. Can you please explain more what you mean with presentation?
@bill__j
@bill__j 9 месяцев назад
Hi Leader, please can you advise which software did you use to animate onbaording images
@CodingwithT
@CodingwithT 9 месяцев назад
Images used in the onboarding are gif files
@WaseemKhan-zc3ru
@WaseemKhan-zc3ru 2 месяца назад
Assalamu Alaykum can you provide me link for images used in on boarding GIF files if you provide me, it’s lots of help to me, jajak Allah khair…
@kadercherif232
@kadercherif232 11 месяцев назад
Hello thank you for this beautiful work, but please where did you download your gif
@CodingwithT
@CodingwithT 11 месяцев назад
Icons8 and Lottie
@zumbarto
@zumbarto 2 месяца назад
How can I enable the horizontal guidelines? I mean this; MyApp (Root Widget) ├── Scaffold │ ├── AppBar │ │ └── Text (Title) │ └── Body │ ├── Column │ │ ├── Text (Message 1) │ │ ├── Text (Message 2) │ │ └── RaisedButton (Button)
@CodingwithT
@CodingwithT 2 месяца назад
In android studio, Go to settings=> languages and framework => flutter=> show UI guidelines to build widgets(make it true) and apply
@bhardwaj_abhi3421
@bhardwaj_abhi3421 8 месяцев назад
what was the use of currentPageIndex in code , neither the dots nor the pageview is using this variable . Does changing the currentPageIndex trigger state change and rebuild widget tree ?
@CodingwithT
@CodingwithT 8 месяцев назад
Exactly 👍
@bhardwaj_abhi3421
@bhardwaj_abhi3421 8 месяцев назад
@@CodingwithT in next button clicked event currentPageIndex+1 is assigned to page variable and then pagecontroller is jumped to that page , how come here currentPageIndex is not assigned the incremented value ? and how does state got changed without change in currentPageIndex variable
@omgitsammer
@omgitsammer 2 месяца назад
Jumpto not working it should be jumptopage in all cases
@TorreApps
@TorreApps 2 месяца назад
10/10!
@CodingwithT
@CodingwithT 12 дней назад
Awesome 🤩 thank you
@brunophambu8780
@brunophambu8780 8 месяцев назад
I can't find the SmoothIndicator code in the video. However I see that you imported it, is it a native widget or am I the one who made a mistake?
@CodingwithT
@CodingwithT 8 месяцев назад
Please re watch the video as it's a library that I imported in the pubspec
@brunophambu8780
@brunophambu8780 8 месяцев назад
​@@CodingwithTI was able to solve it by installing it directly from the command line with "flutter pub add smooth_page_indicator THANKS
@caob1876
@caob1876 8 месяцев назад
It won't allow me to get an instance of the controller for the skip button? not sure how else to access instance
@CodingwithT
@CodingwithT 8 месяцев назад
Not allowing?
@mhamadhamed4941
@mhamadhamed4941 3 месяца назад
We should give you an award of some sort
@CodingwithT
@CodingwithT 3 месяца назад
Thank you so much! Your appreciation means the world to me! 🏆😊
@MichaelAjayi-ez5yr
@MichaelAjayi-ez5yr 6 месяцев назад
Hello sir, please I am having an issue, when I tap the skip button, it's jumping to the first onboarding screen, what could be the problem?
@muhammedemad9782
@muhammedemad9782 6 месяцев назад
because you did set the first boarding screen as home in the beginning
@MichaelAjayi-ez5yr
@MichaelAjayi-ez5yr 6 месяцев назад
@@muhammedemad9782 pls what should I do to resolve that?
@CodingwithT
@CodingwithT 6 месяцев назад
Hi, you can use pageController.jumpToPage(2); to navigate directly to the desired page. This should resolve the issue you're experiencing.
@SeriatyTn
@SeriatyTn 6 месяцев назад
can't find the code source in the description
@CodingwithT
@CodingwithT 6 месяцев назад
Here is the link of the source code codingwitht.com/product/flutter-ecommerce-app-with-firebase/
@ggdtechnology-uf1rw
@ggdtechnology-uf1rw 10 месяцев назад
I want to buy this 29$ but let me know one thing can I use this for personal use or can I upload this into Playstore
@CodingwithT
@CodingwithT 10 месяцев назад
In order to do the distribution you should get the extended license from the Envato
@ggdtechnology-uf1rw
@ggdtechnology-uf1rw 10 месяцев назад
@@CodingwithT Okay what is the cost of it
@ggdtechnology-uf1rw
@ggdtechnology-uf1rw 10 месяцев назад
@@CodingwithT I Just want to save my time. this is region why I want to purchase this app for commercial use
@CodingwithT
@CodingwithT 10 месяцев назад
Visit here and also make sure to change your package name before publishing as it should always be unique. codecanyon.net/item/empower-your-development-journey-with-our-fullstack-flutter-ecommerce-solution-envato-exclusive/49680338
@takundachamaona
@takundachamaona Месяц назад
Sorry but when i finished my screen still goes from splash page to blank.. please help
@CodingwithT
@CodingwithT Месяц назад
Make sure you're properly navigating to the onboarding screen after the splash screen. If you are still facing the issue, you have to debug the code.
@CodeEasy11
@CodeEasy11 4 месяца назад
My Splash screen is working in light and dark mode but my Onboarding screen is not working in dark mode can uh please help me out in this
@CodingwithT
@CodingwithT 4 месяца назад
Just make sure the theme is added and also you are using dark mode if else
@smasaduzzaman9808
@smasaduzzaman9808 10 месяцев назад
Just Awesome
@CodingwithT
@CodingwithT 10 месяцев назад
Thank you 😊
@wog4299
@wog4299 6 месяцев назад
from where do you get these amazing gifs ?
@CodingwithT
@CodingwithT 6 месяцев назад
I'm glad you're enjoying the gifs! I source them from various platforms, but one of my favorite resources is icons8.com.
@wog4299
@wog4299 6 месяцев назад
@@CodingwithT thanks
@muhammadrabeet9550
@muhammadrabeet9550 9 месяцев назад
sir i want to deploy my own app like olx in pakistan and i want to build it by using skills can you help us??
@CodingwithT
@CodingwithT 9 месяцев назад
Please reach me at support@codingwitht.com or WhatsApp at +923178059528
@dhirajjadhav5236
@dhirajjadhav5236 8 месяцев назад
is it having both user and admin interfaces
@CodingwithT
@CodingwithT 8 месяцев назад
Yes
@CodingwithT
@CodingwithT 8 месяцев назад
Admin panel is coming Soon
@thephalcon
@thephalcon Год назад
Sir I am new which one is gud flutter or native Android
@CodingwithT
@CodingwithT Год назад
Both have pros and cons but as per the market demands. Go for Flutter
@SomeshGumachi
@SomeshGumachi 3 месяца назад
next page has bug i solved by adding listener to controller to solve.
@sohelindian1988
@sohelindian1988 Год назад
kindly provide splash screen image size as well as onboarindg image size
@CodingwithT
@CodingwithT Год назад
For the Splash screen size is 460 x Width & Height where as the icon inside is only 250 x width & height. This means, the icon should have a space around it. For the Onboarding you can use any size because we are making sure to assign only 60% width to the total screen.
@ayushpanchal3646
@ayushpanchal3646 6 месяцев назад
why you have had depression installed in your machine sir! XD , you know what am talking about
@muhammadsiddiq3598
@muhammadsiddiq3598 6 месяцев назад
?
@CodingwithT
@CodingwithT 5 месяцев назад
It seems like you're referring to a playful comment about encountering unexpected issues or errors while working on a project. While it's common for developers to encounter challenges and frustrations during development, it's important to maintain a positive attitude and seek solutions to overcome obstacles. If you're facing any specific issues or need assistance with your project, feel free to ask, and I'll do my best to help!
@ayushpanchal3646
@ayushpanchal3646 5 месяцев назад
@@CodingwithT brother i was talking about valorant installed in your machine 🤦🏻‍♂️thank you for concern tho
@usamayounis8208
@usamayounis8208 8 месяцев назад
hey sir i want a assets folder how to get this folder
@CodingwithT
@CodingwithT 8 месяцев назад
You can get the starter kit from the product link in the description.
@leulsolomon6588
@leulsolomon6588 Год назад
where can we get those gif icons, the website please
@CodingwithT
@CodingwithT Год назад
You can get those from icons8.com or Simply download the project Starter kit from the link in description
@BansariRadadiya
@BansariRadadiya 9 месяцев назад
i have error in onBorading.dart image data invalid
@CodingwithT
@CodingwithT 9 месяцев назад
Check the url and if extension
@alghanykennedy
@alghanykennedy Год назад
please sir, share image & asset used
@CodingwithT
@CodingwithT Год назад
You can download the project Structure with all the images and assets with complete app structure and helper classes from the link in the description.
@Huma786-tm6fv
@Huma786-tm6fv 8 дней назад
Sir ya image kaha sy ly gy website
@CodingwithT
@CodingwithT 8 дней назад
You can get these from icons8.com
@musautmani6706
@musautmani6706 Год назад
Is it paid code and resources or we can get free?
@CodingwithT
@CodingwithT Год назад
You can get the resources and structure for just $1 or more as much as you want to give away. 🥰
@usamayounis8208
@usamayounis8208 8 месяцев назад
i need a souce code sir bcz i am a beginner
@CodingwithT
@CodingwithT 8 месяцев назад
You can get the source code from the link in the description
@usamayounis8208
@usamayounis8208 8 месяцев назад
i think sir this is a paid a @@CodingwithT
@divyanshsao3846
@divyanshsao3846 5 месяцев назад
how to get similar gifs??
@CodingwithT
@CodingwithT 5 месяцев назад
You can get them from icons8.com
@divyanshsao3846
@divyanshsao3846 5 месяцев назад
@@CodingwithT thankyou and your videos are very informative , thanks for creating it
@tapukoko4507
@tapukoko4507 8 месяцев назад
You play valorant.. haha I do too. Lvl60 tho 😅
@CodingwithT
@CodingwithT 8 месяцев назад
😁
@aouadicharaf1038
@aouadicharaf1038 11 месяцев назад
❤❤❤
@shaibfavour5632
@shaibfavour5632 3 месяца назад
@CodingwithT Please how do i resolve this issue when i run my pub get command ("12 packages have newer versions incompatible with dependency constraints.")
@CodingwithT
@CodingwithT 3 месяца назад
To resolve this issue, try updating your dependencies in pubspec.yaml to compatible versions or run flutter pub upgrade to update all packages to their latest versions. You might need to adjust version constraints if necessary
@thyagosouza8087
@thyagosouza8087 9 месяцев назад
My freiend, in the content of the last button of the image 'next', how do I modify just it? Help me pls! in onboarding_next_button.dart: onPressed: controller.nextPage, child: controllerValue == 2
@CodingwithT
@CodingwithT 9 месяцев назад
You have to wrap it with Obx in order to redraw the design
@bilalahmedkhan941
@bilalahmedkhan941 4 месяца назад
Sir (get/get.dart) file missing
@CodingwithT
@CodingwithT 4 месяца назад
Add that in the import or check if you are using Get package
Далее
📱DOPE Introduction Screens • Flutter Tutorial ♡
12:08
Build anything with v0 (3D games, interactive apps)
9:05
10x Your Speed With Flutter
8:04
Просмотров 59 тыс.
This Took Me 150 Hours to Code
16:40
Просмотров 233 тыс.
How to Create a Stunning Splash Screen in Flutter
9:31