Summary

Full Transcript

🎓 Course: Flutter Mobile App Development 02 Flutter UI & Layout Fundamentals 👨‍🏫 Instructor: Dr. Abbas Malik 🏛 University: Prince Sultan University – College of Computer & Information Sciences 💡 Perfect for beginners in Flutter or anyone looking to strengthen their UI/UX layout skills in mobile development! 🔹 Course GitHub Repository: 📂 All course materials, code examples, and projects: https://github.com/mgmalik/flutterappdev In this lecture, Dr. Abbas Malik introduces the core concepts of building user interfaces in Flutter using widgets. Learn how to structure your app with Scaffold, design responsive layouts, and understand the widget composition hierarchy. Topics Covered: Stateless vs Stateful, Scaffold: AppBar, Navigation Bar, Drawer, Bottom Sheet, FAB Layout Models: Rows, Columns, Constraints, and Box Types Single-Child vs Multi-Child Layout Widgets Building a Custom Stateless Widget (BorderedImage) Using Expanded Widgets and Scrollable Views Practical UI Alignment: Main Axis vs Cross Axis Code Examples: Creating a bordered image widget Structuring pages with Scaffold Arranging UI with Row, Column, Center, and Container Implementing scrolling and flexible layouts Links Flutter Widgets Fundamentals: https://docs.flutter.dev/get-started/fundamentals/widgets Material Design Components: https://m3.material.io Flutter Layout Guide: https://docs.flutter.dev/ui/widgets/layout Image download: https://flutter.dev/brand Project Assets Setup: Learn how to add images and assets to your Flutter project and configure pubspec.yaml for seamless development. #Flutter #UI #MobileDevelopment #Widgets #Layout #FlutterTutorial #Scaffold #Row #Column #AppDevelopment