Label

The Label component is a simple component used to display text or a label in a user interface. It is commonly used to provide a description or title for other components, such as input fields, buttons, or icons.

Props

Name	Description	Type
class	Allows custom properties to take effect.	string
processHtml	It processes html tags in Label text.	boolean
text	Sets the default text.	string
tagType	Text tag type.	string
whiteSpace	The property specifies how white-space inside an element is handled.	string
overflow	The property specifies what should happen if content overflows an element's box.	string
textOverflow	The property specifies how overflowed content that is not displayed should be signaled to the user. It can be clipped, display an ellipsis (...), or display a custom string.	string
visible	Visibility of Label component.	boolean

Mobile Usage

If you want a Label to wrap to the next line, define a custom CSS class for the respective label and give it a min-height value.

Usage Scenarios

Using Html Tags

If you intend to use HTML tags within Label on mobile, set the processHtml prop to true.

Supported tags; a, b, i tags.

'Google''da yeni bir sayfa açmak için bu bağlantıya <a target="_blank" href="https://www.google.com">tıklayınız.</a>'

Using Html Tags With Click Event

If you intend to use HTML tags within Label on mobile, set the processHtml prop to true.

Users can also trigger their previously declared quick events. For this, the following steps should be applied:

'Google''da yeni bir sayfa açmak için bu <a onclick="myEvent()">bağlantıya</a> tıklayın.'

• You should add a custom event to the PageComponent and perform the operations in it should be defined. (MyEvent in this example)

• The added custom event must be declared in the PostRender event of the PageComponent.

• You should trigger the custom event in the html tag added to the text of the Label.

• If you want to display Labels side by side, you can add as many Labels as you want inside a single VCol within a VRow-VCol structure, and set the direction of VCol to Row.

• If you want to display Labels stacked vertically, place each label in a separate VCol within a VRow-VCol structure, and set the direction of VCol to Col.

Samples Qjson

Qlabel_Props
QLabel_URL
QLabel_URL_Click