Login Page in Flutter tutorial - Flutter Login Page UI 2023

[@aquamarin6160]

Aleyküm Selam from Türkiye. You are the best teacher I have ever seen. You are quite inspiring.

[@CodingwithT]

Thank you so much 😊

[@legardemontcho6739]

Thanks to you I've improved the way I comment on code. Your code is readable and understandable by everyone. Well done!

[@CodingwithT]

You welcome dear, I am glad it’s helpful for everyone 😁

[@FelipeCampelo0]

Wow! What learning journey this series is!

[@CodingwithT]

Glad you think so

[@FelipeCampelo0]

11:58 In 'onboarding_controller.dart' I had to make these updates: FROM /// Jump to the specific dot selected page. void dotNavigationClick(index) { currentPageIndex.value = index; pageController.jumpTo(index); *here* } TO /// Jump to the specific dot selected page. void dotNavigationClick(index) { currentPageIndex.value = index; pageController.jumpToPage(index); *Make sure it is jumpToPage* }

[@marleyfozeu8819]

Hello,the next button still don't work even after the changed. any other suggestions ?

[@nellahroe8872]

how do i create the widgets to work how you did? do i create all the dart files normally/manually , create a class and paste the codes for each? i don't understand, please some one help me

[@MuhammadUsama-vv1wo]

Hello there!! at 11:20 my next button is not working as it does not take me to the next onboarding screens and after pressing the skip button it took me last onboarding screen but next button not take me to the login screen. When i pressed the next button is shows the pressing but not working also same with dotNavigation dots. Kindly give me the reasons as i have mentioned the next button code below: ///Update Current index & Jump to next Page. void nextPage() { if(currentPageIndex.value == 2){ Get.offAll(const LoginScreen()); } else{ int page = currentPageIndex.value + 1; pageController.jumpToPage(page); } }

[@CodingwithT]

Can you book your coat and check if it is working or not if it is even entering in that statement?

[@MuhammadUsama-vv1wo]

@@CodingwithT i can not get you. Can you please elaborate it??

[@paulmurray3244]

where did you source those amazing animated gifs? I'd love to change them, for my app.

[@CodingwithT]

You can search them on Icons8 and if you want lottie files, you can get those from Lottiefiles.com

[@dark_sidegaming1829]

hello, I wanna ask something when u select a column in the code under (logo, Title & Sub-Title) at time 14:38 from the video what did u name it? you said you will do it all real quick and skipped after u did it and I didn't know what to do so that left me lost and now idk what to name it?😢

[@CodingwithT]

Sorry for the confusion. You can name it anything you like. I named them as TLoginHeader, TLoginForm, ....

[@dark_sidegaming1829]

@@CodingwithT Yeah ik u can name them anything i just want to ask which ones cz there are many words named column btw thanks for your help I'm working now with flutterflow I found it much easier for me and last thing I wanna say I REALLY LIKE YOUR VIDEOS KEEP GOING!!!

[@bentalla]

Hey Sir how are you ? Tell me what is the extension that u use for making your code like a three

[@CodingwithT]

I didn't add any extension. It's built-in in the Android studio. I guess you can find this out in settings -> languages -> flutter. Do Google

[@NavdeepMaheshwari]

Sir where can we find the styling of ElevatedButtons , TextFormFields etc. please create a short video for that as well.

[@CodingwithT]

It's already created in Section 1 of this same playlist. You only have to design your Buttons, TextFormField and any other Widget in the Themes for both light and dark modes and you are done. Please watch the 2nd Video of Themes in Flutter of this playlist. Link is in the description

[@NavdeepMaheshwari]

Thank You Sir@@CodingwithT

[@CodingwithT]

You're welcome 😊

[@ZiadThabet-nh4tg]

is there flutter tutorial for admin panel?

[@hemantprajapati5323]

Why you're not using mediaquery for spacing and other stuff. How are you going to make app responsive on basis of different devices??

[@CodingwithT]

This tutorial is primarily focused on developing for Android and iOS platforms, rather than web. We're implementing adaptive design principles to ensure the app functions well across various mobile devices. I'll be uploading tutorials specifically focused on the admin panel. Stay tuned for those tutorials-they'll cover everything you need to know for creating a responsive design for web. If you have any other questions or suggestions, feel free to share!

[@taku_and_jesus]

When you used the refractor please clearly explain what you did after cause its showing errors on my side

