Skip to content

horusstudio.maui.materialdesigncontrols.materialbadge.md

Latest commit

 

History

History
150 lines (86 loc) · 3.94 KB

horusstudio.maui.materialdesigncontrols.materialbadge.md

File metadata and controls

150 lines (86 loc) · 3.94 KB

MaterialBadge

Badges show notifications, counts, or status information on navigation items and icons and follow Material Design Guidelines. See more.

Namespace: HorusStudio.Maui.MaterialDesignControls

Inherits from: MaterialBadge → ContentView


XAML sample

xmlns:material="clr-namespace:HorusStudio.Maui.MaterialDesignControls;assembly=HorusStudio.Maui.MaterialDesignControls"

<material:MaterialBadge
       Type="MaterialBadgeType.Large"
       Text="999+"/>

C# sample

var badgeSmall = new MaterialBadge()
{
    Type = MaterialBadgeType.Large, 
    Text = "999+"
};

See more example

Properties

AutomationId

Gets or sets a value that allows the automation framework to find and interact with this element.

Property type: String

Remarks: This value may only be set once on an element.


BackgroundColor

Gets or sets a color that describes the background color of the badge. This is a bindable property.

Property type: Color

Default value: Light: MaterialLightTheme.Error - Dark: MaterialDarkTheme.Error


CornerRadius

Gets or sets the corner radius for the Badge, in device-independent units. This is a bindable property.

Property type: CornerRadius

Default value: 8


FontFamily

Gets or sets the font family for the text of this badge. This is a bindable property.

Property type: String

Default value: MaterialFontFamily.Default


FontSize

Gets or sets the size of the font for the text of this badge. This is a bindable property.

Property type: Double

Default value: MaterialFontSize.LabelSmall / Tablet: 14 - Phone: 11

Remarks: The font size may be affected by the following cases:

  • Badge type is small, the font size not change.

  • Badge type is Large, the font is changed.


Padding

Gets or sets the padding for the Badge. This is a bindable property.

Property type: Thickness

Default value: 16,0


Text

Gets or sets the text displayed as the content of the badge. This is a bindable property.

Property type: String

Default value: string.Empty


TextColor

Gets or sets the color for the text of the Badge. This is a bindable property.

Property type: Color

Default value: Light: MaterialLightTheme.OnError - Dark: MaterialDarkTheme.OnError

Remarks: The text color may be affected by the following cases:

  • Badge type is small, the text color is not defined.

  • Badge type is Large, the text color is defined.


Type

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

Default value: MaterialBadgeType.Large