今天做了一個(gè)點(diǎn)擊/拖動(dòng)小星星評(píng)分功能的控件，效果如下：

2019-07-19 19.07.31.gif

支持點(diǎn)擊和滑動(dòng)

原理簡(jiǎn)介:
一.使用了UIControl控件,點(diǎn)擊和滑動(dòng)事件的監(jiān)聽(tīng)不用自己搞,自帶buff.頁(yè)面設(shè)置五顆星星,就給UIControl添加5個(gè)Button.每個(gè)button的tag從0開(kāi)始...

Snip20190719_17.png

二.在以上點(diǎn)擊或者拖動(dòng)相應(yīng)的回調(diào)事件中書(shū)寫(xiě)我們的業(yè)務(wù)邏輯.

 比如我們點(diǎn)擊到3.4顆星星的進(jìn)度,我們的代碼執(zhí)行了以下三件事:
 1.得到當(dāng)前進(jìn)度的點(diǎn)坐標(biāo),遍歷五個(gè)button,找到當(dāng)前點(diǎn)所在的button,就是tag=2的button.獲取當(dāng)前點(diǎn)的數(shù)值count.   count = button.tag+(當(dāng)前點(diǎn)的x坐標(biāo)-button.x)/button.width. 從而得到count = 2.4
  2.遍歷所有button,設(shè)置其圖片為灰色星星的圖片
  3.遍歷<=count的button 設(shè)置其圖標(biāo)為黃色星星的圖片
  4.對(duì)當(dāng)前button的圖片單獨(dú)處理,count取小數(shù)0.4,利用圖片截取方法截取黃色星星寬度*0.4的圖片,然后將其在灰色星星圖片上進(jìn)行合成,這樣就能得到一張坐標(biāo)40%的是黃色星星,右邊60%是灰色星星的圖片.然后返回給當(dāng)前button,至此大工告成.

希望初學(xué)者能得到啟示,學(xué)會(huì)自己封裝控件。完整demo的github地址：星級(jí)評(píng)分demo請(qǐng)點(diǎn)擊此鏈接進(jìn)行下載。