Hi, sorry if it’s been asked before (I searched but couldn’t find anything), I’ve been having problems with the text in my CCLabelTTF looking all blurry and messed up, even with simple fonts like “arial”. I’ve tried doing calling setAliasTexParameters() and it gets me the opposite effect, a very blocky and pixelated text. Is there any way to fix this and keep the antialiasing but maybe not as blurry?
This is how it looks on my screen:
first row is with setAliasTexParameters
second row is with setAntiAliasTexParameters
third row is how it should hopefully look
If you do, so there are bad news: you need to hack CCLabelTTF and use it carefully after this hack. CCLabelTTF internally renders whole text to one texture, and uses it later (when you change label text, texture generated from scratch). Texture generated in design size, and OpenGL just scales it to real size: fonts become blurry.
So either use design size that matches screen size (i.e just do not set design size) or
* create child CCSprite inside CCLabelTTF;
* reimplement CCNode::draw() method in CCLabelTTF::draw()without calling superclass method: you should do nothing in CCLabelTTF::draw() and just setup child CCSprite correctly: it will be drawn instead;
* in CCLabelTTF::updateTexture() you should create texture measured in screen size, not design size, and create child CCSprite from this texture; add this as child node to CCLabelTTF and don’t forget to call child->setScaleX(), child->setScaleY();
* finally you can also override methods like CCRGBProtocol::setColor() or CCSprite::getTexture() in order to redirect setters/getters to child sprite; don’t forget to scale rectangles and sizes by multiplying it to difference between design and real size.
Hmm yeah I think I get what you’re saying, but that seems a bit over my level since I’m just a cocos2d-x newbie, for now at least.
I’m actually working with a contentScaleFactor of 1 since on Windows my designResolutionSize is for now the same as the window size (1024x768), so I’m not 100% sure that’s the issue, though.
Any update to this? I was using a >1 year old version of cocos2d-html5 and the ttf labels were not blurry. Then a few months ago I updated to the latest version and, after some minor fixes to get it working again, the text was blurry - without any modification of that code from my part. My code doesn’t use .setDesignResolutionSize() .
When I started to use design size, I got the same problem.
Thank you very much for telling us the reason and how to solve it, but unfortunately I did not grasp what to do.
It will be very helpful to the community if you kindly posted more details.
I just fixed it with a pretty simple hack, though not ideal will do the trick for now. Create your label with the font at x2 size and then scale the label to 0.5 to get it back to its normal size. See my screenshot for the before and after results.
You could create with larger sizes (and scale back down appropriately) but remember larger sizes will create labels that take more memory as they render larger to textures, along with this note that the size of the label is limited depending on the device, see [[http://www.cocos2d-x.org/wiki/Max_size_of_textures_in_cocos2d-x_depends_on_each_platform]]