# Bunifu Label
## Overview
**Bunifu Label** is a rich .NET control that allows us to provide rich appealing texts inside our Windows Forms applications. It extends the basic properties of the standard Windows Form Label by adding support for **HTML-based** text tags and **inline CSS** styles.
## Getting Started
### Adding Bunifu Label at Design Time
It's easy to add a Bunifu Label at the designer level. Locate Bunifu Label in your toolbox and drag it to your form as shown below.
### **Adding Bunifu Label at run time**
To add a Bunifu Label on our form at run-time, use the Load event handler of your form to run the following code.
{% tabs %}
{% tab title="C#" %}
```csharp
public partial class Form1: Form
{
public Form1() {
InitializeComponent();
}
private void Form1_Load(object sender, EventArgs e)
{
var newLabel = new Bunifu.UI.WinForms.BunifuLabel();
newLabel.Text = 'My new label’;
this.Controls.Add(newLabel);
}
}
```
{% endtab %}
{% tab title="VB.NET" %}
```erlang
Public Class Form1
Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
Dim label As New Bunifu.Framework.UI.BunifuLabel
label.Text =’My new label'
Me.Controls.Add(label)
End Sub
End Class
```
{% endtab %}
{% endtabs %}
{% hint style="success" %}
Let's take a deep dive and get insights into the available properties on Bunifu Label.
{% endhint %}
## Properties
### `1. Text`
This property allows you to get or set a text string for the label control.
Apart from providing a string text, it provides an advanced text styling mechanism that implements the use of HTML tags and inline CSS style capabilities. Here's a list of the supported tags.
| Tag | Description |
| -------------- | ------------------------------------------------------------------------------------------- |
| \ to \ | Defines the text headings |
| \
| Defines a paragragh |
| \
| Defines a single line break |
| \ | defines text with a bold style |
| \ | Defines a subscript text |
| \ | Defines a superscript text |
| \ | Defines a list item used with ordered
lists(\
) or unordered lists (\
|
{% hint style="info" %}
Note that the tags are XHTML compliant
{% endhint %}
To add the **CSS** styling we use the style attribute of the HTML elements described above. The following is a style that sets the **`fore-color`** of a super-script text in the label.
```css
This text contains a colored supercript
number: 10^45
```
### `2. Font`
This property allows you to get or set an array of font styles for the text rendered in the control. You can set, for example, the `font-family,` the `font-size` and much more.
### `3. ForeColor`
This property allows you to get or set a color value for the text rendered in the control. It supports the use of RGB and HEX color values.
### `4. BackColor`
This property gets or sets the background color for the label control. By default, the background color value is set to **transparent.**
### `5. TextAlign`
This property gets or sets the text alignment position of the text rendered in the label control.
{% hint style="warning" %}
For the property to function, ensure that the `AutoSize` and `AutoSizeHeightOnly` properties are unchecked.
{% endhint %}
The available enumerated position values are `top-left`, `top-center`, `top-right`, `middle-left`, `middle-center`, `middle-right`, `bottom-left`, `bottom-center` and `bottom-right` positions.
### `6. AutoSize`
This property gets or sets a boolean value, which when set to true, causes the label control to grow and shrink automatically based on the text's length. By default, the property is set to **true**.
Setting the property to false, allows you to define a custom size(i.e., the width and height) of the label control.
{% hint style="info" %}
It is important to set the AutoEllipsis property to true, so that when the text exceeds the set width of the label control, will cause the ellipsis to appear at the right edge of the control.
{% endhint %}
### `7. AutoSizeHeightOnly`
This property gets or sets a boolean value, which when set to true, causes the label control height to automatically grow and shrink base on the text's line breaks.
{% hint style="info" %}
Ensure that when using this property, the **`UseGdiPlusTextRendering`** property is set to **true**. This will ensure that all the text content fits within the system's auto-sized height.
{% endhint %}
### `8. AutoEllipsis`
This property allows you to get or set a boolean value, which when set to true, appends the ellipsis characters (...) at the right edge position of the label control, denoting that the text has exceeded the set width specified in the control.
{% hint style="warning" %}
This property only works when the `AutoSize` property and `AutoSizeHeightOnly` property are set to false.
{% endhint %}
### `9. IsSelectionEnabled`
This property allows you to get or set a boolean value, which when set to true, enables users to select the label's text during the application's run-time.
### `10. AllowParentOverrides`
This property allows you to get or set a boolean value, that when set to true, enables the label control to inherit properties of the parent control.
## Take Away
We hope you have gained insights into using Bunifu Label. Should you have feedback or suggestions please send us via chat on the bottom right corner of the screen and we will gladly respond in no time.