Black border of characters in CCLabelTTF?

While using CCLabelTTF, there is a black border around each characters(see the screenshot), why?
It is expected that all the non-transparent pixels are white(or the color specified). Is there any way to fix that?


screenshot.png (14.1 KB)

It does exist on win32, I will test it on the other platform!

Hi, I have tested this issue on android, no black border appeared. Maybe it just exists on win32? But I don’t know why. Maybe the DrawText(HDC dc…) function on windows is odd?

My colleague tested on android and also sees black border. I’ll ask him to test again.

We tested again on android and still have the problem.

We tried 2 different fonts (aharoni.ttf and num1.ttf) on 2 different devices(HTC G12 and MI One)。

OK, I will try it by using your font files.:slight_smile:

I have tested the fonts you offered on my device(Nexus S—Samsung I9023), it worked fine, and there is not black border appear.

I’m facing the same problem.

can the border be transparent:( ?

Timothy Zhang wrote:

While using CCLabelTTF, there is a black border around each characters(see the screenshot), why?
It is expected that all the non-transparent pixels are white(or the color specified). Is there any way to fix that?

hi,hava you resolved this problem??

No, I haven’t.

I marked this issue low priority, and am waiting for an official solution.
If it’s still not fixed at the end of next month, maybe I will try to create CCImage from strings and convert non-zero pixels to 0xFFFFFFFF one by one…

Just asking, is there any progress or a solution for this issue?

I solved this issue by adding the following line of code in CCTexture2D.cpp in the CCTexture2D::initWithData function:

glBlendFunc(GL_ONE, GL_ONE_MINUS_SRC_ALPHA);

Saul Howard wrote:

I solved this issue by adding the following line of code in CCTexture2D.cpp in the CCTexture2D::initWithData function:
>
glBlendFunc(GL_ONE, GL_ONE_MINUS_SRC_ALPHA);

Thanks. Unfortunately on Windows 8 and Windows Phone 8 there is no glBlendFunc. Who has the solution to solve this problem also for Windows (Phone) 8?

Anyone figured it out yet ?

In WP8 cocos uses freetype2 to generate font bitmap and them shader to paint it.

First problem is that alpha channel in CCFreeTypeFont is always on set on full opacity.
Go to CCFreeTypeFont class, method draw_bitmap.
Find line with “pBuffer[index**] = 255;" and modify it to "pBuffer[index**] = value;”.

Method should look like this:

void CCFreeTypeFont::draw_bitmap(unsigned char* pBuffer, FT_Bitmap*  bitmap, FT_Int x, FT_Int y)
{
    FT_Int  i, j, p, q;
    FT_Int  x_max = x + bitmap->width;
    FT_Int  y_max = y + bitmap->rows;

    for (i = x, p = 0; i < x_max; i++, p++)
    {
        for ( j = y, q = 0; j < y_max; j++, q++ )
        {
            if (i < 0 || j < 0 || i >= m_width || j >= m_height)
                continue;

            unsigned char value =  bitmap->buffer[q * bitmap->width + p];

            if(value > 0)
            {
                FT_Int index = (j * m_width * 4) + (i * 4);
                pBuffer[index++] = value;
                pBuffer[index++] = value;
                pBuffer[index++] = value;
                pBuffer[index++] = value;
           }
        }
    }  
}

Secondly (only for WP8 and Windows 8), to achieve final result, set CC_USE_LA88_LABELS to 0.
It’ll switch shader program to kCCShader_PositionTextureA8Color which will give you smooth antialiasing .

@up:

Your solution works perfectly on WP8, thanks!

Yes. works for me as well! GG

This patch fixes this problem with CCLabelTTF on Win32: https://github.com/cocos2d/cocos2d-x/pull/4885