组件/数据展示

EAvatarGroup 头像组

import EUI 1.0

示例与代码

头像组、折叠与悬停预览

QML 代码QML

import EUI 1.0 import QtQuick 2.15 import QtQuick.Layouts 1.15 import QtQuick.Controls 2.15 EAvatarGroup { size: 44 overlap: 10 collapseAvatars: true maxCollapseAvatars: 3 collapseAvatarsTooltip: true EAvatar { text: "A" source: "qrc:/example/images/gallery/avatar-01.jpg" } EAvatar { text: "B" source: "qrc:/example/images/gallery/avatar-02.jpg" } EAvatar { text: "C" source: "qrc:/example/images/gallery/avatar-03.jpg" } EAvatar { text: "D" source: "qrc:/example/images/gallery/avatar-04.jpg" } EAvatar { text: "E" source: "qrc:/example/images/gallery/avatar-05.jpg" } EAvatar { text: "F" source: "qrc:/example/images/gallery/avatar-06.jpg" } }

效果

运行代码，体验组件交互

可修改文字、属性和事件，再点击运行。

代码在当前浏览器中运行 许可

属性

属性说明取值与默认值

avatarsvar

组内头像对象数组。

字段：
source, text, fillMode
iconSource, backgroundColor, size
shape

默认值[]

collapseAvatarsbool

折叠超出数量上限的头像。

默认值false

collapseAvatarsTooltipbool

为折叠头像显示提示。

默认值false

contentalias

内容插槽；直接在组件内部声明 QML 子对象。

默认值别名：avatarRow.data

enabledbool

是否允许交互；false 时控件禁用。

默认值true

heightreal

组件尺寸，单位为像素；可绑定父布局尺寸。

默认值implicitHeight

maxCollapseAvatarsint

折叠时最多直接显示的头像数量。

默认值3

overlapint

相邻头像的重叠距离，单位为像素。

默认值8

shapestring

头像形状。

circle
square

默认值"circle"

sizeint

头像直径或边长，单位为像素。

默认值40

visiblebool

是否显示组件。

默认值true

widthreal

组件尺寸，单位为像素；可绑定父布局尺寸。

默认值implicitWidth

collapsedCountint只读

折叠隐藏的头像数量。

默认值由运行时计算

countint只读

骨架实例数量或当前项目数量，具体含义由组件决定。

默认值由运行时计算

方法

签名作用

openCollapsed()

展开折叠的头像集合。