AppBar
The FluentAppBar component is an implementation of the AppBar as you know from the Teams application
Examples
Default
Download:
Smaller icons
Download:
From list of apps
Example of using the AppBar with a list of apps
It also shows how to create a derived AppBarItem class that adds an Order property to explicitly set a custom order
Download:
With OnClick event
Download:
Documentation
FluentAppBar Class
Parameters
Name | Type | Default | Description |
|---|---|---|---|
AppsOverflow | IEnumerable<IAppBarItem> | Gets all app items with IAppBarItem.Overflow assigned to True. | |
ChildContent | RenderFragment? | Gets or sets the content to display (the app bar items, FluentAppBarItem). | |
Items | IEnumerable<IAppBarItem>? | Gets or sets the collections of app bar items. Use eiter this or ChildContent to define the content of the app bar. | |
Orientation | Orientation | Vertical | Gets or sets the Orientation of the app bar. |
PopoverShowSearch | bool | True | Gets or sets if the popover shows the search box. |
EventCallbacks
Name | Type | Description |
|---|---|---|
PopoverVisibilityChanged | EventCallback<bool> | Event to be called when the visibility of the popover changes. |
Methods
Name | Parameters | Type | Description |
|---|---|---|---|
OverflowRaisedAsync | string value | Task |
FluentAppBarItem Class
Parameters
Name | Type | Default | Description |
|---|---|---|---|
ChildContent | RenderFragment? | Gets or sets the content to be shown. | |
Count | int? | 0 | Gets or sets the count to show on the item with a FluentCounterBadge. |
Href | string? | Gets or sets the URL for this item. | |
IconActive | Icon? | Gets or sets the Icon to use when the item is hovered/selected/active. | |
IconRest | Icon | Gets or sets the Icon to use when the item is not hovered/selected/active. | |
Match | NavLinkMatch | Prefix | Gets or sets how the link should be matched. Defaults to Microsoft.AspNetCore.Components.Routing.NavLinkMatch.Prefix. |
Overflow | bool? | If this app is outside of visible app bar area. | |
Text | string | Gets or sets the text to show under the icon. | |
Tooltip | string? | Gets or sets the tooltip to show when the item is hovered. |
EventCallbacks
Name | Type | Description |
|---|---|---|
OnClick | EventCallback<IAppBarItem> | The callback to invoke when the item is clicked. |