CTMOBPRGL - Week 2 Intro to Flutter PDF

Course Material BSIT Department Flutter Cross Platform Framework  Course Material BSIT Department Learning Outcomes Develop a foundational understanding of Flutter and its role in mobile app development. Recognize the key features and advantages of using Flu...

Course Material BSIT Department Flutter Cross Platform Framework  Course Material BSIT Department Learning Outcomes Develop a foundational understanding of Flutter and its role in mobile app development. Recognize the key features and advantages of using Flutter. Install and set up the Flutter development environment.  Course Material BSIT Department Introduction to Flutter What is Flutter- getting to know Flutter. Setting up Flutter- a guide how to set up the Flutter SDK.  Course Material BSIT Department What is Flutter? Understanding Flutter  Course Material BSIT Department Flutter Flutter is an open-source UI toolkit created by Google for building natively compiled applications for mobile, web, and desktop from a single codebase. It is widely recognized for its efficiency in cross-platform development, allowing developers to write code once and deploy it across multiple platforms without compromising on performance or user experience. Key Features: Single Codebase Hot Reload Rich Set of Widgets High Performance Dart Language  Course Material BSIT Department Why Flutter? Time Efficiency: Reduces development time by enabling cross- platform development. Customizable UI: Offers flexibility to create visually appealing and highly customizable designs. Native-Like Performance: Applications built with Flutter are compiled to machine code for faster performance. Open Source: Free to use with frequent updates and community contributions. Feature Flutter React Native Xamarin Native Development Language Dart JavaScript C# Swift/Kotlin Performance High Moderate High Native-level Hot Reload Yes Yes Limited No  Course Material BSIT Department Architectural layers The foundational classes and core services, such as animation, painting, and gestures, provide commonly used abstractions that simplify access to the underlying system. The rendering layer offers a layout abstraction, enabling the creation and manipulation of a tree of renderable objects. These objects can be dynamically adjusted, with the tree automatically updating its layout to reflect any changes. The widgets layer serves as a composition abstraction, linking each render object in the rendering layer to a corresponding class. This layer also facilitates the creation of reusable class combinations and introduces the reactive programming model. The Material and Cupertino libraries provide extensive sets of controls,  Course Material BSIT Department Anatomy of an app  Course Material BSIT Department Build UI A widget declares its user interface by overriding the build() method, which is a function that converts state to UI  Course Material BSIT Department Setting Up Flutter  Course Material BSIT Department Install Flutter SDK Install | Flutter  Course Material BSIT Department Extract to C: Add to PATH  Course Material BSIT Department Run flutter doctor  Course Material BSIT Department Activity Build an app  Course Material BSIT Department Build your first app Go to VS Code and download the Flutter Extension  Course Material BSIT Department Build your first app Press Ctrl + P and select Flutter: New Project  Course Material BSIT Department Build your first app Select the Application and select a folder that you want to build onto  Course Material BSIT Department Build your first app Select a device to run.  Course Material BSIT Department Build your first app Press Ctrl + ` to see the terminal and type flutter run then enter.  Course Material BSIT Department Q and A  Course Material BSIT Department References https://docs.flutter.dev/resources/architectural-overview https://docs.flutter.dev/get-started/install https://docs.flutter.dev/ui  Course Material BSIT Department Thank you!!