cocso2dx閃亮標題實現

最終效果圖：

實現方法:

主要依懶ClippingNode類

需要的素材有:

顯示標題，又作爲stencil（模板)

光束(beam)....就是純白色加點透明....可能看不出來

代碼實現

1.添加標題

//標題
	auto title = Sprite::create("BeamTitle/title.png");
	title->setAnchorPoint(Vec2(0.5f, 0.5f));
	title->setPosition(Vec2(visibleSize.width / 2, visibleSize.height / 6 * 5));
	this->addChild(title);

2,加ClippingNode

ClippingNode需要設置三個內容

模板(Node *類型)，這裏是標題，第一張圖，不會被顯示

顯示目標(ClippingNode 的子節點)，這裏是光束，第二張圖

設置AlphaThresHold的值，簡單點的說就是透明度，只有當模板透明度大於這個值時，顯示目標纔會繪製

//clippingNode
	auto titleStencil = Sprite::create("BeamTitle/title.png");
	auto clipTitle = ClippingNode::create(titleStencil);
	clipTitle->setAnchorPoint(Vec2(0.5f, 0.5f));
	clipTitle->setPosition(Vec2(visibleSize.width / 2, visibleSize.height / 6 * 5));
	clipTitle->setAlphaThreshold(0.0f);
	this->addChild(clipTitle);
	//Beam 光束
	auto beam = Sprite::create("BeamTitle/beam.png");
	beam->setAnchorPoint(Vec2(0.5f, 0.5f));
	auto toRight = MoveTo::create(0.5f, Vec2(200, 50));
	auto toLeft = MoveTo::create(0.5f, Vec2(-200, 50));
	auto seq = Sequence::create(toRight, toLeft, nullptr);
	auto move = RepeatForever::create(seq);
	beam->runAction(move);
	clipTitle->addChild(beam);

代碼中,ClippingNode的AlphaThresHold值被設置爲0.0f,標題的完全透明部分的透明度也爲0.0f.所以beam在透明部分不會被顯示。

額外例子

最下面的滾動條是用來設置AlphaThresHold

中間使用的模板是

增加AlphaThresHold的值，圖片顯示的內容越來越少。

完整代碼

BeamTitle.h

#ifndef __BEAM__TITLE__CPP__
#define  __BEAM__TITLE__CPP__
#include "cocos2d.h"
#include "ui/UISlider.h"
class BeamTitle :public cocos2d::Layer{
public:
	/*
	 *三個構造相關函數
	 */
	static cocos2d::Scene* createScene();
	CREATE_FUNC(BeamTitle);
	bool init();
private:
	/*
	 *滑動條函數
	 */
	void sliderEvent(cocos2d::Ref *pSender, cocos2d::ui::Slider::EventType type);
private:
	cocos2d::ClippingNode *clip;
	cocos2d::Label *label;
};
#endif

BeamTitle.cpp

#include "BeamTitle.h"
#include "BackLayer.h"
#include "ui/UISlider.h"
USING_NS_CC;
using namespace ui;
Scene *BeamTitle::createScene(){
	auto *back = BackLayer::create();
	Layer *layer = BeamTitle::create();
	Scene*scene = Scene::create();
	scene->addChild(back);
	scene->addChild(layer);
	return scene;
}
bool BeamTitle::init(){
	if (!Layer::init())
		return false;
	auto visibleSize = Director::getInstance()->getVisibleSize();
	//標題
	auto title = Sprite::create("BeamTitle/title.png");
	title->setAnchorPoint(Vec2(0.5f, 0.5f));
	title->setPosition(Vec2(visibleSize.width / 2, visibleSize.height / 6 * 5));
	this->addChild(title);
	//clippingNode
	auto titleStencil = Sprite::create("BeamTitle/title.png");
	auto clipTitle = ClippingNode::create(titleStencil);
	clipTitle->setAnchorPoint(Vec2(0.5f, 0.5f));
	clipTitle->setPosition(Vec2(visibleSize.width / 2, visibleSize.height / 6 * 5));
	clipTitle->setAlphaThreshold(0.0f);
	this->addChild(clipTitle);
	//Beam 光束
	auto beam = Sprite::create("BeamTitle/beam.png");
	beam->setAnchorPoint(Vec2(0.5f, 0.5f));
	auto toRight = MoveTo::create(0.5f, Vec2(200, 50));
	auto toLeft = MoveTo::create(0.5f, Vec2(-200, 50));
	auto seq = Sequence::create(toRight, toLeft, nullptr);
	auto move = RepeatForever::create(seq);
	beam->runAction(move);
	clipTitle->addChild(beam);
	//滑動條
	auto slider = Slider::create();
	slider->loadBarTexture("BeamTitle/sliderTrack.png");
	slider->loadProgressBarTexture("BeamTitle/sliderProgress.png");
	slider->loadSlidBallTextures("BeamTitle/sliderThumb.png", "BeamTitle/sliderThumb.png","");
	slider->setPosition(Vec2(visibleSize.width / 2, visibleSize.height / 8));
	slider->addEventListener(CC_CALLBACK_2(BeamTitle::sliderEvent, this));
	this->addChild(slider);
	/*
	 *ClippingNode
	 */
	//模板
	auto stencil = Sprite::create("BeamTitle/stencil.png");
	//顯示對象 貓
	auto cat = Sprite::create("BeamTitle/cat.png");
	clip = ClippingNode::create(stencil);
	clip->setAlphaThreshold(1.0f);
	clip->addChild(cat);
	clip->setPosition(visibleSize / 2);
	this->addChild(clip);
	//label 顯示透明度 即 AlphaThreshold
	label = Label::createWithBMFont("BeamTitle/bitmapFontTest2.fnt", "1.0f");
	label->setScale(0.5f);
	label->setPosition(Vec2(visibleSize.width / 2, visibleSize.height / 5));
	this->addChild(label);
	return true;
}
void BeamTitle::sliderEvent(Ref *pSender, Slider::EventType type){
	if (type == Slider::EventType::ON_PERCENTAGE_CHANGED)
	{
		Slider* slider = dynamic_cast<Slider*>(pSender);
		int percent = slider->getPercent();	
		clip->setAlphaThreshold(1.0f*percent / 100);
		char str[30];
		sprintf(str, "AlphaThresHold=%f", 1.0f*percent / 100);
		label->setString(str);
		printf("AlphaThresHold=%f", clip->getAlphaThreshold());
	}
}