GWT中的星级特征：如何实现部分填充的恒星？

Question

如何在GWT中实现像这样的星级评分功能？库是否存在？

主要情景：将小数等级显示为部分填充的星星。

• 对服务器的调用会返回[0,5]小数等级/等级，例如3.4。
• 用户界面显示3.4 / 5填充星标，看起来像。

默认情况下，我能想到的最佳方法是在客户端捆绑中创建一些具有给定评级分辨率的小型预填图像，例如0.5（~10个图像）或0.1（~50）个图像。然后编写映射逻辑以显示适当的星形图像。 是最有效的方式吗？

这种方法的可能优化的版本将是具有一个部分填充的星的图像，然后显示逻辑将组合5星作为评级的函数 - 例如，对于3.4,3完全满星，一颗部分填充恒星到0.4级，一颗空星。

补充方案：输入{0,1,2,3,4,5}星的整数评级。

• 显示五个空心星。
• 当用户将鼠标悬停在星星上时，星星和左边的所有星星都会填满。
• 当用户点击时，会注册整数评级。

使用与上面类似的方法，两个图像就足够了：一个没有背景，一个填充。

同样，是否有一个小部件/库包含这样一个常见的网络应用程序功能？

实施起来似乎并不困难，但无需重新发明轮子！一个这样一个常见的网络应用程序功能的良好库可以有更多的嵌入式功能，如通过评级管理评级列表及其相应的显示，进入审查面板等，所有性能优化。

Answer 1

1. 创建三个星形图像：完整，空白和半满。
2. 创建自定义小部件。使用FlowPanel作为内部带有星形图像的容器。
3. 在此小部件中创建方法showRating（）：

（a）如果已经拥有它们，请注明星星。

（b）为每个圆点添加完整的星形图像。

（c）如有必要，添加半空星图像半点。

（d）如有必要，添加空星图像，使总共5颗星。

这是一个相当简单的小部件。你不需要一个库。