公告 欢迎您,我的朋友,目前开放免费注册,注册登录后查看更多内容!开通会员送积分,相应文档随便看,积分充值登录后个人中心内按需充值!

🔐 通用宫格控件GridX

GridX 是一个通用宫格控件,支持任意数量的宫格显示(1-100项),自动计算行列布局。适用于动态功能导航、应用菜单等场景。 固定的还有四宫格,九宫格,16宫格,32宫格。

GridX 通用宫格控件

控件名称

GridX

中文名称

通用宫格控件

控件优点

GridX 是一个通用宫格控件,支持任意数量的宫格显示(1-100项),自动计算行列布局。适用于动态功能导航、应用菜单等场景。

image.png

主要特性

  • 任意宫格:支持1-100个宫格
  • 自动布局:自动计算最佳行列数(最大10×10)
  • 灵活布局模式:支持固定大小留空缺和平均填充两种模式
  • 图标支持:支持图片图标和 SVG 图标
  • 徽章显示:支持文本徽章显示,可自定义位置和偏移
  • 点击事件:支持单元格点击事件
  • 禁用状态:支持禁用状态设置,禁用时鼠标显示禁用样式
  • 独立文本颜色:支持独立设置文本颜色
  • 主题支持:支持亮/暗主题切换

重要参数说明

基本属性

属性名 类型 默认值 说明
ItemCount int 12 宫格数量(1-100),设置后自动初始化对应数量的默认项
Columns int 4 列数(1-10),自动计算最佳行数
Rows int - 行数(只读),根据 ItemCount 和 Columns 自动计算
FillMode GridXFillMode FixedSize 布局填充模式
Spacing int 6 单元格间距
BorderRadius int 0 圆角半径(0表示直角)
BorderColor Color 229, 229, 229 边框颜色
GridBoxColor Color Teal 宫格背景色
GridLineColor Color 229, 229, 229 格线颜色
GridLineWidth int 1 格线宽度
ShowGridLines bool true 是否显示格线
IconSize int 40 图标大小
BackColor Color 250, 250, 250 控件背景色
ForeColor Color White 前景色(用于文本)
FollowGlobalTheme bool true 是否跟随全局主题变化

GridXFillMode 枚举

说明
FixedSize 固定大小留空缺(最后一行按实际项数显示)
FillLastRow 平均填充最后一行(最后一行平均分配宽度)

GridXItem 属性

属性名 类型 默认值 说明
Icon Image null 图标图片
IconSvgName string "windows" SVG 图标名称
IconSvgColor Color White SVG 图标颜色
IconSvgRotation float 0 SVG 图标旋转角度
Text string "" 文本
TextColor Color Empty 文本颜色(Empty 时使用主题默认颜色)
Badge string "" 徽章文本(空字符串不显示)
BadgeColor Color 255, 77, 79 徽章背景色
BadgePosition BadgePosition IconTopRight 徽章显示位置
BadgeOffsetX int 0 徽章X轴偏移量(正数向右,负数向左)
BadgeOffsetY int 0 徽章Y轴偏移量(正数向下,负数向上)
Name string "" 项名称(自动增量,如 GridX_0)
Enabled bool true 是否启用
Tag object null 自定义数据

该文档需要「文档会员」身份

请先登录后继续阅读。