ToolbarToggleButton Class

A button within a DXToolbar that has two states: checked and unchecked. You can group several ToolbarToggleButtons to implement exclusive selection.

Namespace : DevExpress.Maui.Controls

Assembly : DevExpress.Maui.Controls.dll

NuGet Package : DevExpress.Maui.Controls

Declaration

[DXLicenseMAUI]
public class ToolbarToggleButton :
    ToolbarButton,
    DXCheckGroupConnector.IDXCheckGroupConnectorOwner

Remarks

Add ToolbarToggleButton to DXToolbar

The following code sample displays a ToolbarToggleButton within the DXToolbar control:

• XAML

<ContentPage ...
    xmlns:dxc="clr-namespace:DevExpress.Maui.Controls;assembly=DevExpress.Maui.Controls">
    <Grid>
        <dxc:DXToolbar>
            <!-- ... -->
            <dxc:ToolbarToggleButton Content="Bookmark" Icon="bookmark"/>
        </dxc:DXToolbar>
    </Grid>
</ContentPage>

Group ToggleToolbarButtons

You can group several ToolbarToggleButtons to implement exclusive selection. In this case, selecting one ToolbarToggleButton deselects other ToolbarToggleButton in this group.

Specify the same GroupName property value for all ToolbarToggleButtons within the group. The following code sample displays the Layout group of ToolbarToggleButton with exclusive selection:

• XAML

<ContentPage ...
    xmlns:dxc="clr-namespace:DevExpress.Maui.Controls;assembly=DevExpress.Maui.Controls">
    <Grid>
        <dxc:DXToolbar>
            <!-- ... -->
            <dxc:ToolbarToggleButton x:Name="OnePage" GroupName="Layout" Icon="onepage" IsChecked="true" />
            <dxc:ToolbarToggleButton x:Name="TitlePage" GroupName="Layout" Icon="titlepage" />
            <dxc:ToolbarToggleButton x:Name="TwoPages" GroupName="Layout" Icon="twopages"/>
        </dxc:DXToolbar>
    </Grid>
</ContentPage>

Use the AllowUncheckInGroup to specify whether ToolbarToggleButtons within a group can be unchecked.

Handle Taps and Check Items

You can use the following events to handle a ToolbarToggleButton tap:

When the item is checked, you can use the Checked*Color properties to customize the colors of button elements (text, background, icon, and more).

You can also use the Command property to specify a command that is invoked when a user taps a ToolbarToggleButton. You can define the CommandParameter property to specify a command’s parameter.

• XAML

<ContentPage ...
    xmlns:dxc="clr-namespace:DevExpress.Maui.Controls;assembly=DevExpress.Maui.Controls">
    <Grid>
        <dxc:DXToolbar>
            <!-- ... -->
            <dxc:DXToolbar>
                <dxc:ToolbarToggleButton x:Name="bookmarkbutton" Content="Bookmark" Icon="bookmark" Command="{Binding TapButtonCommand}"
                                            CommandParameter="{Binding ButtonType, Source={x:Reference bookmarkbutton}}"/>
            </dxc:DXToolbar>
        </dxc:DXToolbar>
    </Grid>
</ContentPage>

You can customize button appearance in pressed state. Use Pressed*Color properties to specify colors for various button elements (text, background, icon, and more).

Button Types

The ToolbarToggleButton class includes the ButtonType property. The list below contains the available button types and corresponding button appearances in different states:

ToolButton (default)

Accent

Filled

Outlined

Text

Button Availability

Use the IsEnabled property to specify whether the ToolbarToggleButton is enabled. You can customize button appearance in disabled state. Use the Disabled*Color property to change the colors of button elements (text, background, icon, and more).

Handle Loading

You can use the following inherited member to handle the ToolbarToggleButton loading:

Customize Appearance

You can use the following properties to customize common ToolbarToggleButton appearance settings:

Size and Alignment

You can use the following properties to customize common ToolbarToggleButton size and alignment settings:

Background Color

You can use the following properties to change the background color for a ToolbarToggleButton :

Border

You can use the following properties to customize the border for a ToolbarToggleButton :

Icon

You can use the following properties to display and customize an icon within a ToolbarToggleButton :

Text and Font Settings

You can use the following properties to display and customize font settings for a ToolbarToggleButton :

Customize Animation

The ToolbarToggleButton displays the animation when you tap it. You can use the following properties to customize this animation:

Implements

INotifyPropertyChanged

IElementController

Inheritance

System.Object BindableObject Element DevExpress.Maui.Core.Internal.DXElementBaseCore DXElementBase ToolbarElementBase ToolbarItemBase ToolbarContentItemBase ToolbarButton ToolbarToggleButton

Extension Methods

Yield<ToolbarToggleButton>()

YieldIfNotNull<ToolbarToggleButton>()

See Also

ToolbarToggleButton Members

Items

DevExpress.Maui.Controls Namespace