0% found this document useful (0 votes)
11 views

Lecture 6

The document discusses different Flutter widgets for displaying lists and buttons including GridView, FloatingActionButton, MaterialButton, and ElevatedButton. It describes their constructors, properties, and usage.
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
11 views

Lecture 6

The document discusses different Flutter widgets for displaying lists and buttons including GridView, FloatingActionButton, MaterialButton, and ElevatedButton. It describes their constructors, properties, and usage.
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 34

Software Engineering 2

Lecture 6
2023 2024

11/7/2023
Flutter
‫المرجع‬
Flutter documentation

11/7/2023
GridView class
• A scrollable, 2D array of widgets.
• GridView.count: Creates a scrollable, 2D array of widgets with a fixed
number of tiles in the cross axis.
• GridView.builder: creates a grid with a large (or infinite) number of
children,

11/7/2023
11/7/2023
11/7/2023
The children are spaced apart using
the crossAxisSpacing and mainAxisSpacing properties.

11/7/2023
11/7/2023
11/7/2023
11/7/2023
11/7/2023
11/7/2023
properties
• gridDelegate
A delegate that controls the layout of the children within the GridView.
• crossAxisCount
The number of children in the cross axis
• crossAxisSpacing
The number of logical pixels between each child along the cross axis.
• mainAxisSpacing
The number of logical pixels between each child along the main axis.
• childAspectRatio
the ratio of the cross-axis to the main-axis extent of each child.
• mainAxisExtent
The extent of each tile in the main axis. If provided it would define the logical pixels taken by each
tile in the main-axis.
If null, childAspectRatio is used instead.

11/7/2023
11/7/2023
11/7/2023
11/7/2023
11/7/2023
FloatingActionButton class

• Constructors

• FloatingActionButton
Creates a circular floating action button.
• FloatingActionButton.large:
Creates a large circular floating action button.
• FloatingActionButton.small
Creates a small circular floating action button.
• FloatingActionButton.extended
Creates a wider StadiumBorder-shaped floating action button with an optional
icon and a label.
11/7/2023
11/7/2023
FloatingActionButton class
• Properties
• onPressed
The callback that is called when the button is tapped or otherwise activated.
• tooltip → String?
Text that describes the action that will occur when the button is pressed.
• Mini
Controls the size of this button.
• Child
The widget below this widget in the tree.
• backgroundColor
The button's background color.

11/7/2023
11/7/2023
11/7/2023
11/7/2023
MaterialButton

11/7/2023
11/7/2023
11/7/2023
11/7/2023
11/7/2023
11/7/2023
ElevatedButton class

• Constructors
• ElevatedButton
• Create an ElevatedButton.
• ElevatedButton.icon
Create an elevated button from a pair of widgets that serve as the button's icon
and label.

11/7/2023
• ElevatedButton
• Properties
• child
Typically the button's label
• onLongPress
Called when the button is long-pressed.
• onPressed
Called when the button is tapped or otherwise activated.
• style
Customizes this button's appearance.

11/7/2023
ElevatedButton class

11/7/2023
11/7/2023
11/7/2023
11/7/2023

You might also like