ToolBar Example
<MudPaper Elevation="25"> <MudToolBar> <MudIconButton Icon="@Icons.Material.Outlined.Menu" Color="Color.Inherit" Class="mr-5" /> <MudIconButton Icon="@Icons.Material.Outlined.Add" /> <MudIconButton Icon="@Icons.Material.Outlined.Edit" /> <MudIconButton Icon="@Icons.Material.Outlined.Remove" Color="Color.Inherit" /> <MudIconButton Icon="@Icons.Material.Outlined.Settings" Color="Color.Inherit" /> <MudSpacer /> <MudIconButton Icon="@Icons.Material.Outlined.Notifications" /> <MudIconButton Icon="@Icons.Material.Outlined.PushPin" /> <MudIconButton Icon="@Icons.Material.Outlined.PeopleAlt" /> <MudIconButton Icon="@Icons.Material.Outlined.MoreVert" Color="Color.Inherit" /> </MudToolBar> </MudPaper>
ToolBar Wrap Content Example
The MudToolBar component provides a flexible and versatile layout for organizing content. By setting the WrapContent property to true, the ToolBar is granted the ability to wrap its content based on the available space. This means that if the content within the ToolBar exceeds the width of the container, it will automatically wrap onto the next line to ensure optimal display and prevent overflow. Enabling WrapContent offers a responsive behavior, allowing the ToolBar to adapt dynamically to different screen sizes and ensure that all content remains visible and accessible to the user.
<MudPaper Elevation="25" MaxWidth="250px"> <MudToolBar WrapContent="true"> <MudIconButton Icon="@Icons.Material.Outlined.Menu" Color="Color.Inherit" Class="mr-5" /> <MudIconButton Icon="@Icons.Material.Outlined.Add" /> <MudIconButton Icon="@Icons.Material.Outlined.Edit" /> <MudIconButton Icon="@Icons.Material.Outlined.Remove" Color="Color.Inherit" /> <MudIconButton Icon="@Icons.Material.Outlined.Settings" Color="Color.Inherit" /> <MudIconButton Icon="@Icons.Material.Outlined.Notifications" /> <MudIconButton Icon="@Icons.Material.Outlined.PushPin" /> <MudIconButton Icon="@Icons.Material.Outlined.PeopleAlt" /> <MudIconButton Icon="@Icons.Material.Outlined.MoreVert" Color="Color.Inherit" /> </MudToolBar> </MudPaper>