Navigation drawers let people switch between UI views on larger devices and follow Material Design Guidelines. See more.
Namespace: HorusStudio.Maui.MaterialDesignControls
Inherits from: MaterialNavigationDrawer → ContentView
xmlns:material="clr-namespace:HorusStudio.Maui.MaterialDesignControls;assembly=HorusStudio.Maui.MaterialDesignControls"
<material:MaterialNavigationDrawer
Headline="Mail"
Command="{Binding TestCommand}"
ItemsSource="{Binding Items}" />var navigationDrawer = new MaterialNavigationDrawer
{
Headline="Mail"
Command = TestCommand,
ItemsSource = Items
};Defines the active background color. This is a bindable property.
Property type: Color
Default value: Light: MaterialLightTheme.PrimaryContainer - Dark: MaterialDarkTheme.PrimaryContainer
Defines the active indicator corner radius. This is a bindable property.
Property type: Single
Default value: 28.0f
Defines the active indicator label color. This is a bindable property.
Property type: Color
Default value: Light: MaterialLightTheme.OnPrimaryContainer - Dark: MaterialDarkTheme.OnPrimaryContainer
Gets or sets the background color for the badge. This is a bindable property.
Property type: Color
Default value: Light: Colors.Transparent - Dark: Colors.Transparent
Gets or sets the font family for the badge label. This is a bindable property.
Property type: String
Default value: MaterialFontFamily.Default
Gets or sets font size for the badge label. This is a bindable property.
Property type: Double
Default value: MaterialFontSize.LabelLarge
Gets or sets the text color for the badge. This is a bindable property.
Property type: Color
Default value: Light: MaterialLightTheme.OnSurfaceVariant - Dark: MaterialDarkTheme.OnSurfaceVariant
Gets or sets the Badge type. This is a bindable property.
Property type: MaterialBadgeType
| Name | Value | Description |
|---|---|---|
| Small | 0 | Small Badge |
| Large | 1 | Large Badge |
Gets or sets the command for each item. This is a bindable property.
Property type: ICommand
Default value: null
Gets or sets the text color for the label when is disabled. This is a bindable property.
Property type: Color
Default value: Light: MaterialLightTheme.Disable - Dark: MaterialDarkTheme.Disable
Gets or sets the color for the divider. This is a bindable property.
Property type: Color
Default value: Light: MaterialLightTheme.OutlineVariant - Dark: MaterialDarkTheme.OutlineVariant
Gets or sets if dividers are visible between sections, items or not visible. This is a bindable property.
Property type: MaterialNavigationDrawerDividerType
Default value: Dividers between sections: NavigationDrawerDividerType.Section
Gets or sets the spacing between characters of the headline. This is a bindable property.
Property type: Double
Default value: MaterialFontTracking.TitleSmall
Gets or sets the text style of the label. This is a bindable property.
Property type: FontAttributes
Default value: null
Defines whether an app's UI reflects text scaling preferences set in the operating system.
Property type: Boolean
Default value: true
Gets or sets the font family for the headline. This is a bindable property.
Property type: String
Default value: MaterialFontFamily.Default
Defines the font size of the label. This is a bindable property.
Property type: Double
Default value: MaterialFontSize.TitleSmall
Gets or sets the margin of the headline label. This is a bindable property.
Property type: Thickness
Default value: Thickness(4, 16)
Gets or sets the color for the text of the headline. This is a bindable property.
Property type: Color
Default value: Light: MaterialLightTheme.Primary - Dark: MaterialDarkTheme.Primary
Defines the casing of the label. This is a bindable property.
Property type: TextTransform
Default value: TextTransform.Default
Gets or sets the icon size for the leading and trailing icons. This is a bindable property.
Property type: Double
Default value: 24
Gets or sets the height for each item. This is a bindable property.
Property type: Double
Default value: 56.0
Gets or sets the items' source. This is a bindable property.
Property type: IEnumerable<MaterialNavigationDrawerItem>
Gets or sets the item template for each item from ItemsSource. This is a bindable property.
Property type: DataTemplate
Default value: null
Gets or sets the spacing between characters of each item label. This is a bindable property.
Property type: Double
Default value: MaterialFontTracking.LabelLarge
Gets or sets the text color for each item. This is a bindable property.
Property type: Color
Default value: Light: MaterialLightTheme.Text - Dark: MaterialDarkTheme.Text
Gets or sets the text style of each item. This is a bindable property.
Property type: FontAttributes
Default value: null
Defines whether an app's UI reflects text scaling preferences set in the operating system.
Property type: Boolean
Default value: true
Gets or sets the font family for each item. This is a bindable property.
Property type: String
Default value: MaterialFontFamily.Default
Gets or sets the font size for each item. This is a bindable property.
Property type: Double
Default value: MaterialFontSize.LabelLarge / Tablet: 14 - Phone: 11
Defines the casing of the label of each item. This is a bindable property.
Property type: TextTransform
Default value: TextTransform.Default
Gets or sets the section template. This is a bindable property.
Property type: DataTemplate
Default value: null
Gets or sets a custom animation to be executed when an icon is clicked. This is a bindable property.
Property type: ITouchAnimation
Default value: null
Gets or sets an animation to be executed when an icon is clicked. This is a bindable property.
Property type: TouchAnimationTypes
| Name | Value | Description |
|---|---|---|
| None | 0 | None: no animation runs. |
| Fade | 1 | Fade: Represents an animation that simulates a "fade" effect by changing the opacity over the target element. |
| Scale | 2 | Scale: Represents an animation that simulates a "sink" or "sunken" effect by scaling the target element. |
| Bounce | 3 | Bounce: Represents an animation that simulates a "sink" or "sunken" effect with a "bounce" effect when the user releases the target element. |
Default value: TouchAnimationTypes.Fade