Using a single code base, Flutter is Google’s UI toolkit for creating stunning natively built iOS and Android apps. Widgets are the foundational element of Flutter applications, and we begin by building any application with them. Widgets specify how their current configuration and status should appear in their display. Among many other widgets, it has a text widget, row widget, column widget, and container widget.
Widgets: In a Flutter application, every element on a screen is a widget. The selection and arrangement of the widgets used to construct the apps determine exactly how the screen appears. Additionally, an application’s code is organised into a tree of widgets.
Category of Widgets:
The Flutter widgets are primarily categorised into 14 groups. They are mostly divided according to the functionalities they offer within a Flutter application.
- Accessibility: These are the widgets that increase the accessibility of a Flutter application.
- Motion and Animation: These widgets give other widgets motion.
- Images, Icons, and Assets: These widgets manage assets like show icons and display images.
- Async: These enable the flutter application to have async capabilities.
- Basics: The Basics are a collection of widgets that are a must for creating any kind of Flutter application.
- Cupertino: These are the iOS-designed widgets from Cupertino.
- Input: In a Flutter application, this collection of widgets provide input capability.
- Interaction Models: Presently available widgets
- Layout: This set of widgets assists with arranging the other widgets on the screen according to their needs.
- Material Components: Material Components are a collection of widgets that primarily adhere to Google’s Material Design.
- Painting and effects: This group of widgets alters the appearance of its child widgets without affecting their form or arrangement.
- Scrolling: This gives a number of additional widgets that aren’t scrollable by default the ability to scroll.
- Styling: This includes the app’s sizing, responsiveness, and theme.
- Text: Text is shown here.
Types of Widgets:
There are broadly two types of widgets in the flutter:
- Stateless Widget
- Stateful Widget
Example: The Layout Tree of basic app screen using Stateless Widgets:
An example of a stateful widget-based layout tree is seen in a basic app screen. The identical outcomes as the code above are likewise obtained by this.
The following is a description of the widgets used:
- Scaffold: Puts into practise the fundamental visual layout framework of material design.
- App-Bar: This creates a bar at the screen’s top.
- Text: Any text that is written on the screen.
- Container: To hold any kind of widget.
- Centre: To arrange other widgets in the centre.
