Cocos2d-Lua 做一個活動轉盤

 

這類活動你肯定見過

---

 

 

       關於轉盤類型的活動我相信大家多多少少都接觸到了，很多的抽獎界面都是這類型的，今天這篇小文章就簡單的總結一下我們游戲中需要實現這樣一個效果的時候我們該怎樣去做，其實只要是Cocos類型的，不管是C++的還是JS還是Lua他們之間的道理是相同的，類似於下面這樣圖的效果：

 

 

其實這類型的活動效果無非就分下面兩種：

       1、指針轉動

       2、底盤轉動

但其實這兩點在實現方面是完全一樣的，我們需要控制的只是那個控件在我們設置的條件下轉動。  

 

代碼需要注意的點

---

 

      1、我們不能讓指針停止在兩個區域之間的線上

      2、往往結束轉動之后我們還是需要做很多操作的，該怎么寫

      3、最簡單的寫法

 

      針對上面三點我們也簡單的說說：

      1、不能讓停止在兩個區域之間的線上我們就得設置一個最小的偏移量，保證不讓停止在這個偏移量之內

      2、我們利用cc.Sequence

      3、最簡單的方式就是讓每個抽獎區域模塊化，我們只需要告訴我們封裝的轉動的代碼，你需要停止在哪個位置

 

核心代碼

---

 

      下面的區域就是我們設置的區塊，因為活動中獎概率這種一般都是后台設置好概率計算好中獎結果之后給你數據，你只需要展示一個效果就行，因為這個概率是需要后台配置改變的，不會讓移動端把這些寫死的，就像很多人玩的王者榮耀一樣，其實在點擊了抽獎還沒有執行抽獎動畫之前其實你仔細看看都已經知道自己中了什么了，仔細看你的鑽石或者金幣刷新就知道了！

-- 開始抽獎
-- stopId  中間區域
-- sprRound 轉到的指針
function ActitvityItem2:onStartDrawALotteryOrRaffle(sprRound,stopId)
    
    if GlobalUserItem.bSoundAble then
		self.music= AudioEngine.playEffect(cc.FileUtils:getInstance():fullPathForFilename("sound/ZPZD.wav"),true)
	end 
    -- ExternalFun.playClickMusic("ZPZD") 
    --轉盤總獎項數 
    local totalCount = 8 
    --轉動最小圈數
    local roundCountMin = 8
    --轉動最大圈數
    local roundCountMax = 14
    --所有獎項概率相同時 這樣計算每個獎項占的角度 如果概率不同，可以使用table數組來處理 
    local singleAngle = 360/totalCount 
    --為了避免不必要的麻煩，在接近2個獎項的交界處，左右偏移n角度的位置，統統不停留 否則停在交界線上，這個值必須小於最小獎項所占角度的1/2
    local offsetAngle = 10
    --轉盤停止位置的最小角度 不同概率時，直接把之前的項相加即可
    local angleMin = (stopId-1) * singleAngle 
    --轉盤轉動圈數 目前隨機 正常情況下可加入力量元素 根據 移動距離*參數 計算轉動圈數
    local roundCount = math.random(roundCountMin, roundCountMax) 
    --檢查一下跳過角度是否合法 當前獎項角度-2*跳過角度 結果必須>0  
    --轉動角度
    local angleTotal = 360*roundCount + angleMin + math.random(offsetAngle, singleAngle-offsetAngle) 
    -- print('stopId:'..stopId) 
    -- print('angleMin:'..angleMin) 
    -- print('roundCount:'..roundCount) 
    -- print('angleTotal:'..angleTotal) 
    --復位轉盤
    sprRound:setRotation(0)
    --開始旋轉動作使用EaseExponentialOut(迅速加速，然后慢慢減速)
    sprRound:runAction(cc.Sequence:create(

        cc.EaseExponentialInOut:create(cc.RotateBy:create(4.0, angleTotal)),
        cc.CallFunc:create(function() 
            self:onEndAction(stopId)
        end)
    ))

 

      最后，這是核心代碼，里面的東西都加了注釋的，還有里面幾個角度的點需要注意一下的，這個仔細看看就能理解！