Elements

HorizontalGroup

A container element that arranges its children horizontally in a row. Extends Group functionality with horizontal layout and reverse capabilities.

Constructor

new HorizontalGroup(child1, child2, child3);
new HorizontalGroup(); // Empty horizontal group

Examples

Button Layouts

Common horizontal layout patterns for UI controls:

// Action buttons
new HorizontalGroup(
    new Button(new Label("Cancel")),
    new Button(new Label("Save"))
)
.JustifyContent(Justify.FlexEnd);

// Icon and text combinations
new HorizontalGroup(
    new Image("Icons/user"),
    new Label().BindText(ViewModel.Username)
)
.AlignItems(Align.Center);

Form Layouts

Horizontal arrangements for form elements:

// Input with validation icon
new HorizontalGroup(
    new TextField(ViewModel.Email).Flex(1),
    new Image("Icons/check").BindVisible(ViewModel.IsEmailValid)
);

// Label and input pairs
new HorizontalGroup(
    new Label("Name:").ClassName("form-label"),
    new TextField(ViewModel.Name).Flex(1)
);

Dynamic Content

Reactive horizontal layouts based on ViewModel:

// Conditional reverse layout
new HorizontalGroup(
    new Label("Primary"),
    new Label("Secondary")
)
.BindReverse(ViewModel.IsRightToLeft);

// Dynamic child rendering
new HorizontalGroup()
    .BindChildren(
        ViewModel.ActionItems,
        item => new Button(new Label(item.Name))
            .OnClick(_ => ViewModel.ExecuteAction(item))
    );

Properties

PropTypeDefault
children?
IElement[]
[]
reverse?
bool
false
disabled?
bool
false
visible?
bool
true
name?
string
""
pickingMode?
PickingMode
PickingMode.Position

Methods

PropTypeDefault
Reverse?
(bool = true) => HorizontalGroup
-
GetReverse?
() => bool
-
BindReverse?
(Observable<bool>) => HorizontalGroup
-
Flex?
(int flexGrow, int flexShrink = 0) => HorizontalGroup
-
JustifyContent?
(Justify) => HorizontalGroup
-
AlignItems?
(Align) => HorizontalGroup
-
BindChildren?
<TChild>(Observable<TChild[]>, Func<TChild, IElement>) => HorizontalGroup
-
Disabled?
(bool = true) => HorizontalGroup
-
GetDisabled?
() => bool
-
BindDisabled?
(Observable<bool>) => HorizontalGroup
-
Visible?
(bool) => HorizontalGroup
-
GetVisible?
() => bool
-
BindVisible?
(Observable<bool>) => HorizontalGroup
-
ClassName?
(string, bool = true) => HorizontalGroup
-
BindClassName?
(string, Observable<bool>) => HorizontalGroup
-
StyleSheet?
(StyleSheet) => HorizontalGroup or (string) => HorizontalGroup
-

HorizontalGroup extends Group which extends BaseElement.