Material 3 in Flutter

Save

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.

In order to use Material 3 within the app, we need to do add-on some code. So, let’s check it out.

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.

Before Using Material 3
After Using Material 3

List Of Widgets Modified in 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.

Material 2 Chip Widget
Material 3 Chip Widget

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.

Material 2 FAB
Material 3 FAB

Conclusion

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.

Thanks for reading!!

References

https://docs.flutter.dev/development/ui/material3-updates

. . .

Leave a Comment

Your email address will not be published. Required fields are marked*


Be the first to comment.

css.php

Webkul is a truly trusted and supported IT Company to develop business ideas for e-commerce. They provide professional support after deploying the solution to production and be responsible to act for fixing the reported issues or system errors. We highly encourage to deal with Webkul for business development.

Hussein Zawia

Hussein Zawia

Co-founder, 24Dokan

Talk to Sales

Global

Live Chat
Start a Project


    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home