TextIcon QML Type
一个自定义的文本和图标组合组件,支持图标和文本的不同排列方式。. More...
Import Statement: | import FluentUI.Controls 1.0 |
Properties
- color : color
- display : int
- family : string
- iconDelegate : Component
- reverse : bool
- spacing : int
- text : string
Signals
- void onClicked()
Methods
- void setIconSource(string source)
- void setText(string text)
Detailed Description
`TextIcon` 组件将图标和文本组合在一个可自定义的布局中,支持文本在图标旁边或图标下方的显示方式。用户可以通过属性来调整图标和文本的排列顺序、间距以及显示样式。
示例用法:
TextIcon { text: "Settings" icon.source: "icons/settings.svg" spacing: 8 display: Button.TextBesideIcon reverse: false font: Typography.body }
Property Documentation
color : color |
图标和文本的颜色。根据组件的启用状态进行调整。
默认值为 `enabled ? Theme.res.textFillColorPrimary : Theme.res.textFillColorDisabled`。
display : int |
图标和文本的显示模式。可以是以下值之一: - `Button.TextBesideIcon`:文本在图标旁边 - `Button.TextUnderIcon`:文本在图标下方 - `Button.TextOnly`:仅显示文本 - `Button.IconOnly`:仅显示图标
默认值为 `Button.TextBesideIcon`。
family : string |
图标字体的名称,用于指定图标的字体族。
默认值为 `FluentIcons.fontLoader.name`。
iconDelegate : Component |
图标的自定义组件。可以用于进一步定制图标的外观。
默认值为 `comp_icon`。
reverse : bool |
是否反转图标和文本的显示顺序。为 `true` 时,文本显示在图标下方;为 `false` 时,文本显示在图标旁边。
默认值为 `false`。
spacing : int |
图标和文本之间的间距。
默认值为 `0`。
text : string |
要显示的文本内容。
默认值为空字符串。
Signal Documentation
void onClicked() |
当图标和文本组合项被点击时发出的信号。
Note: The corresponding handler is onOnClicked
.
Method Documentation
void setIconSource(string source) |
设置图标的来源。
source 图标的来源 URL 或路径。
void setText(string text) |
设置显示的文本内容。
text 要显示的文本。