Scribd
Upload
23 views

Flutter AlertDialog 1

An alert dialog is a pop-up widget in Flutter that notifies users and requests input or action. It has a title, content area, actions below the content, and is customizable through properties like shape, padding, and type. Common types include basic, confirmation, select, and text field alerts. Alerts should be used for quick responses and notifications.

Uploaded by

kylan
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
23 views

Flutter AlertDialog 1

An alert dialog is a pop-up widget in Flutter that notifies users and requests input or action. It has a title, content area, actions below the content, and is customizable through properties like shape, padding, and type. Common types include basic, confirmation, select, and text field alerts. Alerts should be used for quick responses and notifications.

Uploaded by

kylan
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

Flutter Alert Dialog

D. Gichuki,
Alert Dialog

• An alert dialog is a useful feature that notifies


the user with important information to make a
decision or provide the ability to choose a
specific action or list of actions.
• It is a pop-up box that appears at the top of the
app content and the middle of the screen.
• It can be dismissed manually by the user before
resuming interaction with the app.
Alert Dialog

• An alert can be thought of as a floating modal which


should be used for a quick response such as password
verification, small app notifications, and many more.
• The alerts are very flexible and can be customized very
easily.
• In Flutter, the AlertDialog is a widget, which informs the
user about the situations that need acknowledgment.
• The Flutter alert dialog contains an optional title that
displayed above the content and list of actions
displayed below the content.
Properties of Alert Dialog

• Title: This property gives the title to an


AlertDialog box that occupies at the top of the
AlertDialog.
• It is always good to keep the title as short as
possible so that the user knows about its use
very easily. We can write the title in AlertDialog
as below:
AlertDialog(title: Text("Sample Alert Dialog"),
Properties of Alert Dialog

• Action: It displays below the content. For example,


if there is a need to create a button to choose yes
or no, then it is defined in the action property only.
• We can write an action attribute in AlertDialog as
below:
actions: <Widget>[
FlatButton(child: Text("Yes"),),
FlatButton(child: Text("No"),)
],)
Properties of Alert Dialog

• Content: This property defines the body of the


AlertDialog widget. It is a type of text, but it can also
hold any kind of layout widgets.
• We can use the Content attribute in AlertDialog as
below:
actions: <Widget>[
FlatButton(child: Text("Yes"),),
FlatButton(child: Text("No"),)
],)
content: Text("It is the body of the alert Dialog"),
Properties of Alert Dialog

• ContentPadding: It gives the padding required


for the content inside the AlertDialog widget.
• We can use ContentPadding attribute in
AlertDialog as below:
contentPadding: EdgeInsets.all(32.0),
Properties of Alert Dialog

• Shape: This attribute provides the shape to the


alert dialog box, such as curve, circle, or any
other different shape.
shape: CircleBorder(),
shape: CurveBorder(),
Properties of Alert Dialog

• We can categories the alert dialog into multiple


types, which are given below:
Basic AlertDialog
Confirmation AlertDialog
Select AlertDialog
TextField AlertDialog

• Example

You might also like