美文网首页
星级评分StarScoreDemo

星级评分StarScoreDemo

作者: petry | 来源:发表于2019-07-19 20:03 被阅读0次

今天做了一个点击/拖动小星星评分功能的控件,效果如下:

2019-07-19 19.07.31.gif

支持点击和滑动

原理简介:
一.使用了UIControl控件,点击和滑动事件的监听不用自己搞,自带buff.页面设置五颗星星,就给UIControl添加5个Button.每个button的tag从0开始...

Snip20190719_17.png

二.在以上点击或者拖动相应的回调事件中书写我们的业务逻辑.

 比如我们点击到3.4颗星星的进度,我们的代码执行了以下三件事:
 1.得到当前进度的点坐标,遍历五个button,找到当前点所在的button,就是tag=2的button.获取当前点的数值count.   count = button.tag+(当前点的x坐标-button.x)/button.width. 从而得到count = 2.4
  2.遍历所有button,设置其图片为灰色星星的图片
  3.遍历<=count的button 设置其图标为黄色星星的图片
  4.对当前button的图片单独处理,count取小数0.4,利用图片截取方法截取黄色星星宽度*0.4的图片,然后将其在灰色星星图片上进行合成,这样就能得到一张坐标40%的是黄色星星,右边60%是灰色星星的图片.然后返回给当前button,至此大工告成.

希望初学者能得到启示,学会自己封装控件。完整demo的github地址:星级评分demo请点击此链接进行下载。

相关文章

  • 星级评分StarScoreDemo

    今天做了一个点击/拖动小星星评分功能的控件,效果如下: 支持点击和滑动 原理简介:一.使用了UIControl控件...

  • 星级评分

    一、背景 许多App都会有评价功能,这个时候或许会需要实现星级评分,下面我们来简单的实现一个星级评分功能。 二、简...

  • 星级评分条,不用ratingbar

    星级评分条,不用ratingbar# 使用seekbar 说起星级评分,最先想到的就是ratingbar...但是...

  • 星级评分条

    XML属性 1.android:isIndicator 是否允许改变,true为步允许2.android:n...

  • 星级评分显示

    首先创建一个StarView 最后在要显示星级评价的界面将其带入 最后来一张显示图

  • Excel根据数据进行“星级评分”也可以很有趣【D15-2020

    今日学习来源:微信公众号“Excel学习营” 今日学习内容:Excel星级评分 根据数值进行星级评分,让数据更直观...

  • 星星评分控件TQStarRatingView揭秘!(一)

    今天为大家带来一个iOS星级评分控件的实现,欢迎拍砖。 在github上搜索iOS星级评分控件,可以看到TQSta...

  • iOS实践:一步步实现星级评分

    星级评分在几乎每一个电商平台都会出现,其实在这个星级评分里面不管有多少分,最终我们只用到了三张图片。我们把这个星级...

  • 【iOS】实现星级评分

    许多App都会有评价功能,这个时候或许会需要实现星级评分,下面我们来简单的实现一个星级评分功能。 具体实现 导入资...

  • JS实现星级评分

    朋友给我一份星级评价的html代码,说不能实现多行星级评价,让我帮忙看一下。 帮朋友修改的,怕到时候自己也用到了,...

网友评论

      本文标题:星级评分StarScoreDemo

      本文链接:https://www.haomeiwen.com/subject/dcqelctx.html