Перейти к содержимому

Build a Flutter Profile Screen | UI + Functionality | Capstone Project | Lecture 4

Ayushi Shiksha

0:00 / 0:00

Build a Flutter Profile Screen | UI + Functionality | Capstone Project | Lecture 4

13 просмотров · 10 ч назад
Ayushi Shiksha
233 подписчика
13 просмотров · 10 ч назад
Learn how to build a Flutter Profile Screen UI with functionality in this step-by-step Flutter tutorial. Create a professional profile page featuring personal information, notifications, security, settings, help and support, and logout. Welcome to Ayushi Shiksha's Flutter Capstone Project, where we apply Flutter layout concepts to build a practical mobile app screen. WHAT YOU WILL BUILD Flutter Profile Screen UI Profile header with user information Personal Information section Notifications and Security sections Settings and Help & Support options Logout option Professional layout, spacing, icons, and alignment Functional interactions demonstrated in the tutorial WHAT YOU WILL LEARN Understand how to combine Flutter widgets to create a profile page, organize account settings, and implement relevant user interactions. FLUTTER AND DART COURSES Continue your learning journey with these complete course playlists: Flutter Course:    • Flutter Full Course — From Beginner to Job...   Dart Course:    • Dart Full Course | Learn Dart from Scratch...   Flutter + Dart Full Course Playlist:    • Flutter & Dart Full Course | Learn Dart & ...   00:00 – Introduction & Project Overview (Capstone Project) 01:56 – What is a Capstone Project? 03:32 – Step 1: UI Planning & Wireframing 05:30 – Walkthrough of the Profile Screen Design & Hierarchy 08:52 – Setting Up the Flutter Project & Simulator Setup 10:10 – Project Cleanup & Creating the Profile Screen Widget 11:53 – Building the App Bar 14:24 – Section 1: Profile Header, Avatar & User Details 19:20 – Adding Location Row (Icons + Text) 22:15 – Adding Edit Badge with Stack & Positioned Widget 25:20 – Section 2: Building the Settings Menu List 31:12 – Aligning Menu Items with Spacer 33:14 – Refactoring into a Reusable CustomTile Component 39:05 – Adding Conditional Dividers to Menu Tiles 42:23 – Customizing Icons, Colors & Logout Styling 48:22 – Final Walkthrough & Conclusion WHO SHOULD WATCH? Flutter beginners learning app development Developers practising Flutter UI design Students building practical Flutter projects Anyone learning to create profile and settings screens in Flutter SUBSCRIBE TO AYUSHI SHIKSHA Learn Flutter, Dart programming, mobile app development, and practical software development through hands-on tutorials. YouTube Channel:    / @ayushishiksha   #Flutter #FlutterTutorial #FlutterUI