[@CodingwithT]

I am sorry for your error. Can you please explain what error you are encountering?

[@aegiberry5890]

hii the widgets (folder) that contains onboarding dart script on previous video you put inside screens(folder). but in this video you move the widgets folder in common (folder), right?

[@CodingwithT]

yes all widget that can be reuseable is placed in common folder

[@b.farhana]

sir could you please tell me which website is you are using for illustration images🙂

[@CodingwithT]

icons8.com

[@b.farhana]

@@CodingwithT Thank You sir

[@CodingwithT]

Anytime ☺️

[@TeamProfitisers]

Could you please assist us to resolve this error? Exception has occurred. _AssertionError ('package:flutter/src/widgets/scroll_controller.dart': Failed assertion: line 155 pos 12: '_positions.isNotEmpty': ScrollController not attached to any scroll views.)

[@TeamProfitisers]

The error appears when I click on the Next Button (to move to the login screen).

[@GlamAngles]

Sir! do you have Linkdln account?

[@bukor0su368]

i dont understand how is the rememer me text changing color when u toggle between themes, even though u did not use theme.of(context) :(

[@CodingwithT]

You are right. It’s because I already did the theme setup for Checkbox

[@bukor0su368]

@CodingwithT not the check box, I meant the text 'remember me' how is it adjusting it's color based our App's theme ? + Thanks for responding 💗

[@mehrdadhosseini5448]

I used the TextInputFormField as you did, But the Theme data style has not been applied on it

[@CodingwithT]

Did you created your themes and assign them in the MaterialApp?

[@RhushiDoshi]

E/flutter (10914): [ERROR:flutter/runtime/dart_isolate.cc(147)] Could not prepare isolate. E/flutter (10914): [ERROR:flutter/runtime/runtime_controller.cc(549)] Could not create root isolate. E/flutter (10914): [ERROR:flutter/shell/common/shell.cc(690)] Could not launch engine with configuration. can you please give me the detailed solution for the following error

[@moeednisar9444]

Why TFormDivider(dividerText: TTexts.orSignInWith.capitalize!), is giving error? Please suggest Error: Method invocation is not a constant expression.

[@CodingwithT]

Just remove the "const". Which is used before the widget.

[@moeednisar9444]

Thank you

[@mdzunaed7414]

Thank you sir for this playlist. Sir can I get the figma file or the design link if have any?

[@CodingwithT]

Thank you! 🙏 I appreciate your support! I don't have a Figma file or design link as I created it myself. 😊

[@teikou3593]

Thanks for your sharing. When I run the code in simulator device(PixelXL30) I got an error as "RenderBox was not laid out: RenderFlex#ff9cc relayoutBoundary=up14 NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDAT" After I check the code line by lien, the issue might related to "Remember Me & Forget Password" part of login_form.dart. Even I tried use "Flexible" and "Expanded" in front of checkbox and textbutton as suggested in internet, the issue still couldn't be solved. Do you have any hint? Thanks in advance.

[@CodingwithT]

Reach me at codingwitht.com/contact-us and I will share the solution

[@Mrlikeandshare]

siir thanks a lot, i have one question plz, when i switch phone from light mode to dark mode the button create account dosn't change in dark mode still in black there is an solution plz ?

[@CodingwithT]

Did you watch the theme tutorial? I have create elevated button theme in it. kzbin.info/www/bejne/eaWcdKWDmsyYsLM at 15:21. After creating elevated button theme you will be able to change the color of your button in different modes. If your issue persists, you can contact me on whatsapp.

[@Mrlikeandshare]

thanks a lot @@CodingwithT

[@iacopopaolucci6410]

Which font is used for title and subtitle? Can you show the style file ? Because I copy your code, line by line, but my UI is not good like your, thanks for all!

[@CodingwithT]

I have used the Poppins font, I suggest you to watch the previous Section 1 of this Playlist. Your all questions will hopefully be solved 🤩

[@iacopopaolucci6410]

@@CodingwithT for Section 1do you mean the First video of this Playlist? Can you share the link of the video because I don't found this Section, thanks!

[@CodingwithT]

kzbin.info/aero/PL5jb9EteFAOAusKTSuJ5eRl1BapQmMDT6

[@iacopopaolucci6410]

@@CodingwithT thank you very much!🫶

[@CodingwithT]

Anytime 😊

[@ChildrensDancing]

Has anyone solved the problem with the jump button, if so please help

[@CodingwithT]

Hi, I am sorry that you got the error in the code. I know that getting the error is frustrating. You can share the details of the error on my WhatsApp so that I can get to know what is the issue and help you resolved the error.

[@huantruong8793]

I have an issue with labelText, it turns black when TextFormField is focused in dark mode. Pls instruct me to solve the issue

[@CodingwithT]

did you set up the theme of the project? You can also get the project starter kit from the product link in the description for free.

[@huantruong8793]

@@CodingwithT I did set up the project theme and tried the project starter kit also. But I still have the issue. I am currently running flutter 3.19.3

[@pusula571]

Hello. Did you solve the problem?

[@Khaled_Abd-Elazem]

i cant go to login page from the OnBoardingScreen it keeps say [GETX] GOING TO ROUTE /LoginScreen [GETX] REMOVING ROUTE / what can i do?

[@اسماعيلكشك-ذ1و]

are u sure in onBoarding controller in the skipPage function u did it pageController.jumpToPage(page); ?..... don't forget to add jumptoPage()

[@Khaled_Abd-Elazem]

yah its the same @@اسماعيلكشك-ذ1و

[@codekisssundaysayil9080]

what tools are you using to zoom in and out easily

[@CodingwithT]

Video editor?

[@codekisssundaysayil9080]

Yes, the video editor, I enjoy your presentation. It's clear.

[@ishuraa-b]

Why are we using Theme.of(context).textTheme.headlineMedium for the style property & not TTextTheme.lightTextTheme.headlineMedium directly for Text widget?

[@CodingwithT]

Because Theme.of(context).textTheme will automatically change the theme of the text when it is in the dark mode or the light mode.

[@ishuraa-b]

@@CodingwithT Ok so we don’t have to create the dark variable for checking the mode then

[@binildev9064]

when I convert the divider to widget it ask for a required dark as a boolean value, but it is not occurred in the video. What can I do to fix that?

[@CodingwithT]

I've shown that. You have to simply create a final dark = THelperFunction.isDarkMode()

[@CuongHoang-nk8ig]

@@CodingwithT where can i find that sir, i got the same problem

[@CuongHoang-nk8ig]

did you solve this problem?

[@asthma2616]

Hello my dear friend. Why can't I make rounded shape margins like yours? Which parameter is responsible for this?

[@CodingwithT]

Hi, to make the rounded shape margins of the buttons you have to use shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(TSizes.buttonRadius)),

