Skip to content

Latest commit

 

History

History
81 lines (50 loc) · 5.54 KB

button.md

File metadata and controls

81 lines (50 loc) · 5.54 KB
Raw
-api-id -api-type
T:Microsoft.UI.Xaml.Controls.Button
winrt class

Microsoft.UI.Xaml.Controls.Button

-description

Represents a templated button control that interprets a Click user interaction.

-xaml-syntax

<Button .../>
-or-
<Button>
    singleObject
</Button>
-or-
<Button ...>stringContent</Button>

-remarks

Tip

For more info, design guidance, and code examples, see Buttons.

The Button class represents the most basic type of button control. For info on other similar button controls that are more specialized, see HyperlinkButton or RepeatButton.

A standard button

Button interaction

When you tap a Button with a finger or stylus, or press a left mouse button while the pointer is over it, the button raises the Click event. If a button has keyboard focus, pressing the Enter key or the Spacebar key also raises the Click event.

You generally can't handle low-level PointerPressed events on a Button because it has the Click behavior instead. For more info, see Events and routed events overview.

You can change how a button raises the Click event by changing the ClickMode property. The default ClickMode value is Release. If ClickMode is Hover, the Click event can't be raised with the keyboard.

Button content

Button is a ContentControl. Its XAML content property is Content, and this enables a syntax like this for XAML: <Button>A button's content</Button>. For more info about XAML content properties, see XAML overview.

Button derived classes

Button is the parent class for AppBarButton.

Control style and template

You can modify the default Style and ControlTemplate to give the control a unique appearance. For information about modifying a control's style and template, see XAML styles. The default style, template, and resources that define the look of the control are included in the generic.xaml file. For design purposes, generic.xaml is installed with the Windows App SDK NuGet package. By default, this location is \Users\<username>\.nuget\packages\microsoft.windowsappsdk\<version>\lib\uap10.0\Microsoft.UI\Themes\generic.xaml. Styles and resources from different versions of the SDK might have different values.

XAML also includes resources that you can use to modify the colors of a control in different visual states without modifying the control template. Modifying these resources is preferred to setting properties such as Background and Foreground. For more info, see the Light-weight styling section of the XAML styles article.

-examples

Tip

For more info, design guidance, and code examples, see Button.

[!div class="nextstepaction"] Open the WinUI 3 Gallery app and see the Button in action

The WinUI 3 Gallery app includes interactive examples of most WinUI 3 controls, features, and functionality. Get the app from the Microsoft Store or get the source code on GitHub

The following example shows three buttons that respond to clicks in three different ways based on their ClickMode property value.

  • Hover - When the mouse pointer hovers over the first button, the foreground color of the button changes.
  • Press - When the left mouse button is pressed over the second button, the foreground color of the button changes.
  • Release - When the mouse button is pressed and released when over the third button, the button resets the foreground color of the other two buttons to their original color.

[!code-xaml1]

[!code-csharp11]

-see-also

Buttons overview, AppBarButton, CheckBox, HyperlinkButton, RepeatButton, RadioButton, ToggleSwitch