cocos2d使用的應該都知道 ClippingNode 和 ProgressTimer的使用方法，這個功能的實作就是基于他們實作的。
需求（主題思路）：一個完整的圓形的幀影片（非圖片）對它進行裁剪，通過 ProgressTimer控制裁剪區控制幀影片的可視區域。加入到計時器中就可以實作可視化的緩慢增長的效果。
注意：如果是一張圖片 直接通過ProgressTimer就可以實作百分比顯示進度條
大神勿噴！！！！ 上代碼
-----------------此處應該有圖片。-------------------------
圖片上傳不上去！！！！
local sprite = cc.Sprite:create("xx.png") ---- 一張圓環形狀的圖片
local progress = cc.ProgressTimer:create(sprite) ----創建ProgressTimer
progress:setPercentage(0) ----
progress:setName("per")
local holesStencil = cc.Node:create()
holesStencil:setName("holesStencil")
holesStencil:addChild(progress)
local spriteBg = cc.Sprite:create("xx.png") ----背景用于放置幀影片 可以和上面用同一張圖片
spriteBg:setName("spriteBg")
spriteBg:setOpacity(0)
local eff = xxx -----幀影片
spriteBg:addChild(eff)
local clipS = cc.ClippingNode:create() ----創建ClippingNode
clipS:setStencil(holesStencil)
clipS:addChild(spriteBg)
clipS:setName("clipS")
clipS:setInverted(false) ---設定可視區為裁剪區域，還是裁剪剩余區域
clipS:setAlphaThreshold(1) ---根據alpha值控制顯示
clipS:setAnchorPoint(cc.p(0, 0))
Node:addChild(clipS) ----添加到節點
============================================
----
local nodeClip = Node:getChildByName("clipS")
local nodeStencil = nodeClip:getStencil()
local nodeProgess = nodeStencil:getChildByName("per")
-----通過設定ProgressTimer 控制顯示區域
nodeProgess:setPercentage(xx)
位置的擺放和對齊需要根據自己的實際需求調整
裁剪原理可參考下面的內容，這里不多說了
http://www.mamicode.com/info-detail-247772.html
uj5u.com熱心網友回復：
所以你是想問什么？uj5u.com熱心網友回復：
什么也不問 分享一下
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/67528.html
標籤：Cocos2d-x
上一篇：GitHub快速搭建個人博客