BnSlider
Namespace: BlazorNative.Components
A slider for picking a number from a range. Renders as a native
SeekBar on Android and as BnSliderView on iOS, a
UISlider subclass.
public class BnSlider : BnLayoutItem, Microsoft.AspNetCore.Components.IComponent, Microsoft.AspNetCore.Components.IHandleEvent, Microsoft.AspNetCore.Components.IHandleAfterRender, BlazorNative.Core.IForwardsUiEvent
Inheritance Object → ComponentBase → BnLayoutItem → BnSlider
Implements IComponent, IHandleEvent, IHandleAfterRender, IForwardsUiEvent
Remarks:
The range is declared, not inherited: Min defaults to 0 and
Max to 100, and both always travel to the platform, so the two
never disagree about what the track means. Step is optional — leave it
unset for a continuous slider.
Its intrinsic height is the platform's, but its natural width is not something you should rely on: give it a Width (or let a flex parent size it) whenever the exact width matters.
<BnSlider @bind-Value="_volume" Min="0" Max="100" Step="5" Width="240" />
@code {
private float _volume = 25f;
}
Properties
Value
The current value, between BnSlider.Min and BnSlider.Max.
public float Value { get; set; }
Property Value
ValueChanged
Raised with the new value as the user drags — the write-back
half of the @bind-Value pair.
public EventCallback<float> ValueChanged { get; set; }
Property Value
Min
Lower bound of the range. Default 0.
public float Min { get; set; }
Property Value
Max
Upper bound of the range. Default 100.
public float Max { get; set; }
Property Value
Step
Snap increment — the value moves in multiples of this. Null = continuous.
public float? Step { get; set; }
Property Value
Enabled
Set false to show the platform's disabled slider and stop it responding. Default true.
public bool Enabled { get; set; }
Property Value
BackgroundColor
Fill colour behind the component. Null leaves it transparent.
public string? BackgroundColor { get; set; }
Property Value
Margin
Space outside the component, between it and its siblings. Null = none.
public BnAutoLength? Margin { get; set; }
Property Value
Remarks:
auto is legal here and absorbs free space, which re-centres the node.
AlignSelf
Cross-axis alignment for this item alone, overriding the parent's. Null = inherit.
public FlexAlign? AlignSelf { get; set; }
Property Value
Grow
Share of leftover space this item takes (unitless ratio). Null = Yoga's default (0).
public float? Grow { get; set; }
Property Value
Shrink
Share of overflow this item gives up (unitless ratio). Null = Yoga's default (1).
public float? Shrink { get; set; }
Property Value
Basis
Starting main-axis size before grow/shrink. Null = auto.
public BnAutoLength? Basis { get; set; }
Property Value
Width
Box width. Null = auto.
public BnAutoLength? Width { get; set; }
Property Value
Height
Box height. Null = auto.
public BnAutoLength? Height { get; set; }
Property Value
MinWidth
Lower bound on width. Null = unset.
public BnLength? MinWidth { get; set; }
Property Value
MaxWidth
Upper bound on width. Null = unset.
public BnLength? MaxWidth { get; set; }
Property Value
MinHeight
Lower bound on height. Null = unset.
public BnLength? MinHeight { get; set; }
Property Value
MaxHeight
Upper bound on height. Null = unset.
public BnLength? MaxHeight { get; set; }
Property Value
Position
Positioning scheme. Null = Yoga's default (relative).
public FlexPosition? Position { get; set; }
Property Value
Top
Top inset. Null = unset.
public BnLength? Top { get; set; }
Property Value
Right
Right inset. Null = unset.
public BnLength? Right { get; set; }
Property Value
Bottom
Bottom inset. Null = unset.
public BnLength? Bottom { get; set; }
Property Value
Left
Left inset. Null = unset.
public BnLength? Left { get; set; }
Property Value
Constructors
BnSlider()
public BnSlider()