Skip to main content

SimpleButton Class

This is a legacy button control. We recommend that you use DXButton instead.

Namespace: DevExpress.Maui.Controls

Assembly: DevExpress.Maui.Controls.dll

NuGet Package: DevExpress.Maui.Controls

Declaration

[ContentProperty("Content")]
public class SimpleButton :
    View,
    IButtonController,
    IViewController,
    IVisualElementController,
    IElementController,
    IDXViewController,
    IAppearanceOwner,
    IVisualTreeElement

Remarks

SimpleButton performs the assigned action when a user taps it. The control can display a caption string (Text), an icon (Icon), or both.

DevExpress MAUI SimpleButton - Captions

Use the following events to define how the button should respond to taps:

  • Pressed - Occurs when a user presses the button.

  • Released - Occurs when a user releases the button.

  • Clicked - Occurs when a user taps the button and then releases it. This event is fired right after the Released event, but if the user slides their finger away from the button before releasing it, the Clicked event does not occur.

Visual States and Appearance

The button has a different appearance in each state and provides the following properties to customize colors:

Button

Properties

Default
DevExpress MAUI SimpleButton - Unfocused State

BorderColor
BackgroundColor
TextColor
IconColor

Pressed (IsPressed)
DevExpress MAUI SimpleButton - Pressed State

PressedBorderColor
PressedBackgroundColor
PressedTextColor
PressedIconColor

Disabled
DevExpress MAUI SimpleButton - Disabled State

DisabledBorderColor
DisabledBackgroundColor
DisabledTextColor
DisabledIconColor

You can also adjust the following appearance settings for all button states:

Property

Description

BorderThickness

Gets or sets the thickness of the button borders. This is a bindable property.

CornerMode

Gets or sets whether button corners are rounded or cut. This is a bindable property.

CornerRadius

Specifies the radius of the button corners.

FontFamily
FontSize
FontAttributes

Configure the font settings.

IconIndent
IconHorizontalPosition

Specify the icon position relative to the button caption.

Padding

Gets or sets the distance between the button caption and borders. This is a bindable property.

ShowShadow

Gets or sets the button shadow visibility. This is a bindable property.

UseRippleEffect

Gets or sets whether the SimpleButton uses the ripple animation effect. This is a bindable property.

Content

Gets or sets the custom content of the button.

The following images show buttons with the corner radius set to 15:

CornerMode = Round
 

DevExpress MAUI SimpleButton - Corners Round

CornerMode = Cut
 

DevExpress MAUI SimpleButton - Corners Cut

Example

This example shows how to customize button appearance and handle the button click event.

Button State

Default Appearance

Custom Appearance

Default

DevExpress MAUI SimpleButton - Unfocused State

DevExpress MAUI SimpleButton - Unfocused State Example

Pressed

DevExpress MAUI SimpleButton - Pressed State

DevExpress MAUI SimpleButton - Pressed State Example

Disabled

DevExpress MAUI SimpleButton - Disabled State

DevExpress MAUI SimpleButton - Disabled State Example

  1. Add the delete.png icon file to the Resources/Images folder.

  2. Use the following properties to adjust the button’s appearance and handle the Clicked event to clear label1 on button tap:

    <dxco:SimpleButton Text = "Clear" 
                       Icon = "delete" 
                       BorderThickness="2"
                       BorderColor="Black"
                       PressedBorderColor="DarkOrange"
                       DisabledBorderColor="DarkGray"
                       TextColor="Black"
                       PressedTextColor="White"
                       DisabledTextColor="DarkGray"
                       IconColor="Black"
                       PressedIconColor="White"
                       DisabledIconColor="DarkGray"
                       BackgroundColor="Beige"
                       DisabledBackgroundColor="Brown"
                       PressedBackgroundColor="Gray"
                       CornerMode = "Round"        
                       CornerRadius="10"
                       Clicked = "SimpleButton_Clicked"/>
    
    private void SimpleButton_Clicked(object sender, EventArgs e) {
        label1.Text = "";
    }
    

The following featured scenarios show how you can use the SimpleButton class:

Expandable Cards with Lists Expandable Cards with Lists Featured Scenario

Cards with Custom Content Cards with Custom Content Featured Scenario

Context Menu Actions in Popup Featured Scenario

Master-Detail View with BottomSheet Control Bottom Sheet Featured Scenario

Infinite Collection View Scrolling Infinite Collection View Scrolling Featured Scenario

Display Filtering UI Elements in a BottomSheet Filtering UI Elements in BottomSheet Featured Scenario

See Also