EDN Admin
Well-known member
While I have made a topic like this in the past, this is from start to finish the most basic approach to bitmap font render. I am hoping someone can see what I am doing wrong here.<br/>
<br/>
Although this is a long post, if Bug#1 gets fixed, it could fix everything. This question deals with C# (Bug#1) and C++ (Bug#2, Bug#3).<br/>
<br/>
For bitmap font rendering I am doing two things<br/>
<br/>
1) Creating a bitmap that is the size 2056x2056 in C#. I am first drawing a character onto a 512x512 image, then I am resizing the image to 128. The reason I am doing this is so I may add affects to the text later. This also introduces Bug #1 (see below).<br/>
<br/>
2) Rendering an individual rectangle for each character (see Bug#2 and Bug#3).<br/>
<br/>
The problem I am having is rendering invidual characters in a sequence correctly. There will either be UVs issues, or letter spacing issues. Now onto the bugs<br/>
<br/>
Bug #1: Font Size<br/>
The font that I render onto the 512px graphic is 120. The size that the graphic will be resize to is 128, which is 4 times small. There for, I would expect the font size to be 30. After I save the bitmap, I will look at it in GIMP to investigate. One thing
I will do is draw a character from GIMP over a character in my bitmap. This will give interesting results, although I am not sure it is wrong or not. As you can see from the image below, the correct draw over is to have GIMP draw the character at "30
pt", however, if I draw it at "30px" it is significantly smaller. The reason why this is so important is because later in C++ I will set the map mode to "SetMapMode(dc,MM_TEXT);". Although, detailed by MSDN, MM_TEXT is "Each
logical unit is mapped to one device pixel".<br/>
<br/>
<img src=http://img641.imageshack.us/img641/2838/gimpsize.png><br/>
<br/>
It turns out that GIMP translates "30pt" to "40px". As a result, for my C++ code I will be creating fonts with size "40" as I am setting my MapMode to a pixel text setting. This is why it is so important that is bug gets fixed
first. If this bug were to get fixed, then it could fix bugs #1 and #2.<br/>
<br/>
My question to Bug #1, what is going wrong? Should I be setting the map mode to something else? I will draw the character to a 512px graphic, then resize the graphic. This is a critical step so I may do effects to the larger version of the character.<br/>
<br/>
Bug #2: UVs<br/>
Since I store my characters every 128 pixels, it is very easy to obtain the bitmap X/Y values for each character. However, I am not sure how far to advance the UVs to properly draw them. I tried basically doing something like Promit posted for AngelCode bitmap
font render, however, since I am not sure how they generate their values, I may be wrong here. You can see in the two images below that I am calculating my UVs wrong.<br/>
<br/>
My question to Bug#2, how can I correctly advance my UVs? There is nothing wrong with the way I find the bitmap X/Y, only how I move them for rendering.<br/>
<br/>
Bug #3: Letter placement<br/>
I am not sure how to correct move my characters or even correctly get the distance. Currently I just do "A +B + C". This map seem correct, however, if you look at the Arial image below, the "j" looks out of place inbetween the "n"
and "f". There is also what appears to be issues with "b" and "y" for Arial, along with some issues for Times New Roman.<br/>
<br/>
My question to Bug #3, how can I properly advance my characters?<br/>
<br/>
Arial Rendering:<br/>
<img src=http://img214.imageshack.us/img214/1706/arialbasicbad.png><br/>
<br/>
Times New Roman:<br/>
<img src=http://img716.imageshack.us/img716/5838/timesnewromanbasicbad.png><br/>
<br/>
It is worth noting that I am not interested in using any external libraries (such as FreeType), or any "hacks" to do this. I want to see this done correctly using the windows api. Doing either one of these is not up for discussion, if I wanted to
use them I could have been done with this a long time ago.<br/>
<br/>
Since the source tags in the board are broken, I will post the example source in pastebins.<br/>
<br/>
C# (Bitmap drawing) : http://pastebin.com/zpPPZVm0<br/>
C++ (Font rendering) : http://pastebin.com/mHrUatEb<br/>
View the full article
<br/>
Although this is a long post, if Bug#1 gets fixed, it could fix everything. This question deals with C# (Bug#1) and C++ (Bug#2, Bug#3).<br/>
<br/>
For bitmap font rendering I am doing two things<br/>
<br/>
1) Creating a bitmap that is the size 2056x2056 in C#. I am first drawing a character onto a 512x512 image, then I am resizing the image to 128. The reason I am doing this is so I may add affects to the text later. This also introduces Bug #1 (see below).<br/>
<br/>
2) Rendering an individual rectangle for each character (see Bug#2 and Bug#3).<br/>
<br/>
The problem I am having is rendering invidual characters in a sequence correctly. There will either be UVs issues, or letter spacing issues. Now onto the bugs<br/>
<br/>
Bug #1: Font Size<br/>
The font that I render onto the 512px graphic is 120. The size that the graphic will be resize to is 128, which is 4 times small. There for, I would expect the font size to be 30. After I save the bitmap, I will look at it in GIMP to investigate. One thing
I will do is draw a character from GIMP over a character in my bitmap. This will give interesting results, although I am not sure it is wrong or not. As you can see from the image below, the correct draw over is to have GIMP draw the character at "30
pt", however, if I draw it at "30px" it is significantly smaller. The reason why this is so important is because later in C++ I will set the map mode to "SetMapMode(dc,MM_TEXT);". Although, detailed by MSDN, MM_TEXT is "Each
logical unit is mapped to one device pixel".<br/>
<br/>
<img src=http://img641.imageshack.us/img641/2838/gimpsize.png><br/>
<br/>
It turns out that GIMP translates "30pt" to "40px". As a result, for my C++ code I will be creating fonts with size "40" as I am setting my MapMode to a pixel text setting. This is why it is so important that is bug gets fixed
first. If this bug were to get fixed, then it could fix bugs #1 and #2.<br/>
<br/>
My question to Bug #1, what is going wrong? Should I be setting the map mode to something else? I will draw the character to a 512px graphic, then resize the graphic. This is a critical step so I may do effects to the larger version of the character.<br/>
<br/>
Bug #2: UVs<br/>
Since I store my characters every 128 pixels, it is very easy to obtain the bitmap X/Y values for each character. However, I am not sure how far to advance the UVs to properly draw them. I tried basically doing something like Promit posted for AngelCode bitmap
font render, however, since I am not sure how they generate their values, I may be wrong here. You can see in the two images below that I am calculating my UVs wrong.<br/>
<br/>
My question to Bug#2, how can I correctly advance my UVs? There is nothing wrong with the way I find the bitmap X/Y, only how I move them for rendering.<br/>
<br/>
Bug #3: Letter placement<br/>
I am not sure how to correct move my characters or even correctly get the distance. Currently I just do "A +B + C". This map seem correct, however, if you look at the Arial image below, the "j" looks out of place inbetween the "n"
and "f". There is also what appears to be issues with "b" and "y" for Arial, along with some issues for Times New Roman.<br/>
<br/>
My question to Bug #3, how can I properly advance my characters?<br/>
<br/>
Arial Rendering:<br/>
<img src=http://img214.imageshack.us/img214/1706/arialbasicbad.png><br/>
<br/>
Times New Roman:<br/>
<img src=http://img716.imageshack.us/img716/5838/timesnewromanbasicbad.png><br/>
<br/>
It is worth noting that I am not interested in using any external libraries (such as FreeType), or any "hacks" to do this. I want to see this done correctly using the windows api. Doing either one of these is not up for discussion, if I wanted to
use them I could have been done with this a long time ago.<br/>
<br/>
Since the source tags in the board are broken, I will post the example source in pastebins.<br/>
<br/>
C# (Bitmap drawing) : http://pastebin.com/zpPPZVm0<br/>
C++ (Font rendering) : http://pastebin.com/mHrUatEb<br/>
View the full article