Buttons

Styles

A Button can have several different styles:

• PrimaryLarge
• PrimarySmall
• PrimaryRoundedSmall
• PrimaryRoundedLarge
• SecondaryLarge
• SecondarySmall
• SecondaryRoundedSmall
• SecondaryRoundedLarge
• GhostLarge
• GhostSmall
• GhostRoundedLarge
• GhostRoundedSmall

By default the Button's style is set to PrimaryLarge.

There is also the possibility to set a Button's Image to the right side by setting the ImagePlacement property to Right.

Usage

In the following example a Button's style is set to SecondaryLarge:

<dui:Button Style="{dui:Styles Button=SecondaryLarge}"          
            Text="Button"
            Command="{Binding Something}" />

In the following example a Button's Image is set to the right side of the Button's text. Also the Button's style is implicitly set to PrimaryLarge.

<dui:Button ImageSource="{dui:Icons bell_line}"
            ImagePlacement="Right"
            Text="Button"
            Command="{Binding Something}" />

Properties

Inspect the components properties class to further customize and use it.