Skip to main content

BnCheckbox

Namespace: BlazorNative.Components

A checkbox. Renders as a native CheckBox on Android — and as a UISwitch on iOS, because iOS has no native checkbox.

public class BnCheckbox : Microsoft.AspNetCore.Components.ComponentBase, Microsoft.AspNetCore.Components.IComponent, Microsoft.AspNetCore.Components.IHandleEvent, Microsoft.AspNetCore.Components.IHandleAfterRender

Inheritance ObjectComponentBaseBnCheckbox
Implements IComponent, IHandleEvent, IHandleAfterRender
Attributes NullableContextAttribute, NullableAttribute

Remarks:

That difference is deliberate and worth understanding before you choose between this and BnSwitch: on iOS the two are the same control, so they look identical there and differ only on Android. Both keep the same parameters, the same events and the same layout frames — a custom-drawn iOS checkbox would buy matching pixels at the price of not being native, which is the opposite of the point.

It is a leaf with the platform's own intrinsic size, so you do not give it a width or a height. Use BnView around it to place or pad it.

<BnCheckbox @bind-Checked="_accepted" />

@code {
private bool _accepted;
}

Properties

Checked

Whether the control is on.

public bool Checked { get; set; }

Property Value

Boolean

CheckedChanged

Raised with the new state when the user toggles it — the write-back half of the @bind-Checked pair.

public EventCallback<bool> CheckedChanged { get; set; }

Property Value

EventCallback<Boolean>

Enabled

Set false to show the platform's disabled control and stop it responding. Default true.

public bool Enabled { get; set; }

Property Value

Boolean

BackgroundColor

Background color as a hex string, e.g. "#FFEEAA". Null leaves the view transparent.

public string? BackgroundColor { get; set; }

Property Value

String

Margin

Outside spacing, e.g. "8" — space between this view's box and its siblings. Null = none.

public string? Margin { get; set; }

Property Value

String

AlignSelf

Cross-axis override for this item (alignSelf). Null = auto (inherit the parent's BnView.Align).

public FlexAlign? AlignSelf { get; set; }

Property Value

FlexAlign?

Grow

Share of the free main-axis space this item absorbs (flexGrow) — a UNITLESS number, not a length. Null = 0.

public float? Grow { get; set; }

Property Value

Single?

Shrink

Share of the main-axis overflow this item gives back (flexShrink) — a UNITLESS number. Null = Yoga's default.

public float? Shrink { get; set; }

Property Value

Single?

Basis

Main-axis base size (flexBasis): "auto" | "50%" | "120". Null = auto.

public string? Basis { get; set; }

Property Value

String

Width

Width, e.g. "300" or "50%". Null = auto.

public string? Width { get; set; }

Property Value

String

Height

Height, e.g. "100" or "50%". Null = auto.

public string? Height { get; set; }

Property Value

String

MinWidth

Minimum width. Null = unset.

public string? MinWidth { get; set; }

Property Value

String

MaxWidth

Maximum width. Null = unset.

public string? MaxWidth { get; set; }

Property Value

String

MinHeight

Minimum height. Null = unset.

public string? MinHeight { get; set; }

Property Value

String

MaxHeight

Maximum height. Null = unset.

public string? MaxHeight { get; set; }

Property Value

String

Position

Positioning mode (position). Null = relative (in flow).

public FlexPosition? Position { get; set; }

Property Value

FlexPosition?

Top

Top inset. Null = unset.

public string? Top { get; set; }

Property Value

String

Right inset. Null = unset.

public string? Right { get; set; }

Property Value

String

Bottom

Bottom inset. Null = unset.

public string? Bottom { get; set; }

Property Value

String

Left

Left inset. Null = unset.

public string? Left { get; set; }

Property Value

String

Constructors

BnCheckbox()

public BnCheckbox()