Skip to main content

BnLayoutContainer

Namespace: BlazorNative.Components

A BnLayoutItem that also arranges its children with flexbox — padding inside its own box, and the main/cross-axis rules its children obey.

public abstract class BnLayoutContainer : BnLayoutItem, Microsoft.AspNetCore.Components.IComponent, Microsoft.AspNetCore.Components.IHandleEvent, Microsoft.AspNetCore.Components.IHandleAfterRender

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

Remarks:

Only components that lay out children with flexbox derive from this type: BnView and BnFlexPreset. BnScroll deliberately does not — it has children but no flex parameters of its own, so it is a plain BnLayoutItem.

ChildContent is not declared here. Having children and arranging them with flexbox are different capabilities, and conflating them would give BnScroll a meaningless Justify. Each component that accepts children declares ChildContent itself, at sequence 200.

Sequence band: this type owns 50–54.

There is deliberately no ContainerAttributes splat — the twin of BnLayoutItem's ItemAttributes, which exists for components written as markup, whose generated render tree cannot call an emit helper. No container in this package is written that way, so the splat would be public surface with no caller, frozen for good at the first stable release. Add it with the first markup-authored container, not before.

You do not derive from this yourself, for the same reason given on BnLayoutItem: it is public and abstract to serve the components in this package, not as an extension point.

Properties

Padding

Space inside the box, between its edge and its children. Null = none.

public BnLength? Padding { get; set; }

Property Value

BnLength?

Remarks:

Percentages are legal; auto is not, which is why this is BnLength and not BnAutoLength.

Justify

Main-axis distribution of children. Null = Yoga's default (flex-start).

public FlexJustify? Justify { get; set; }

Property Value

FlexJustify?

Align

Cross-axis alignment of children. Null = Yoga's default (stretch).

public FlexAlign? Align { get; set; }

Property Value

FlexAlign?

Wrap

Whether children wrap onto new lines. Null = Yoga's default (nowrap).

public FlexWrap? Wrap { get; set; }

Property Value

FlexWrap?

Gap

Space between children. Null = none.

public BnLength? Gap { get; set; }

Property Value

BnLength?

BackgroundColor

Fill colour behind the component. Null leaves it transparent.

public string? BackgroundColor { get; set; }

Property Value

String

Margin

Space outside the component, between it and its siblings. Null = none.

public BnAutoLength? Margin { get; set; }

Property Value

BnAutoLength?

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

FlexAlign?

Grow

Share of leftover space this item takes (unitless ratio). Null = Yoga's default (0).

public float? Grow { get; set; }

Property Value

Single?

Shrink

Share of overflow this item gives up (unitless ratio). Null = Yoga's default (1).

public float? Shrink { get; set; }

Property Value

Single?

Basis

Starting main-axis size before grow/shrink. Null = auto.

public BnAutoLength? Basis { get; set; }

Property Value

BnAutoLength?

Width

Box width. Null = auto.

public BnAutoLength? Width { get; set; }

Property Value

BnAutoLength?

Height

Box height. Null = auto.

public BnAutoLength? Height { get; set; }

Property Value

BnAutoLength?

MinWidth

Lower bound on width. Null = unset.

public BnLength? MinWidth { get; set; }

Property Value

BnLength?

MaxWidth

Upper bound on width. Null = unset.

public BnLength? MaxWidth { get; set; }

Property Value

BnLength?

MinHeight

Lower bound on height. Null = unset.

public BnLength? MinHeight { get; set; }

Property Value

BnLength?

MaxHeight

Upper bound on height. Null = unset.

public BnLength? MaxHeight { get; set; }

Property Value

BnLength?

Position

Positioning scheme. Null = Yoga's default (relative).

public FlexPosition? Position { get; set; }

Property Value

FlexPosition?

Top

Top inset. Null = unset.

public BnLength? Top { get; set; }

Property Value

BnLength?

Right inset. Null = unset.

public BnLength? Right { get; set; }

Property Value

BnLength?

Bottom

Bottom inset. Null = unset.

public BnLength? Bottom { get; set; }

Property Value

BnLength?

Left

Left inset. Null = unset.

public BnLength? Left { get; set; }

Property Value

BnLength?