Updated 27 April 2023
Material 3 in Flutter is the latest version. It is also known as ‘Material You’.
By default, every flutter app used Material 2 within it. Currently, Material 3 is not completely stable.
You may also check our interactive app designs by our Flutter app development company
In order to use Material 3 within the app, we need to do add-on some code. So, let’s check it out.
1 2 3 4 5 6 7 |
MaterialApp( debugShowCheckedModeBanner: false, theme: ThemeData( useMaterial3: true ), home: const MyHomePage(title: 'Material 3'), ); |
With the help of the “useMaterial3″ property, we can use Material 3 in our Flutter Application.
So, here we can see the clear difference in the UI Design of the app before using Material 3 and after using Material 3.
There are many widgets that have been modified in Material 3:-
So, we will be covering some widgets in this blog
Starting with Chip Widget, in this widget, there is a modification in the shape and the dynamic color compatibility.
Material 2 provides a Rounded Shape Chip whereas Material 3 provides a Round Rectangular Shape chip.
Material 3 provides us with the selected icon automatically on the selected chip. We can modify it as well.
Next, let’s check out Floating Action Button(FAB)
In Material 2, FAB is represented by default as a circular button whereas in Material 3 it is represented in a boxier style with small rounded corners.
Material 3, also provides an option to create a bigger size FAB.
In this blog, we have discussed how can we add-on Material 3 to Flutter Application.
I hope it will help you out in understanding.
You may also visit our blog on Material Design Theme Style in Android – https://mobikul.com/material-design-theme-style/
Thanks for reading!!
If you have more details or questions, you can reply to the received confirmation email.
Back to Home
Be the first to comment.