Button

A clickable button element that can contain child elements. Extends Group functionality.

Constructor

new Button(new Label("Click me"));
new Button(new Image(texture), new Label("Icon Button"));

Examples

Click Event Handling

Buttons handle click events by calling methods on your ViewModel:

new Button(new Label("Save"))
    .OnClick(_ => ViewModel.SaveDocument());

new Button(new Label("Delete"))
    .OnClick(_ => ViewModel.DeleteItem())
    .BindDisabled(ViewModel.IsDeleting);

Reactive Content

Button content can be bound to ViewModel properties:

// Button text bound to ViewModel
new Button(new Label().BindText(ViewModel.ButtonText));

// Icon + Text with reactive visibility
new Button(
    new Image("Icons/download").BindVisible(ViewModel.ShowIcon),
    new Label().BindText(ViewModel.ButtonLabel)
);

// Loading state example
new Button(
    new HorizontalGroup(
        new Loader().BindVisible(ViewModel.IsLoading),
        new Label().BindText(ViewModel.IsLoading.Select(loading => 
            loading ? "Saving..." : "Save"))
    )
).BindDisabled(ViewModel.IsLoading);

State Management

Buttons can reactively respond to ViewModel state:

new Button(new Label("Submit"))
    .ClassName("primary-button")
    .BindDisabled(ViewModel.IsSubmitting)
    .BindVisible(ViewModel.CanSubmit)
    .BindClassName("loading", ViewModel.IsSubmitting)
    .OnClick(_ => ViewModel.SubmitForm());

Properties

Prop	Type	Default
`children?`	`IElement[]`	`[]`
`disabled?`	`bool`	`false`
`visible?`	`bool`	`true`
`name?`	`string`	`""`
`pickingMode?`	`PickingMode`	`PickingMode.Position`

Methods

Prop	Type	Default
`OnClick?`	`(EventCallback<ClickEvent>) => Button`	-
`Disabled?`	`(bool = true) => Button`	-
`GetDisabled?`	`() => bool`	-
`BindDisabled?`	`(Observable<bool>) => Button`	-
`Visible?`	`(bool) => Button`	-
`GetVisible?`	`() => bool`	-
`BindVisible?`	`(Observable<bool>) => Button`	-
`ClassName?`	`(string, bool = true) => Button`	-
`BindClassName?`	`(string, Observable<bool>) => Button`	-
`StyleSheet?`	`(StyleSheet) => Button or (string) => Button`	-
`Flex?`	`(int flexGrow, int flexShrink = 0) => Button`	-
`JustifyContent?`	`(Justify) => Button`	-
`AlignItems?`	`(Align) => Button`	-
`BindChildren?`	`<TChild>(Observable<TChild[]>, Func<TChild, IElement>) => Button`	-

Button extends Group which extends BaseElement.