Label Component
Description
This component represents a label in Blazor using the Gap.Blazor.Label
model. The label is styled dynamically based on the properties of the model and supports text alignment changes.
Usage
@using Gap.Blazor.Components
@using Gap.Blazor.Extensions
@inherits WMControlComponentBase
@namespace Gap.Blazor.Components
@if (model.Visible)
{
<WMStyleBase model=@model></WMStyleBase>
<label class="@model.GetStringClasses() @GetAutoSizeClass()" tabindex=-1>@model.Text</label>
<style>
[email protected]() {
display:flex;
overflow: hidden;
align-items : @this.label.TextAlign.GetAlignItemsStyle();
justify-content : @this.label.TextAlign.GetJustifyContentStyle();
border: @this.label.BorderStyle.ToCss();
}
</style>
}
Properties
label: Instance of the
Gap.Blazor.Label
model.
Methods
OnInitialized(): Initializes the component and subscribes to the
TextAlignChanged
event.SubscribeToModelChanges(): Method called when the
TextAlignChanged
event is triggered.
Dynamic Rendering
The component dynamically renders a label based on the Label
model properties:
WMStyleBase: Applies styles based on the
model
.label: Displays the text of the
Label
model.
Styles
The styles for the label are defined within the component:
display: Sets the display to flex.
overflow: Hides overflow content.
align-items: Aligns items based on the
TextAlign
property.justify-content: Justifies content based on the
TextAlign
property.border: Sets the border style based on the
BorderStyle
property.
Events
TextAlignChanged: Event triggered when the text alignment changes.
Last updated