2014-02-09 79 views
0

如何在GWT中实现像这样的这样的星级功能?图书馆是否存在?GWT中的星级评分功能:如何实现部分满星星?

主要场景:显示小数评分为部分填满的星星。

  • 对服务器的调用返回一个[0,5]小数评分/等级,比如3.4。
  • 用户界面显示3.4/5满星,看起来像这样的东西

默认情况下,我能想到的最好的办法是在与一个给定等级的分辨率的客户端包创建许多小的预填充的图像,比方说0.5(〜10个图像)或0.1(〜50 ) 图片。然后编写映射逻辑以显示适当的星形图像。 是最有效的方法吗?

也许优化版本这种方法将有一个部分填充星图像,然后在显示逻辑将组装分作为等级的函数 - 例如,对于3.4,3完全填充星,一个部分充满星星0.4级,一颗空星。

补充场景:输入一个整数评级{0,1,2,3,4,5}星。

  • 显示五颗空白的星星。
  • 当用户将鼠标移到星号上时,左侧的星号和所有星号填满。
  • 当用户点击时,整数评级被注册。

使用上述类似的方法,双图像就足够了:一个没有背景,一个没有填充。

再一次,是否有一个窗口小部件/库包装这种常见的网络应用程序功能呢?

这似乎并不难实现,但不需要重新发明轮子!一个这样一个常见的网络应用程序功能的好库可以有更多的嵌入式功能,如按评级管理评级列表及其相应的显示,进入评论面板等,所有性能都得到优化。

回答

1
  1. 创建三个星形图像:完整,空白和半满。
  2. 创建一个自定义小部件。使用FlowPanel作为包含星形图像的容器。
  3. 在这个小部件创建方法showRating():

(一)如果清除星星,你已经有了他们。 (b)为每个圆点添加完整的星形图像。 (c)如有必要,添加半空星形图像作为半点。 (d)如有必要添加空白星图,共计5星。

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