CODEWITHSUNDEEP
flutterflutter-layout
Hammad Tariq
Hammad Tariq

Reputation: 13441

What is the difference between Material and MaterialApp in Flutter?

I am developing an app using Flutter. If I choose MaterialApp as the parent widget of my app, all Text widgets in my app are underlined yellow. On the other hand, if I just use Material as the parent widget, no yellow lines are shown under the Text widgets.

What is the difference between Material and MaterialApp?

Upvotes: 26

Views: 17741

Answers (2)

Rohit Mandiwal
Rohit Mandiwal

Reputation: 10462

MaterialApp : The MaterialApp configures the top-level Navigator to search for routes or to define Home.

Material : For child UI widgets rendering & effects.

Upvotes: 1

Rémi Rousselet
Rémi Rousselet

Reputation: 276997

MaterialApp is a widget that introduces many interesting tools such as Navigator or Theme to help you develop your app.

Material is, on the other hand, a widget used to define a UI element respecting Material rules. It defines what elevation is, shape, and stuff. Then reused by many material widgets such as Appbar or Card or FloatingButton.

The yellow underlines you can find in Text is introduced by MaterialApp as a fallback Theme. It is here for debug purpose, to warn you that you need to use Material somewhere above your Text.

In short, use both. You should have a MaterialApp near the root of your app. And then use widgets that introduce a Material instance (Such a Scaffold, Appbar, Dialog, ...) when you want to use Text or InkWell.

Upvotes: 32

Related Questions