cocos2dx的一些效果

原创已于 2022-04-06 16:56:13 修改 · 790 阅读

2 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#cocos2d #游戏引擎 #html5

于 2017-03-29 14:41:25 首次发布

cocos2dx的一些效果专栏收录该内容

2 篇文章

订阅专栏

本文详细探讨了cocos2dx游戏引擎中的一些特效，包括缓冲效果如弹跳缓冲(EaseBounceIn、EaseBounceOut、EaseBounceInOut)和弹性缓冲(EaseElasticIn、EaseElasticOut、EaseElasticInOut)，以及卷轴打开、场景切换、宝箱抖动和物体变大变小等动画效果的应用与实现。

http://1

绽开：

self.pic:setScale(0.1)  
self.pic:setOpacity(0)  
local action1 = cc.Spawn:create(cc.ScaleTo:create(0.15, 2.0),cc.FadeTo:create(0.15,255))  
local action  = cc.Sequence:create(action1,cc.DelayTime:create(1.0))  
self.pic:runAction(action1, action)

@ 缓冲：

弹跳缓冲（Bounce）：EaseBounceIn、EaseBounceOut、EaseBounceInOut；

弹性缓冲（跟上面啥区别呢？看有没有越界…）：EaseElasticIn、EaseElasticOut、EaseElasticInOut；

回震缓冲：EaseBackIn、EaseBackOut、EaseBackInOut；

self.pic:setScale(1)
local scale = cc.ScaleTo:create(0.5,1.3)
local action = cc.EaseBounceOut:create(scale)
self.pic:runAction(action)

@ 卷轴打开：

--[[
	--ClippingNode test 
    local clipnode = cc.ClippingNode:create()   
    clipnode:setPosition(568,320) 
    self:addChild(clipnode) 

    --属性设置    
    clipnode:setInverted(false)       --倒置显示，未被裁剪下来的剩余部分    
    clipnode:setAlphaThreshold(0.5)  --设置alpha透明度闸值       

    --创建模板    
    local Stencil = cc.Node:create()   
    clipnode:setStencil(Stencil) --设置模板节点    
     
    --添加一个模板遮罩 ball    
    local spp = cc.Sprite:create("common/anim1.png")
    Stencil:addChild(spp)

    --添加另一个底板内容 blocks    
    local content = cc.Sprite:create("common/b1.png")    
    clipnode:addChild(content)
 --]]
    local juanzhouWidget = self:getWidget("Image_juanzhou") 
    local zhouleftWidget = self:getWidget("Image_zhouleft")
	local zhourightWidget = self:getWidget("Image_zhouright")
    juanzhouWidget:setVisible(false)
    zhouleftWidget:setVisible(false)
    zhourightWidget:setVisible(false)

	local clipnode = cc.ClippingNode:create()   
    clipnode:setPosition(568,320) 
    self:addChild(clipnode) 
    --属性设置    
    clipnode:setInverted(false)       --倒置显示，未被裁剪下来的剩余部分    
    clipnode:setAlphaThreshold(0.5)  --设置alpha透明度闸值     

	--创建模板     
    local Stencil = cc.Sprite:create("common/mid_background.png")
    clipnode:setStencil(Stencil) --设置模板节点  

    --添加另一个底板内容 blocks    
    local content = cc.Sprite:create("common/shufa.png")    
    clipnode:addChild(content)

    local zhouleft = cc.Sprite:create("common/left.png")    
    zhouleft:setPosition(zhouleftWidget:getPosition())
    self:addChild(zhouleft)

    local zhouright = cc.Sprite:create("common/right.png")    
    zhouright:setPosition(zhourightWidget:getPosition())
    self:addChild(zhouright)

    local function Callback()
    	scheduler:unscheduleScriptEntry(self.schedu)
    end

    local actTime = 2 --动画时间
    local callfunc = cc.CallFunc:create(Callback)

	local moveleft = cc.MoveBy:create(actTime, cc.p(-290,0))
	local moveright = cc.MoveBy:create(actTime, cc.p(290,0))
	local seq = cc.Sequence:create(moveright,callfunc)
	zhouleft:runAction(moveleft)
	zhouright:runAction(seq)

	local scale = 0
	local function funCallback()
		Stencil:setScaleX(scale)
		scale = scale + 0.26
    end
   self.schedu = scheduler:scheduleScriptFunc(funCallback, 0.002, false)

切换：

--图片裁切，像捕鱼一样的效果。
    local clipnode1 = cc.ClippingNode:create()   
    clipnode1:setPosition(0,320) 
    self:addChild(clipnode1) 
    --属性设置    
    clipnode1:setInverted(true)       --倒置显示，未被裁剪下来的剩余部分    
    clipnode1:setAlphaThreshold(0.5)  --设置alpha透明度闸值     

	--创建模板     
    local Stencil1 = cc.Sprite:create("common/bar2.png")
    Stencil1:setAnchorPoint(0,0.5)
    clipnode1:setStencil(Stencil1) --设置模板节点  

    --添加另一个底板内容，背景 blocks    
    local sp1 = cc.Sprite:create("bk/bg.jpg")    
    sp1:setPosition(winSize.width/2,0)
    clipnode1:addChild(sp1)
    ------------------------------
    local clipnode2 = cc.ClippingNode:create()   
    clipnode2:setPosition(0,320) 
    self:addChild(clipnode2) 
    --属性设置    
    clipnode2:setInverted(false)       --倒置显示，未被裁剪下来的剩余部分    
    clipnode2:setAlphaThreshold(0.5)  --设置alpha透明度闸值     

	--创建模板     
    clipnode2:setStencil(Stencil1) --设置模板节点  

    --添加另一个底板内容，背景 blocks    
    local sp2 = cc.Sprite:create("bk/main.jpg")    
    sp2:setPosition(winSize.width/2,0)
    clipnode2:addChild(sp2)

    local scale = 0
	local function funCallback()
		Stencil1:setScaleX(scale)
		if scale >= 12 then
			scheduler:unscheduleScriptEntry(self.schedu)
			return
		end
		scale = scale + 0.1
    end
   self.schedu = scheduler:scheduleScriptFunc(funCallback, 0.02, false)

宝箱抖动：

function runShakeAni(self,box)
    local rotate1 = cc.RotateTo:create(0.15, 10)
    local rotate2 = cc.RotateTo:create(0.15, -10)
    local rotate3 = cc.RotateTo:create(0.15, 0)
    local seq = cc.Sequence:create(rotate1, rotate2,rotate1,rotate2,rotate1,rotate2,rotate1,rotate2,rotate3,cc.DelayTime:create(2.0))
    local rep = cc.RepeatForever:create(seq)
    box:runAction(rep)
end

变大变小：

--变大变小的action
function showScaleAction(node,args)
	node:setAnchorPointInplace(0.5, 0.5)
	local scale = node:getScale()
	local time1 = args and args.time1 or 1.3
	local time2 = args and args.time2 or 1.2
	local sSacle = args and args.sScale or 0.99 * scale
	local nScale = args and args.nScale or 1.06 * scale 

	local small = cc.ScaleTo:create(time1, sSacle)
	local normal = cc.ScaleTo:create(time2, nScale)
	local action = cc.RepeatForever:create(cc.Sequence:create({normal, small}))
	node:runAction(action)
end

local args = {nScale = 1.15,sScale = 0.95,time1=1.2,time2=1.1}
showScaleAction(rankReward, args)