星级评分

功能简介和适用场景

许多网站、APP 等的评价系统都有按星级评分的功能，大部分是 5 个星级，依次代表 1~5 分。用户只需在某个星星上点击一下即可完成打分，操作难度低，也能让商家快速得到反馈。对于商家而言，获得用户反馈非常重要，它可以直接反映产品的受众效果。而对用户而言，通过评论和评分可以直观地判断 App 的质量。众所周知，无论是买车、买电影票还是下载 App，他人反馈在用户购买决策中起着重要作用。此外，如果某款产品评分达到了 4 星及以上，更容易获得潜在用户的青睐。

关键组件

• 条件式容器：在不同情况下显示不同样式

素材

• 星星图标

实现步骤

第一步：创建数据模型

需要一张表来存放用户的评分结果，并在账户表创建一个和评分表一对多的关系

第二步：样式设置

1. 添加一个条件式容器，并配置 5 个条件式子容器，如下图

2. 为每个条件式子容器配置应显示的星星图片，注意容器的布局方向，图片注意宽度
   • 一星时
   • 二星时
   • 三星时
   • 四星时
   • 五星

第三步：点击行为配置

1. 设置一个 页面变量-score，用于存储用户点击的分数

2. 为每一个星星添加点击时行为-设置页面变量，给 页面变量-score 赋值 1

第四步：条件配置

1. 为每个容器配置条件，页面变量-score 等于 期待需要显示的选中星星的数量

第五步：提交按钮配置

2. 添加一个按钮，为这个按配置行为-添加打分记录，并为里面的字段赋值，其中 分数 对应的是 页面变量-score，打分人_账户 对应的是 当前用户数据id