cocos2d-x 利用CCLabelTTF製作文字描邊與陰影效果的實現方法
阿新 • • 發佈:2019-01-06
感謝點評與關注,歡迎轉載與分享。
勤奮努力,持之以恆!
方法一:
cocos2d-x 已經為我們封裝好了,方法就在類CCLabelTTF裡面。
/** enable or disable shadow for the label */ void enableShadow(const CCSize &shadowOffset, float shadowOpacity, float shadowBlur, bool mustUpdateTexture = true); /** disable shadow rendering */ void disableShadow(bool mustUpdateTexture = true); /** enable or disable stroke */ void enableStroke(const ccColor3B &strokeColor, float strokeSize, bool mustUpdateTexture = true); /** disable stroke */ void disableStroke(bool mustUpdateTexture = true);
方法二:自己實現
在方法一達不到效果的情況下就只能自己實現了。
.h檔案
#ifndef __HELLOWORLD_SCENE_H__ #define __HELLOWORLD_SCENE_H__ #include "cocos2d.h" USING_NS_CC; using namespace std; class HelloWorld : public CCLayer { public: virtual bool init(); static CCScene* scene(); CREATE_FUNC(HelloWorld); //給文字新增描邊 CCLabelTTF* textAddStroke(const char* string, const char* fontName, float fontSize,const ccColor3B &color3,float lineWidth); //新增陰影 CCLabelTTF* textAddShadow(const char* string, const char* fontName, float fontSize,const ccColor3B &color3,float shadowSize,float shadowOpacity); //既新增描邊又新增陰影 CCLabelTTF* textAddOutlineAndShadow(const char* string, const char* fontName, float fontSize,const ccColor3B &color3,float lineWidth,float shadowSize,float shadowOpacity); }; #endif // __HELLOWORLD_SCENE_H__
.cpp檔案
#include "HelloWorldScene.h" #include "SimpleAudioEngine.h" using namespace cocos2d; using namespace CocosDenshion; CCScene* HelloWorld::scene() { CCScene *scene = CCScene::create(); HelloWorld *layer = HelloWorld::create(); scene->addChild(layer); return scene; } bool HelloWorld::init() { if ( !CCLayer::init() ) { return false; } CCSize size = CCDirector::sharedDirector()->getWinSize(); //建立個背景 CCLayerColor* whiteLayer = CCLayerColor::create(ccc4(0, 205, 205, 255), size.width, size.height); this->addChild(whiteLayer); //建立描邊 CCLabelTTF* outline = textAddStroke("描邊 Stroke", "Arial", 40, ccWHITE, 1); outline->setPosition(ccp(size.width*0.5, size.height*0.7)); this->addChild(outline); //建立陰影 CCLabelTTF* shadow = textAddShadow("陰影 Shadow", "Arial", 40, ccWHITE, 2, 200); shadow->setPosition(ccp(size.width*0.5, size.height*0.5)); this->addChild(shadow); //建立描邊加陰影 CCLabelTTF* outlineShadow = textAddOutlineAndShadow("描邊加陰影 OutlineShadow", "Arial", 40, ccWHITE, 1, 4, 200); outlineShadow->setPosition(ccp(size.width*0.5, size.height*0.3)); this->addChild(outlineShadow); return true; } /* 製作文字描邊效果是很簡單的,我們寫好一段文字之後,也就是創建出一個CCLabelTTF,稱之為正文CCLabelTTF。然後再創建出4個CCLabelTTF,顏色為黑色,大小同正文CCLabelTTF相同, 稱之為描邊CCLabelTTF。說到這大家可能已經明白了,沒錯,就是把4個描邊CCLabelTTF放於正文CCLabelTTF的下面,分別於左右上下與正文CCLabelTTF錯開,這樣描邊效果就實現啦。。 *string 文字 *fontName 文字字型型別 *fontSize 文字大小 *color3 文字顏色 *lineWidth 所描邊的寬度 */ CCLabelTTF* HelloWorld::textAddStroke(const char* string, const char* fontName, float fontSize,const ccColor3B &color3,float lineWidth) { //正文CCLabelTTF CCLabelTTF* center = CCLabelTTF::create(string, fontName, fontSize); center->setColor(color3); //描邊CCLabelTTF 上 CCLabelTTF* up = CCLabelTTF::create(string, fontName, fontSize); up->setColor(ccBLACK); up->setPosition(ccp(center->getContentSize().width*0.5, center->getContentSize().height*0.5+lineWidth)); center->addChild(up,-1); //描邊CCLabelTTF 下 CCLabelTTF* down = CCLabelTTF::create(string, fontName, fontSize); down->setColor(ccBLACK); down->setPosition(ccp(center->getContentSize().width*0.5, center->getContentSize().height*0.5-lineWidth)); center->addChild(down,-1); //描邊CCLabelTTF 左 CCLabelTTF* left = CCLabelTTF::create(string, fontName, fontSize); left->setPosition(ccp(center->getContentSize().width*0.5-lineWidth, center->getContentSize().height*0.5)); left->setColor(ccBLACK); center->addChild(left,-1); //描邊CCLabelTTF 右 CCLabelTTF* right = CCLabelTTF::create(string, fontName, fontSize); right->setColor(ccBLACK); right->setPosition(ccp(center->getContentSize().width*0.5+lineWidth,center->getContentSize().height*0.5)); center->addChild(right,-1); return center; } /* 給文字新增陰影,一看就懂的。。。 *string 文字 *fontName 文字字型型別 *fontSize 文字大小 *color3 文字顏色 *shadowSize 陰影大小 *shadowOpacity 陰影透明度 */ CCLabelTTF* HelloWorld::textAddShadow(const char* string, const char* fontName, float fontSize,const ccColor3B &color3,float shadowSize,float shadowOpacity) { CCLabelTTF* shadow = CCLabelTTF::create(string, fontName, fontSize); shadow->setColor(ccBLACK); shadow->setOpacity(shadowOpacity); CCLabelTTF* center = CCLabelTTF::create(string, fontName, fontSize); center->setColor(color3); center->setPosition(ccp(shadow->getContentSize().width*0.5-shadowSize, shadow->getContentSize().height*0.5+shadowSize)); shadow->addChild(center); return shadow; } //既新增描邊又新增陰影 CCLabelTTF* HelloWorld::textAddOutlineAndShadow(const char* string, const char* fontName, float fontSize,const ccColor3B &color3,float lineWidth,float shadowSize,float shadowOpacity) { CCLabelTTF* center = textAddStroke(string, fontName, fontSize, color3, lineWidth); CCLabelTTF* shadow = CCLabelTTF::create(string, fontName, fontSize); shadow->setPosition(ccp(center->getContentSize().width*0.5+shadowSize, center->getContentSize().height*0.5-shadowSize)); shadow->setColor(ccBLACK); shadow->setOpacity(shadowOpacity); center->addChild(shadow,-1); return center; }
效果如圖: