组件:评分框
评分框组件用于星级评分展示和交互,支持设置最大值、分值、允许半选、只读、字符、激活颜色、未激活颜色、字号、置评分被改变回调等特性,常用于商品评分、满意度评价、质量评级等场景,支持半星评分。
典型使用场景:
- 商品评分(电商平台的星级评价)
- 满意度调查(服务评价、用户体验评分)
- 质量评级(产品质量、服务等级评定)
- 用户反馈(功能使用体验评分)
- 内容质量评分(文章、视频质量评价)
📌 继承自视图的成员速查
本组件继承自 视图 类,可直接使用以下属性和方法:
属性: ID、左边、顶边、右边、底边、宽度、高度、背景、背景颜色、背景图像、文本、文本颜色、字体、字体大小、字体粗细、行高、边框、边框圆角、边框宽度、光标样式、显示模式、透明度、外边距、外边距底、外边距左、外边距右、外边距顶、最大高度、最大宽度、最小高度、最小宽度、内边距、内边距底、内边距左、内边距右、内边距顶、定位、CLASS、InnerHTML、OuterHTML、内容水平对齐方式、首行缩进、可视、显示层级、内联样式、禁用
方法: 追加内联样式(样式文本)、置内联样式(名称,值)、取内联样式值(名称)、取Style对象()、添加事件(事件名称, 回调函数)、删除事件(事件名称, 回调函数)、获取焦点()、清除焦点()、添加样式类(类名称)、移除样式类(类名称)、取样式类列表()、取样式类()、执行单击()、取属性值(属性名)、取属性节点(属性名)、取布局参数()、取渲染宽度()、取渲染高度()、取渲染顶边()、取渲染左边()、左侧对齐到(目标组件,偏移量)、右侧对齐到(目标组件,偏移量)、顶边对齐到(目标组件,偏移量)、底边对齐到(目标组件,偏移量)、右侧对齐到左(目标组件, 偏移量)、左侧对齐到右(目标组件, 偏移量)、底边对齐到顶(目标组件, 偏移量)、顶边对齐到底(目标组件, 偏移量)、有指定属性(属性名)、有属性()、内容可编辑()、包含CSS类(类名)、取命名空间()、取下个节点()、取下个元素()、取节点名称()、取节点类型()、取父节点()、取父元素()、取上个节点()、取上个元素()、销毁()、删除属性(属性名)、删除属性节点(属性名)、置属性值(属性名, 属性值)、置属性节点(属性节点)、取标签名()、移动(左边 顶边, 宽度, 高度)、取原生对象()、置被单击回调(回调函数)、置被双击回调(回调函数)、置鼠标被进入回调(回调函数)、置鼠标被移出回调(回调函数)、置鼠标被移动回调(回调函数)、置鼠标被按下回调(回调函数)、置鼠标被抬起回调(回调函数)、置鼠标滚轮被滚动回调(回调函数)、置键盘被按下回调(回调函数)、置按键被抬起回调(回调函数)、置按键被压下回调(回调函数)、置被失去焦点回调(回调函数)、置被获得焦点回调(回调函数)
事件: 被单击(源对象,事件源)、被双击(源对象,事件源)、鼠标被进入(源对象,事件源)、鼠标被移出(源对象,事件源)、鼠标被移动(源对象,事件源)、鼠标被按下(源对象,事件源)、鼠标被抬起(源对象,事件源)、鼠标滚轮被滚动(源对象,事件源)、键盘被按下(源对象,事件源)、按键被抬起(源对象,事件源)、按键被压下(源对象,事件源)、被失去焦点(源对象,事件源)、被获得焦点(源对象,事件源)
💡 完整成员列表及详细说明请参考:
视图类
常用操作速查
| 操作 | 属性/方法 | 示例 |
|---|---|---|
| 设置最大星数 | 最大值 | 评分框1.最大值 = 5 |
| 设置当前评分 | 分值 | 评分框1.分值 = 3.5 |
| 允许半星评分 | 允许半选 | 评分框1.允许半选 = 真 |
| 设置只读模式 | 只读 | 评分框1.只读 = 真 |
| 设置激活颜色 | 激活颜色 | 评分框1.激活颜色 = "#fadb14" |
| 设置未激活颜色 | 未激活颜色 | 评分框1.未激活颜色 = "#d9d9d9" |
| 设置字符样式 | 字符 | 评分框1.字符 = "★" |
| 设置评分改变回调 | 置评分被改变回调(回调) | 评分框1.置评分被改变回调((源对象, 当前分值) => { ... }) |
样式美化参考
评分样式变体:
- 简约评分:
激活颜色 = "#fadb14",未激活颜色 = "#d9d9d9",字符 = "★" - 彩色评分:
激活颜色 = "#1890ff",未激活颜色 = "#e8e8e8",字符 = "★" - 字符评分:
字符 = "☆",激活颜色 = "#52c41a",未激活颜色 = "#f0f0f0" - 数字评分:
字符 = "1",激活颜色 = "#ff4d4f",未激活颜色 = "#fafafa"
尺寸样式:
- 小尺寸:
字体大小 = "20px",高度 = 30 - 中尺寸:
字体大小 = "24px",高度 = 36 - 大尺寸:
字体大小 = "32px",高度 = 48
状态样式:
- 只读状态:
背景颜色 = "#fafafa",光标样式 = "default" - 禁用状态:
禁用 = 真,透明度 = "0.6"
示例代码
' 示例:完整的评分框使用演示
' 1. 创建评分框
变量 评分框1 = 创建 评分框()
' 2. 设置属性
评分框1.左边 = 100
评分框1.顶边 = 100
评分框1.最大值 = 5
评分框1.分值 = 3.5
评分框1.允许半选 = 真
评分框1.激活颜色 = "#fadb14"
' 3. 设置事件回调
评分框1.置评分被改变回调((源对象, 当前分值) => {
调试输出("评分:" + 当前分值)
})
' 4. 添加到父容器
添加组件(评分框1)
属性:最大值
- 类型:
数值型 - 说明: 设置或获取星的总数,默认 5。
属性:分值
- 类型:
数值型 - 说明: 设置或获取当前评分。
属性:允许半选
- 类型:
逻辑型 - 说明: 设置或获取是否允许半星选择,默认为假。
属性:只读
- 类型:
逻辑型 - 说明: 设置或获取是否只读,默认为假。
属性:字符
- 类型:
文本型 - 说明: 设置或获取星字符,默认 ★。
属性:激活颜色
- 类型:
文本型 - 说明: 设置或获取激活星颜色。
属性:未激活颜色
- 类型:
文本型 - 说明: 设置或获取未激活星颜色。
属性:字号
- 类型:
数值型 - 说明: 设置或获取星字符字号(像素)。
函数:置分值(分值)
设置当前评分。
函数:置评分被改变回调(回调函数)
设置评分改变时的回调函数,回调函数返回两个参数:(源对象,当前分值)。
事件:评分被改变(源对象,当前值)
当评分改变时触发该事件。