Scribd
Upload
6 views20 pages

Lect 3

Uploaded by

mohammedrobid99
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
6 views20 pages

Lect 3

Uploaded by

mohammedrobid99
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 20

Mobile application

Flutter
lect3

T\ Sondos Saif
Material
• App Bar: The App bar provides content and actions related to the current .
It’s used for branding, screen titles, navigation and actions.

2
Material
• Banner: displays an important, succinct message, and provide actions for
users to address (or dismiss the banner). A user action is required for it to be
dismissed.

3
Material
• Bottom app bar: provide access to a bottom navigation drawer and up to
four actions, including the floating action button.

4
Material

• Bottom navigation: provide a navigation in the bottom of the app.

5
Material
• Bottom sheet: it is a widget appear from the bottom when doing some
events such as clicking button.

6
Material
• Buttons: A widget that do some action when clicking it, and has multiple
types:

Text button outlined button


Elevated button

7
Material

Toggle button Floating Action button

8
Material
• Cards: A card is a sheet of material used to represent some related
information, for example, an album, a geographical location, a meal, contact
details, etc.

9
Material
• Data tables: displays information in a grid-like format of rows and columns.
They organize information in a way that’s easy to scan, so that users can look
for patterns and insights.

10
Material
• Dialog: pop up messages.

Alert Alert with title

Full Screen
11

Simple
Material
• Divider.

12

Horizontal Divider
Material
• Grid lists. • Lists.

13
Material
• Menu.

14
Material
• Navigation drawer: A Material design panel that slides in horizontally from
the edge of the screen to show navigation links in an application.

15
Material
• Navigation rail: A Material widget that is meant to be displayed at the left or
the right of an app to navigate between small number of views, typically
between three and five.

16
Material
• Pickers . • Progress indicator . • Selection control.

17
Material
• Sliders . • Tabs. • Text fields.

18
Material
• Snackbars: inform users of a process that an app has performed or will perform.
They appear temporarily, towards the bottom of the screen. They shouldn’t
interrupt the user experience, and they don’t require user input disappear.

19
Material
• Tooltips: provide text labels that help to explain the function of a button or other
user interface action. Tooltips display informative text when users hover over,
focus on or long press an element.

20

You might also like