Flutter Responsive Login UI - Android, IOS, Desktop and Web | Flutter UI Tutorial - Speed Code



Published
#flutter #flutterui #responsive #flutterResponsive #responsiveUI #speedcode

In this video, we will make the responsive layout for the web admin login page and mobile view login page. In the complete project #raleway font family is used , so for this we will take google fonts package from #pub.dev.

We will learn:

► Responsive Login UI - Web, Desktop and Mobiles
► Custom class for colors in flutter
► Custom class for images in flutter
► Custom class for font family in flutter
► how to use google #fonts package in #flutter project
► how to use #flutter_svg packaga in flutter project


► Source code: https://github.com/flutter99/responsive_layout_login_ui


► Time Stamps:
00:00 Intro
00:45 Package added from pub.dev
01:36 Custom class for app colors
02:25 Start work on login screen
07:32 Assets export from figma
08:04 Custom icon class for app icons
12:58 Responsive widget create
13:36 Make Screen Responsive
15:37 Final output on web and mobiles

So, in this way we can make the responsive screens for app and web by using the flutter framework and dart language.


Related Videos Link:

Flutter - How to use Flutter Zoom Drawer in #flutter projects (2022) :
https://youtu.be/Sa6kzl3oALw

How to use flutter_native_splash package:
https://youtu.be/anMRUfxnOnc

How to change app icon, name and package name in flutter app:
https://youtu.be/o-xZeV4lc2s

A flutter counter app with GetX:
https://youtu.be/xZwqtAXnz5o

Flutter Counter App with #provider State Management
https://youtu.be/5CpbFTZMIQk


Thanks for watching!
Make sure to like + Subscribe For More!
Category
Web design
Be the first to comment