cocos2d-x 利用CCLabelTTF制作文字描边与阴影效果的实现方法


//
// myttf.h//
// Created by 王天宇 on 14-6-12.
//
//

#ifndef ____SLG__myttf__
#define ____SLG__myttf__

#include <iostream>
#include "cocos2d.h"
USING_NS_CC;
using namespace std;

class myttf
{
public:
//给文字添加描边
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 /* defined(____SLG__myttf__) */


//
// myttf.cpp//
// Created by 王天宇 on 14-6-12.
//
//

#include "myttf.h"
using namespace cocos2d;

/*
制作文字描边效果是很简单的,我们写好一段文字之后,也就是创建出一个CCLabelTTF,称之为正文CCLabelTTF。然后再创建出4个CCLabelTTF,颜色为黑色,大小同正文CCLabelTTF相同,
称之为描边CCLabelTTF。说到这大家可能已经明白了,没错,就是把4个描边CCLabelTTF放于正文CCLabelTTF的下面,分别于左右上下与正文CCLabelTTF错开,这样描边效果就实现啦。。

*string 文本
*fontName 文本字体类型
*fontSize 文本大小
*color3 文本颜色
*lineWidth 所描边的宽度
*/
CCLabelTTF* myttf::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* myttf::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* myttf::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;
}

cocos2d-x 利用CCLabelTTF制作文字描边与阴影效果的实现方法

时间: 2024-10-17 03:33:25

cocos2d-x 利用CCLabelTTF制作文字描边与阴影效果的实现方法的相关文章

CSS3 利用 text-shadow 实现文字描边效果

实现效果: 效果代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> </head> <style> h2{color:#fff;text-shadow:1px 0px 0px pink,-1px 0px 0px pink,0px 1px 0px pink,0p

【PhotoShop】利用PS制作唯美咖啡泡

难得喝杯咖啡,怎么能不拍张了(黑咖啡太苦经常喝实在受不了!) 得到如下图 看着还不错,可是总感觉空空荡荡的,所以就拿来PS练手了.最终效果图如下: 下面讲下制作过程: 首先是给照片加下咖啡泡的效果,找一张有咖啡泡的咖啡~然后选区把咖啡泡部分抠出来 把图片抠出来调整大小适应杯子,然后自然是选择混合选项让他更逼真了. 我这里选择的是点光,当然可以根据个人图片效果选择了.为了让图片更加逼真,我为该图层创建蒙版,并且用黑色画笔涂抹阴暗处(让阴暗处更阴暗)而显得有层次感.效果如图: 现在在加点文字吧.下面

利用CSS制作静态网页的注意事项

利用CSS制作静态网页主要是在<head>里面使用外联CSS文件来赋予网页样式 首先用div分区块,了解网页布局,脑子里面有个大概的页面布局 目前学习写的几种的网页布局可以分为以下几种情况: 1.页面中间 centen ,两边留白 :直接测量 centen 内容的宽度和高度,利用 maigin:auto 让内容居中即可: 2.页面顶部 head 满页面内容 ,下面centen 居中 ,两边留白:head 宽度设为100%,中间centen 内容的宽度和高度,利用 maigin:auto 让内容

ps怎么给文字描边

在设计的时候,单一的文字,往往对人没有多少的吸引力,这就需要我们在文字上加一些文字特效,比如说外发光,描边,投影,等等.在这里我们详细的介绍一下文字的输入,和文字描边的怎么增加,删除的经验.(这些方法不只适用于文字,图片也可以的) 步骤阅读 百度经验:jingyan.baidu.com 工具/原料 电脑 photoshop 百度经验:jingyan.baidu.com 方法/步骤 1 首先我们要新建一个图层,文件>新建,建一个属于自己的文档. 步骤阅读 2 然后利用左侧的T(文字工具),输入自己

利用TabHost制作QQ客户端标签栏效果(低版本QQ)

学习一定要从基础学起,只有有一个好的基础,我们才会变得更加的perfect 下面小编将利用TabHost制作QQ客户端标签栏效果(这个版本的QQ是在前几年发布的)…. 首先我们看一下效果: 看到这个界面,刹那间一点喜悦感都没有了,不过对于我们学习程序的人来说,UI是一方面,代码也是一方面,今天讲述的是代码,所以我们就在此忽略UI吧 --------------------------------------------------------华丽分割线----------------------

利用Python制作王者荣耀出装小助手,引来了老板的注意!

导语 T_T并不玩这些游戏... 单纯来蹭个热点... 大概是因为蹭热点需要的技术含量比较低? 就这样吧~~~ 利用Python制作命令行版的王者荣耀出装小助手. Let's Go! 开发工具 Python版本:3.6.4 相关模块: requests模块: 以及一些Python自带的模块. 环境搭建 安装Python并添加到环境变量,pip安装需要的相关模块即可. 主要思路 爬的是<英雄联盟盒子>这个APP.用Fiddler抓包找到需要的Get请求地址即可... 不过显示的Get请求很长,在

ArcGIS利用DEM制作简单三维

利用DEM数据镶嵌后,矢量数据裁剪得到研究范围的DEM数据,在ARCScene中进行三维制作 ArcGIS利用DEM制作简单三维 点击学习我的系统教程哦

利用replaceChild制作简单的吞噬效果【jsDEMO】

[功能说明] 利用replaceChild制作简单的吞噬效果 [HTML代码说明] <ul class="list" id="list"> <li class="in">1</li> <li class="in">2</li> <li class="in">3</li> <li class="in"

WPF文字描边的解决方法

 由于项目原因,今天研究了一下午WPF的文字描边,网上这方面的资料奇少,搞了半天才发现强大的WPF原来不直接支持文字描边啊.最后求助于MSDN,找到了方案,和大家分享一下: 主要思路:用FormattedText将字符串转换为Geometry,再在重写的OnRender(DrawingContext drawingContext)方法中绘制Geometry.效果如图. 组件的主要属性: Text属性设置文字 Fill属性设置文本本身的画刷 Stroke属性是描边画刷 StrokeThickn