[@asthma2616]

@@CodingwithT thank you!

[@iamrealadnan1786]

Sir my next button and skip is not working..What should I do?

[@CodingwithT]

Please check if you've correctly linked the onPressed functions for both buttons and ensure the necessary logic is implemented.

[@ChildrensDancing]

Hello, I really liked this course, but I have an error here with the jump button, more precisely, the dots and the NextPage button do not work for me, please help me solve the problem that I can continue the course

[@CodingwithT]

Hi, I am sorry that you got the error in the code. I know that getting the error is frustrating. You can share the details of the error on my WhatsApp so that I can get to know what is the issue and help you resolved the error.

[@TeamProfitisers]

You just need to comment some lines to jump to the Login Screen: // - means comment. void nextPage() { // if(currentPageIndex.value == 2){ Get.offAll(const LoginScreen()); } // else{ // int page = currentPageIndex.value + 1; // pageController.jumpToPage(page); Try this!

[@deadmet21]

how do you make your emulator skin look like iphone?

[@utsavkhamar8948]

How to get a job in flutter ?? I have 6 month of internship experience in flutter still getting problems to get a fresher level job

[@CodingwithT]

Keep up with a Good work. build strong profile by doing freelance projects and do not focus on the money. You might at the end come up with your own Business.

[@pusula571]

Selamun Aleyküm. E-mail ve Password'dun labelText'i üzerine tıklanınca darkMod'da siyah oluyor, beyaza dönmüyor. Yardımcı olurumsunuz. Saygılar.

[@CodingwithT]

Wa Alaikum Assalam. Did you set the theme of the project? kzbin.info/www/bejne/eaWcdKWDmsyYsLMsi=9DNFA17GNyw72WPr setup the theme to get change the colors accordingly./

[@pusula571]

@@CodingwithT Evet, belirtim. Size ekran görüntüsü göndermek istiyorum. Nereden göndere bilirim?

