IconLabel QML Type

A label with an icon, designed for button content. More...

Import Statement: import FluentUI.Controls 1.0

List of all members, including inherited members

Properties

color : color
display : enumeration
font : font
icon : var
iconFamily : string
mirrored : bool
spacing : real
text : string

Detailed Description

IconLabel combines an icon and text in a single component suitable for use as the content item of buttons and other interactive controls. It supports configurable spacing, display orientation, mirroring for right-to-left layouts, and icon family selection.

Usage Example

 import QtQuick
 import FluentUI.Controls

 Button {
     contentItem: IconLabel {
         text: "Save"
         icon: "save"
         display: IconLabel.TextRight
     }
 }

Property Documentation

color : color

The text color.

display : enumeration

The relative placement of the icon and text. Possible values include IconLabel.TextRight (icon on the left), IconLabel.TextLeft (icon on the right), IconLabel.TextTop (icon below text), and IconLabel.TextBottom (icon above text).

font : font

The font used for the text label.

icon : var

The icon source. Can be a string name or a URL referencing an image resource.

iconFamily : string

The icon font family to use for rendering the icon.

mirrored : bool

Whether the layout should be mirrored for right-to-left language support. When true, the visual order of icon and text is reversed.

spacing : real

The spacing between the icon and the text in pixels.

text : string

The text displayed alongside the icon.

Contents