Cocos2dx 3.0 transition article (21) since the Label has been backed up by freeType...

Source: Internet
Author: User

Before cocos2dx 3.0, we always used CCLabelTTF, CCLabelBMFont, and CCLabelAtlas to create text labels,But! After version 3.0 is released...Do you feel trembling again when you see this? Don't be afraid. What I want to say is:After version 3.0 is released, these labels can also be used, but we have a better choice.

Cocos2dx3.0 adds a new text tag, which is different from the following:Use freetype to make it have the same visual effect on different platforms; because of the faster cache proxy, its rendering will be faster; it also provides features such as painting edges and shadows.


So because of the Label, I decided to leave abelTTF and LabelBMFont (Do you have guessed it at the beginning ?)
---------------------------------------------------

List of frequently-used interfaces (because many interfaces are the same as LabelTTFT, I will list some "heterogeneous" interfaces I know ")

// Create a common text label. The effect is the same as that of CCLabelTTF: create. What is TTFConfig? The following describes static Label * create (const std: string & text, const std: string & fontName, float fontSize, const Size & dimensions = Size: ZERO, export hAlignment = TextHAlignment: LEFT, TextVAlignment vAlignment = TextVAlignment: TOP); // create a Label by reading TTFConfig configuration, static Label * createWithTTF (const TTFConfig & ttfConfig, const std: string & text, TextHAlignment alignment = TextHAlignment: LEFT, int lineWidth = 0); // use. create tags using fnt, such as CCLabelBMFont: create (); static Label * createWithBMFont (const std: string & bmfontFilePath, const std: string & text, const TextHAlignment & alignment = TextHAlignment: LEFT, int lineWidth = 0, const Point & imageOffset = Point: ZERO); // use .png to create tags, similar to CCLabelAtlas :: create (); static Label * createWithCharMap (const std: string & charMapFile, int itemWidth, int itemHeight, int startCharMap); virtual void enableShadow (const Color3B & shadowColor = Color3B :: BLACK, const Size & offset = Size (2,-2), float opacity = 0.75f, int blurRadius = 0); virtual void enableOutline (const Color4B & outlineColor, int outlineSize =-1); // only supports TTFvirtual void enableGlow (const Color3B & glowColor); // only supports TTF virtual void disableEffect (); // there are four types of special effects to cancel: enum class LabelEffect {NORMAL, // general label (pure, out of the low-level interesting label) OUTLINE, // literature and art labels (with stroke) SHADOW, // 2B labels (with SHADOW) GLOW // tuhao labels (with fluorescence )};
Here is a new thing: TTFConfig

// TTFConfig is a struct that contains common configurations for creating a ttf label, as shown below: typedef struct _ ttfConfig {std: string fontFilePath; // file path int fontSize; // font size. The default value is 12 GlyphCollection glyphs. // the character set used. The default value is DYNAMIC const char * customGlyphs. // Haha bool distanceFieldEnabled. // my understanding of this is: is text compact? The default value is falseint outlineSize; // font stroke size. The default value is 0 // constructor... // Note: When the outlineSize initialization value is greater than 0, distanceFieldEnabled is false} TTFConfig; // there are four types of GlyphCollection: enum class GlyphCollection {DYNAMIC, NEHE, ASCII, CUSTOM };

The following describes the Label usage.

1. Use. ttf
1) Create

TTFConfig config2 ("fonts/Marker Felt. ttf ", 30); // initialize TTFConfig. The first parameter is the font path, and the second parameter is the font size. auto label2 = Label: createWithTTF (config2," createWithTTF ", textHAlignment: LEFT); // create a label and label2-> setPosition (Point (visibleSize. width/2,300); label2-> setAnchorPoint (Point: ANCHOR_MIDDLE); // set the anchorcenter this-> addChild (label2, 2 );
Of course, you can also use a Label to create a common Label. The effect is the same as that of using the CCLabelTTF: create () Label.

auto label4 = Label::create("create","Marker Felt",30);//
Effect:


2) The font looks compact, that is, set distanceFieldEnabled = true.
Directly modify distanceFieldEnabled in config as follows:

TTFConfig config2 ("fonts/Marker Felt. ttf", 30, GlyphCollection: DYNAMIC, nullptr, true); // modify the fifth parameter of config to true.


3) set glow (fluorescence) effect (I don't know how to describe glow ...)

Label2-> enableGlow (Color3B: GREEN); // The fluorescent color is GREEN.
Effect. Note that distanceFieldEnabled must be set to true to display the fluorescent effect. Otherwise, the effect cannot be displayed.


4) set stroke

Label2-> enableOutline (Color4B (255,125, 0,255), 8); // The first parameter is the stroke color, and the second parameter is the stroke size.
Effect. Note: after the stroke effect is used, distanceFieldEnabled will change to false, which means that the fluorescent effect cannot be displayed when the stroke is available (I think too much ...)


5) set the shadow.

Label2-> enableShadow (Color3B: RED, Size (2,-2), 0.2, 0.5); // The first parameter is the shadow color, the second parameter is the shadow coordinate relative to the label, the third parameter sets the transparency, and the fourth parameter is related to the Blur.


2. Use the. fnt label
1) Create

auto label3 = Label::createWithBMFont("fonts/bitmapFontTest.fnt", "createWithBMFont");label3->setPosition(Point(visibleSize.width/2,250));label3->setAnchorPoint(Point::ANCHOR_MIDDLE);this->addChild(label3,2);label3->enableShadow();


2) set the shadow (stroke side and fluorescence can only be used on. ttf)

label3->enableShadow(Color3B::RED);
The effect can be compared.


32.16.png
The following figure shows how to use this image:


1) Create

Auto label4 = Label: createWithCharMap ("fonts/costFont.png", '/'); // The parameters are path; width and height of each character, start character label4-> setPosition (Point (visibleSize. width/2,200); label4-> setAnchorPoint (Point: ANCHOR_MIDDLE); label4-> setString ("10 "); // set the displayed content to "10" this-> addChild (label4, 2 );


2) Set shadow

label4->enableShadow(Color3B::RED);


4. Cancel all special effects
Label-> disableEffect (); // cancel all special effects


Well, I will introduce it here. For specific usage, refer to testCpp.

Although the content of this blog post is relatively simple, it is extremely energy-consuming ....

Respect Original, reprinted please indicate Source: http://blog.csdn.net/start530/article/details/22313087

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.