[@fizz1028]

How to change create account button color?

[@CodingwithT]

You can change the color of outlined button from utils=>theme=>widget_themes=>outlined_button_theme.dart

[@mahmoud_hamdy_flutter]

briliant

[@CodingwithT]

Thank you for your support ❤️

[@marleyfozeu8819]

Hello, i've a problem with the next button, it doesn,t work for me. Any suggestions ?

[@marleyfozeu8819]

Also, are they 02 onboarding files?, Because the codes changed from the previous tutorial thanks

[@CodingwithT]

There could be several reasons why it's not functioning properly. You have to Check Button Implementation, Inspect Navigation Logic. Debug the code so that we can find issues

[@CodingwithT]

No, there is only one file of onboarding but there are different classes that are connected.

[@azeemhassanch]

Bro please increase font size overall in your next tutorials

[@CodingwithT]

Noted

[@WoyEjak]

Sir, why isDarkMode not working on my phone? it always evaluates to false

[@CodingwithT]

Never happened before. Do a restart

[@activegoogle4501]

احسنت الشرح

[@alielemam3149]

how to run iphone emilator in windozz??

[@CodingwithT]

not recommended to ron iphone emultor in windows but Running an iPhone emulator (iOS simulator) on Windows is not directly supported by Android Studio or any other official tools provided by Apple. iOS development and testing require macOS and Xcode, which is only available on Mac computers. However, there are some alternative solutions you can consider: Use a Cloud-based iOS Simulator: There are cloud services that offer iOS simulators accessible from a web browser. You can upload your app to these platforms and test them on virtual iOS devices. Examples include Appetize.io and BrowserStack. Install macOS on a Virtual Machine: You can create a virtual machine on your Windows PC using software like VMware or VirtualBox and install macOS on it. Once macOS is installed, you can install Xcode and use the iOS simulator as you would on a Mac. Use Remote Testing Services: Some testing services provide access to physical iOS devices remotely. You can remotely control these devices from your Windows PC and test your apps. Examples include AWS Device Farm and Firebase Test Lab. Keep in mind that while these solutions allow you to test iOS apps on Windows, they may have limitations compared to testing on a real Mac machine. Additionally, ensure that you comply with Apple's licensing agreements and terms of use when using macOS in a virtualized environment.

[@yassinerighi3787]

where cani get those icons? (the arrow and password)

[@CodingwithT]

It's the Iconsax library. Please watch the first Section 1 videos.

[@salmanahmed3938]

is your app responsive? because you are giving fixed height and width.

[@CodingwithT]

There are two approaches responsive and adaptive. I have used the adaptive approach for the app. My app is made on an adaptive approach which will adapted by all mobiles. This means that while some elements may have fixed sizes for consistency and design integrity, the layout as a whole adjusts and scales appropriately to fit various screen sizes and resolutions. This ensures a seamless user experience across different devices.

[@omgitsammer]

why we litterly need a directory inside directory inside directory to save a variable and then wasting time writing its in require dplace so annoying

[@CodingwithT]

I understand that it can feel cumbersome, but the feature-first folder structure is designed to help manage and scale projects more effectively. It organizes related components, making it easier to navigate and maintain as the project grows.

[@omgitsammer]

As I keep continuing this course now I can understand your point. It's annoying but also very useful at the end. Sorry for being toxic that's worth watching playlist

[@musautmani6706]

You have to teach slowly,ur speed of teaching is lead us toward confusion,we can not understand things properly.

[@botplaysgame]

bro it depends on preferences I like to watch tutorial videos at 2x. These videos are at perfect speed some people like to make video at slower speed so that they can have longer videos but here at least he is giving quality content in less period of time. You can always watch at 0.5x. Its all personal preferences bro.

[@CodingwithT]

You both are right. I will try to find some way out 😀

[@musautmani6706]

Yes I do agree but for beginners it is difficult to understand things properly that's why I have said,anyway sir is putting his best in the course.

[@CodingwithT]

Thank you bro

[@musautmani6706]

@@CodingwithT 😘😍

[@aouadicharaf1038]

❤❤❤

[@javidibra6786]

👌🤙🤙🤙

[@CodingwithT]

🎉🎉

[@shahzaibmehmood65]

Why are you not using the buttons your tutorial is distracting

[@CodingwithT]

Can you please explain what do you mean by not using buttons(which buttons and where) and where are you confused?