A Material Design 3 Outlined Card Implementation
--
While I am finishing my mobile flutter UI kit, let me show you how to implement the new Material Design 3 Outlined Card.
Hybrid versus Complex widgets
As of material design 3, complex widgets changed to the term hybrid widgets. It’s still the meaning that we have a widget container that has multiple UI elements in it that act as content UI unit.
The tricks are that it requires using some specific APIs to create visually stunning things. I am of course referring to other layout APIs such as the CustomSingleChildLayout and CustomMultiChildlayout classes:
The Boxy package allows us an easier way to access those APIs and get more power to implement stunning hybrid widgets. I am going to use the MD3 card examples to show you how easy it is.
The Outlined Card Implementation
Now, even though I have soft-forked Ball, and Surface; I am still using the same API calls:
Ball:
Surface:
And to get easier access and more power to Single and Multiple Child Layout stuff I use Boxy