Flutter | An introduction to the open source SDK by Google (original) (raw)

Last Updated : 13 Mar, 2025

Flutter is Google’s Mobile SDK to build native iOS and Android, Desktop (Windows, Linux, macOS), and Web apps from a single codebase. When building applications with Flutter, everything is Widgets – the blocks with which the flutter apps are built. They are structural elements that ship with a bunch of material design-specific functionalities, and new widgets can be composed out of existing ones, too. The process of composing widgets together is called composition. The User Interface of the app is composed of many simple widgets, each of them handling one particular job. That is the reason why Flutter developers tend to think of their Flutter app as a tree of widgets.

Flutter is an open source structure to make superior grade, elite execution versatile applications across portable working frameworks - Android and iOS. It gives a strong, effective, and straightforward SDK to compose versatile applications in Google's language, Dart. This instructional exercise strolls through the essentials of the Flutter system, the establishment of Flutter SDK, setting up Android Studio to foster Ripple-based application, design of Ripple structure, and fostering all sorts of portable applications utilizing Flutter structure.

**Types of widgets

• Stateless Widgets
• Stateful Widgets

**Flutter, Dart, and equivalent technologies

First and foremost, let's state the core differences between Flutter and React Native.

Example of the Flutter Application

**main.dart:

Dart `

// Importing important packages require to connect // Flutter and Dart import 'package:flutter/material.dart';

// Main Function void main() { // Giving command to runApp() to run the app.

/* The purpose of the runApp() function is to attach the given widget to the screen. */ runApp(const MyApp()); }

// Widget is used to create UI in flutter framework.

/* StatelessWidget is a widget, which does not maintain any state of the widget. */

/* MyApp extends StatelessWidget and overrides its build method. */ class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key);

// This widget is the root of your application. @override Widget build(BuildContext context) { return MaterialApp( // title of the application title: 'Hello World Demo Application', // theme of the widget theme: ThemeData( primarySwatch: Colors.lightGreen, ), // Inner UI of the application home: const MyHomePage(title: 'Home page'), ); } }

/* This class is similar to MyApp instead it returns Scaffold Widget */ class MyHomePage extends StatelessWidget { const MyHomePage({Key? key, required this.title}) : super(key: key); final String title;

@override Widget build(BuildContext context) { return Scaffold( appBar: AppBar( title: Text(title), backgroundColor: Colors.green, foregroundColor: Colors.white, ), // Sets the content to the // center of the application page body: const Center( // Sets the content of the Application child: Text( 'Welcome to GeeksForGeeks!', )), ); } }

`

**Output:

And The biggest selling points of Flutter Tech are two things:

1. **High-Performance App: The Apps developed using Flutter are highly expressive and have flexible UI. Its fast development due to hot reloading brings the app to life, and its expressiveness provides features that are keened for native end-user experiences.
2. **Expressive and Flexible UI: Flutter lets developers build beautiful-looking apps with ease by using prebuilt material widgets. Even though many widgets are prebuilt, Flutter still enables full customization of the widget.
3. **Fast Development & Hot Reloading: Hot Reloading refers to the injection of new versions of the files that you edited at runtime while keeping the app running.

**The Pros and Cons of Flutter

**Pros:

• Flutter uses a single codebase, called Dart, for both **Android and iOS. still Flutter still which is a simple language ensuring type safety.
• Both **language and _**community_are developing with great speed, releasing new features, widgets, and add-ons.
• Flutter has its **own set of widgets rather than using the widgets provided by the host operating system, which means the user provides its gesture recognition model, thus having greater control over the precise rendering or customization of the widgets.
• The **Hot-reloading, is a game-changer in the productivity of the development process. It gives a lively effect to the app under development, thus making the whole development cycle more exciting for the developer using Flutter.
• **Flutter is not bound to the ROM w.r.t. the widget system. So, it enhances its portability over a wide ambit of Android versions, thus lowering its dependencies on the host platform.
• Dart and Flutter unite closely to optimize the **dart Virtual Machine(VM) for those mobiles that are specifically needed by Flutter.
• Flutter is an established player in the field of **cross-platform application development with amazing community support.

**Cons:

• Flutter apps are usually **bigger in size than native apps.
• While Dart is robust, **it is not as popular as JavaScript or Kotlin/Swift, which could influence hiring and familiarity in the community in certain areas.
• While Flutter is strong on mobile, its web and desktop support lags behind more established frameworks in those areas.
• **Third-party plugins might not be as powerful or completely featured as native ones, at times causing problems when implementing particular native features.
• **Dart lacks a complete, popular backend framework, so you may have to depend on other technologies if you need a full-stack solution.