Skip to main content

BnPicker

Namespace: BlazorNative.Components

A drop-down / wheel picker over a list of strings. Renders as a native Spinner on Android and a UIPickerView on iOS.

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

Inheritance Object → ComponentBase → BnPicker
Implements IComponent, IHandleEvent, IHandleAfterRender
Attributes NullableContextAttribute, NullableAttribute

Remarks:

Unlike BnInput — where the text lives in your code and the widget echoes it — a native picker owns its selection UI, so the whole item list is handed to the platform and the selection comes back as an index.

The selection is always valid, and the picker will correct you. With no items the index is -1. With items, it is clamped into range: a negative becomes 0, and an index past the end becomes the last item — because a native picker always shows something, so "nothing selected" is not a state it can represent. When clamping moves the value, SelectedIndexChanged fires with the clamped index, so your bound state re-syncs to what is actually on screen instead of the two quietly disagreeing.

<BnPicker Items="_cities" @bind-SelectedIndex="_city" />

@code {
    private readonly string[] _cities = ["Amsterdam", "Rotterdam", "Utrecht"];
    private int _city;
}

Properties​

Items​

The strings to show. Null or empty means an empty picker. The text is opaque — commas, quotes and non-ASCII are all fine.

public IReadOnlyList<string>? Items { get; set; }

Property Value​

IReadOnlyList<String>

SelectedIndex​

The selected index. It is always clamped to something valid before it reaches the platform: -1 when BnPicker.Items is empty, otherwise into [0, Count-1]. When the clamp moves it, BnPicker.SelectedIndexChanged fires with the clamped value so your bound state matches what is on screen.

public int SelectedIndex { get; set; }

Property Value​

Int32

SelectedIndexChanged​

Raised with the newly selected index when the user picks — the write-back half of the @bind-SelectedIndex pair. It is also raised with the clamped index when a change to BnPicker.Items forces one, so your bound state never drifts from what the picker shows.

public EventCallback<int> SelectedIndexChanged { get; set; }

Property Value​

EventCallback<Int32>

Enabled​

Set false to show the platform's disabled picker 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​

BnPicker()​

public BnPicker()