cocos2dx 3.x Label使用
发布时间:2020-12-14 18:52:38 所属栏目:百科 来源:网络整理
导读:cocos2dx cc.label字体颜色 在3.x中,Label支持四种方式的标签创建。并新增了阴影Shadow、轮廓Outline、发光Glow效果的支持。还支持文字内容的行间距、文字间距、自动换行的设置。 创建系统原生字体API : createWithSystemFont 创建TTF : createWithTTF (原
cocos2dx cc.label字体颜色
在3.x中,Label支持四种方式的标签创建。并新增了阴影Shadow、轮廓Outline、发光Glow效果的支持。还支持文字内容的行间距、文字间距、自动换行的设置。
> 创建系统原生字体API : createWithSystemFont > 创建TTF : createWithTTF (原LabelTTF) > 创建CharMap : createWithCharMap (原LabelAtlas) > 创建BMFont : createWithBMFont (原LabelBMFont) > Label的属性与方法 > 文字效果渲染 : Shadow、Outline、Glow > 对齐方式 : TextHAlignment、TextVAlignment > Label的尺寸大小 > 自动换行 > 行间距、文字间距 > 单独设置某个字符 关于图片资源,请在cocos2dx给出的官方样例cpp-tests中寻找。 【createWithSystemFont】 创建系统原生字体的API。 创建方式如下: // staticLabel* createWithSystemFont( conststd::string& text,//字符串内容 conststd::string& font,//字体(字体名称、或字体文件) floatfontSize,//字号 constSize& dimensions = Size::ZERO,//label的尺寸大小,默认不设置尺寸 TextHAlignment hAlignment = TextHAlignment:EFT,//水平对齐方式,默认左对齐:EFT TextVAlignment vAlignment = TextVAlignment::TOP //垂直对齐方式,默认顶部 ::TOP ); 使用举例: //使用系统的字体名称 “Arial” 来创建 Label* lb1 = Label::createWithSystemFont(“123abc”,“Arial”,24); 【createWithTTF】 创建TTF的方式有以下两种: > 方式一:与2.x中LabelTTF的创建类似,不过使用的fontFile必须为字体文件。 > 方式二:通过TTF的配置信息数据结构TTFConfig来创建。 1、方式一:与System Font创建类似 注:区别在于fontFile必须为字体文件(如”*.ttf”),即不支持使用系统字体名称来创建。 staticLabel* createWithTTF( conststd::string& fontFile,//必须为字体文件(如”*.ttf”) TextVAlignment vAlignment = TextVAlignment::TOP 2、方式二:通过TTFConfig配置来创建 2.1、TTFConfig配置 typedefstruct_ttfConfig { std::string fontFilePath; //字体文件路径,如 “fonts/Arial.ttf” intfontSize; //字体大小,默认”12″ GlyphCollection glyphs; //使用的字符集,默认”DYNAMIC” constchar*customGlyphs; booldistanceFieldEnabled; //是否让字体紧凑,默认false intoutlineSize; //字体轮廓大小,默认”0″ //构造函数 _ttfConfig( constchar* filePath = “”,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> intsize = 12,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> constGlyphCollection& glyphCollection = GlyphCollection:YNAMIC,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> constchar*customGlyphCollection = nullptr,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> booluseDistanceField = false,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> intoutline = 0 ); }TTFConfig; 2.2、使用TTFConfig创建TTF constTTFConfig& ttfConfig,//TTFConfig配置 TextHAlignment alignment = TextHAlignment:EFT,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> intmaxLineWidth = 0 //最大文本行宽,0表示不设置。可用于自动换行只用 使用举例: TTFConfig ttfConfig; ttfConfig.fontFilePath = “fonts/Marker Felt.ttf”; //必须配置 ttfConfig.fontSize = 12; ttfConfig.distanceFieldEnabled = false; ttfConfig.outlineSize = 0; ttfConfig.glyphs = GlyphCollection:YNAMIC; ttfConfig.customGlyphs = nullptr; //使用TTFConfig配置,来创建TTF Label* lb3 = Label::createWithTTF(ttfConfig,“123abc”); 【createWithCharMap】 CharMap的用法与2.x中的LabelAtlas是一样的,一般用来显示数字。不过它也可以用来显示其他字符,如英文字符。 字体文件资源一般来自一张.png图片,或.plist文件。 注:图片中每个字符的大小必须是固定的,若要改变字体大小,只能通过setScale放缩来实现。 创建CharMap有三种方式: > 使用.png图片创建 > 使用纹理Texture2D创建 > 使用.plist创建 从图片中从左到右,一块一块截取。从字符startCharMap开始一一对应。 第一块小图片对应字符startCharMap;第二块小图片对应字符startCharMap+1;第三块对应startCharMap+2 …… 以此类推。 注:startCharMap为ASCII码,即:数字 ‘0’ 为48。 //charMapFile : 字符资源图片png //itemWidth : 每个字符的宽 //itemHeight : 每个字符的高 //startCharMap : 图片第一个是什么字符 staticLabel* createWithCharMap(conststd::string& charMapFile,intitemWidth,intitemHeight,intstartCharMap); staticLabel* createWithCharMap(Texture2D* texture,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> staticLabel* createWithCharMap(conststd::string& plistFile); 0、字符图片资源 digit.png:200*20(每个数字20*20)。 1、使用.png创建 //create 字符图片.png,每个字符宽,高,起始字符 Label* lb4 = Label::createWithCharMap(“fonts/digit.png”,20,‘0’); lb4->setString(“123456″); //设置字符串内容 2、使用Texture2D创建 使用方法实际上与.png是类似的。 //创建图片纹理Texture2D Texture2D* texture = TextureCache::getInstance()->addImage(“fonts/digit.png”); Label* lb5 = Label::createWithCharMap(texture,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> lb5->setString(“123456″); //设置字符串内容 3、使用.plist创建 在digit.plist里需要配置:用到的字符图片资源.png,每个字符的宽、高,起始字符。 如下所示: <?xmlversion=”1.0″encoding=”UTF-8″?> <!DOCTYPE plist PUBLIC “-//Apple//DTD PLIST 1.0//EN” “http://www.apple.com/DTDs/PropertyList-1.0.dtd”> <plistversion=”1.0″> <dict> <key>version</key> <!– plist版本 –> <integer>1</integer> <key>textureFilename</key> <!– 字符图片资源: digit.png –> <string>digit.png</string> <key>itemWidth</key> <!– 每个字符的宽: 20 –> <integer>20</integer> <key>itemHeight</key> <!– 每个字符的高: 20 –> <key>firstChar</key> <!– 起始字符 : ‘0’ –> <integer>48</integer> </dict> </plist> 使用plist创建CharMap的方法: //plist的配置信息,如上所示 Label* lb6 = Label::createWithCharMap(“fonts/digit.plist”); lb6->setString(“123456″); 【createWithBMFont】 BMFont的用法与2.x中的LabelBMFont是一样的。 这个类使用之前,需要添加好字体文件,包括一个图片文件(*.png)和一个字体坐标文件(*.fnt),这两个文件名称必须一样。可以下载一个fnt编辑工具来自定义字体。 值得注意的是: > 在2.x中,可以使用 getChildByTag(i) 来获取第i个字符,对其单独设置属性、动作等。 > 在3.x中,则是使用 getLetter(i) ,而不再是 getChildByTag(i) 。 这个类也没办法指定字体的字号大小,需要用setScale来缩放调整大小。 staticLabel* createWithBMFont( conststd::string& bmfontFilePath,//字体文件.font constTextHAlignment& alignment = TextHAlignment:EFT,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> intmaxLineWidth = 0,97); font-family:'microsoft yahei'; font-size:14px; line-height:20px"> constVec2& imageOffset = Vec2::ZERO //字符图片的起始左上角坐标。一般不要设置这个参数,因为坐标的配置均已在.font里完成 使用举例: Label* lb7 = Label::createWithBMFont(“bitmapFontTest.fnt”,“123abc”,TextHAlignment:EFT); 【Label的属性与方法】 Label继承于: > SpriteBatchNode : 用于加快字体的渲染速度。 > LabelProtocol : 用于设置Label的字符串内容。 主要函数如下: classCC_DLL Label : publicSpriteBatchNode,publicLabelProtocol { /** * 字体设置 * – setSystemFontName : 字体(字体名字、字体文件) * – setSystemFontSize : 字体大小 * – setString : 字符串内容 * – setTextColor : 文字内容颜色 **/ //设置System Font类型的字体(字体名字、字体文件) //设置System Font类型的字体大小 //请不要用于其他Label类型!(TTF、CharMap、BMFont) virtualvoidsetSystemFontName(conststd::string& systemFont); virtualvoidsetSystemFontSize(floatfontSize); virtualconststd::string& getSystemFontName() const{ return_systemFont;} virtualfloatgetSystemFontSize() const{ return_systemFontSize;} //改变字符串内容并重新渲染 //注:如果你没有为Label设置TTF/BMFont/CharMap,会产生很大的开销 virtualvoidsetString(conststd::string& text) override; virtualconststd::string& getString() constoverride { return_originalUTF8String; } //设置文字颜色,仅支持TTF和System Font //注:区别 Node节点的颜色 // Node ::setColor : Color3B // Label::setTextColor : Color4B virtualvoidsetTextColor(constColor4B &color); constColor4B& getTextColor() const{ return_textColor; } * 获取Label的某个字符 * – getLetter * – 不支持System Font //不支持System Font virtualSprite* getLetter(intlettetIndex); * 文字渲染效果 * – Shadow : 阴影 * – Outline : 轮廓,仅支持TTF * – Glow : 发光,仅支持TTF //阴影Shadow(阴影颜色,相对Label的偏移,模糊度) //注: 其中blurRadius在3.2中并未实现 virtualvoidenableShadow(constColor4B& shadowColor = Color4B::BLACK,constSize &offset = Size(2,-2),intblurRadius = 0); //轮廓Outline,仅支持TTF(轮廓颜色,轮廓粗细) virtualvoidenableOutline(constColor4B& outlineColor,intoutlineSize = -1); //发光Glow,仅支持TTF virtualvoidenableGlow(constColor4B& glowColor); //取消阴影/轮廓/发光渲染效果 virtualvoiddisableEffect(); * 对齐方式 * > TextHAlignment : 水平对齐方式 * – TextHAlignmentEFT : 左对齐 * – TextHAlignment:CENTER : 居中对齐,默认 * – TextHAlignment:RIGHT : 右对齐 * > TextVAlignment : 垂直对齐方式 * – TextVAlignment::TOP : 顶部,默认 * – TextVAlignment::CENTER : 中心 * – TextVAlignment::BOTTOM : 底部 //设置对齐方式 voidsetAlignment(TextHAlignment hAlignment) { setAlignment(hAlignment,_vAlignment);} voidsetAlignment(TextHAlignment hAlignment,TextVAlignment vAlignment); TextHAlignment getTextAlignment() const{ return_hAlignment;} //设置水平对齐方式 voidsetHorizontalAlignment(TextHAlignment hAlignment) { setAlignment(hAlignment,_vAlignment); } TextHAlignment getHorizontalAlignment() const{ return_hAlignment; } //设置垂直对齐方式 voidsetVerticalAlignment(TextVAlignment vAlignment) { setAlignment(_hAlignment,vAlignment); } TextVAlignment getVerticalAlignment() const{ return_vAlignment; } * Label尺寸大小 * – setLineBreakWithoutSpace : 开启自动换行功能 * – setMaxLineWidth : 文字内容的最大行宽 * – setWidth : Label尺寸大小,宽 * – setHeight : Label尺寸大小,高 * – setDimensions : Label尺寸大小 //是否开启自动换行功能 voidsetLineBreakWithoutSpace(boolbreakWithoutSpace); //最大行宽,内容超过MaxLineWidth,就会自动换行 //前提条件: 仅在width==0时,起作用。 // > width == 0; // > setMaxLineWidth(lineWidth); // > setLineBreakWithoutSpace(true); //它的效果与下面是类似的. // > setWidth(lineWidth); //只是width==0时,就无法设置文本的对齐方式了. voidsetMaxLineWidth(unsigned intmaxLineWidth); unsigned intgetMaxLineWidth() { return_maxLineWidth;} //设置Label的尺寸大小 //可以理解为Label的文本框大小 //当setLineBreakWithoutSpace(true)时,内容超过width,会自动换行 //并且内容支持文本的对齐方式 //注:设置尺寸大小,使用的是setDimensions,而不是setContentSize ! voidsetWidth(unsigned intwidth) { setDimensions(width,_labelHeight); } voidsetHeight(unsigned intheight){ setDimensions(_labelWidth,height); } voidsetDimensions(unsigned intwidth,unsigned intheight); unsigned intgetWidth() const{ return_labelWidth; } unsigned intgetHeight() const{ return_labelHeight; } constSize& getDimensions() const{ return_labelDimensions; } * v3.2 新增 * – setLineHeight : 设置行间距 * – setAdditionalKerning : 设置文字间距 * – getStringLength : 字符串内容长度 */ //设置行间距,不支持system font voidsetLineHeight(floatheight); floatgetLineHeight() const; //设置文字间距,不支持system font voidsetAdditionalKerning(floatspace); floatgetAdditionalKerning() const; //获取Label的字符串内容长度 intgetStringLength() const; * 重写Node父类的方法 * – setBlendFunc : 混合模式 * – setScale : 放缩字体大小 * – addChild : 添加子节点 * – getDescription : 显示Label的描述 //设置颜色混合模式 virtualvoidsetBlendFunc(constBlendFunc &blendFunc) override; //放缩字体大小(一般用于CharMap、BMFont) virtualvoidsetScale(floatscale) override; virtualvoidsetScaleX(floatscaleX) override; virtualvoidsetScaleY(floatscaleY) override; virtualfloatgetScaleX() constoverride; virtualfloatgetScaleY() constoverride; //添加子节点 virtualvoidaddChild(Node * child,intzOrder=0,inttag=0) override; virtualvoidsortAllChildren() override; //Label描述 virtualstd::string getDescription() constoverride; }; 【文字渲染效果】 支持三种渲染效果: > Shadow : 阴影 > Outline : 轮廓,仅支持TTF > Glow : 发光,仅支持TTF 注:其中Outline与Glow两个效果,只会作用一个。即无法一起使用。 Label* lb = Label::createWithTTF(“123abc”,“fonts/Marker Felt.ttf”,50); lb->setPosition(visibleSize / 2); this->addChild(lb); lb->enableShadow(Color4B::GREEN,Size(10,10)); //阴影 lb->enableOutline(Color4B::RED,3); //轮廓 //lb->enableGlow(Color4B::GREEN); //发光 //取消阴影、轮廓、发光效果 //lb->disableEffect(); 如图所示: 【对齐方式】 > TextHAlignment : 水平对齐方式 – TextHAlignmentEFT : 左对齐 – TextHAlignment:CENTER : 居中对齐,默认 – TextHAlignment:RIGHT : 右对齐 > TextVAlignment : 垂直对齐方式 – TextVAlignment::TOP : 顶部,默认 – TextVAlignment::CENTER : 中心 – TextVAlignment::BOTTOM : 底部 仅在设置了Label的尺寸大小setDimensions(width,height),大于显示的字符串内容的尺寸大小,才会起作用。 对齐方式举例,如下几张图片所示: 对齐方式为: > TextHAlignmentEFT > TextVAlignment::TOP 【自动换行】 在3.x中,自动换行有两种方式。(当然你也可以使用C++里的转移字符’n’进行手动换行) > 利用lb->setLineBreakWithoutSpace(true),来支持自动换行功能。 > 1. 利用 setMaxLineWidth(maxLineWidth),来控制自动换行。 > 2. 利用 setDimensions(width,height),来控制自动换行。 1、利用setMaxLineWidth 设置每行显示文字的最大宽度。 注:这种方法仅在Label width == 0的情况下,才会有效。 使用方法: lb->setLineBreakWithoutSpace(true); lb->setMaxLineWidth(120); //最大宽度120 如图: 2、利用setDimensions lb->setWidth(80); //设置Label尺寸宽80 lb->setMaxLineWidth(120); //设置了Label width,这个就无效了 【文字间距】 间距的调整,是在 v3.2 之后才出现的。可以设置文本内容的行间距与文字间距。 注:不支持System Font。 > setLineHeight : 设置行间距 > setAdditionalKerning : 设置额外文字间距 lb->setLineHeight(80); lb->setAdditionalKerning(10); 图解: 【单独设置某个字符】 学过2.x中的LabelBMFont的同学,应该知道这个是怎么回事吧? 在3.x中,使用TTF、CharMap、BMFont创建的文字标签,其字符串内容的每个字符都是一个Sprite精灵图片,可以对其进行单独的设置。如精灵放缩、执行动作等。 > lb->getStringLength() : 获取字符串内容的总长度 > lb->getLetter(i) : 获取第i个位置上的字符 //获取字符串总长度,length = 6 CCLOG(“%d”,lb->getStringLength()); //获取第1个字符 Sprite* letter1 = lb->getLetter(1); letter1->setColor(Color3B::GREEN); //设置颜色 letter1->setScale(2.0f); //放缩 //获取第4个字符 Sprite* letter4 = lb->getLetter(4); letter4->setColor(Color3B::RED); //设置颜色 letter4->runAction(RepeatForever::create(RotateBy::create(1.0f,90))); //执行旋转动作 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |