The new variant brings a number of alterations to interactive elements of the OS. The biggest of which may be a difference in the location of the floating action button (FAB). Previously situated as a UI element above the bottom bar, that now appears within the bottom bar itself. Precisely at the bottom right-hand side of the UI. The FAB was also previously given a shadow to provide the appearance of floating. That’s gone now as well. Instead, it’s a part of the bottom bar UI, resulting in a slightly taller bottom bar, to begin with.
What else is new in Material 3 documentation from Google?
Additionally, Google has added new buttons for use in the UI for Material Design 3 for Android. Those are outlined fillable icons and new circular icons. Both of those fill in when selected. Another change to these types of icons is that they won’t show the button name anymore when hovered over or long-pressed. At the very least, not for every button. Instead, Google is suggesting that developers provide a “tooltip” describing what the button does when pressed. A new design for segmented buttons is in place too. As shown below. Now, buttons that are segmented on a single bar won’t just be highlighted when selected. They’ll also showcase a checkmark to better clarify what’s been chosen by users. Moreover, the segmented UI is rounded now. In previous versions of Material Design, the button was square-shaped instead. A similar change is being made to simple toggle switches, which now show a checkmark when activated. And those are taller as well while taking up less horizontal space. With the “switch” portion of the UI now fully encased in its slider. As opposed to extending outside of that.
