Use of BMFont for custom Fonts

Use of BMFont for custom Fonts

 

Before the cocos2d-x article used to customize the font BMFont software, will not be used, to see the Internet Dongdong also did not understand, their own groping for a long time, finally almost it, now to share it, if any error occurs, please correct it. Thank U ~

 

 

 

Download the package and decompress the file. You can see two versions, 1.13 and 1.14 beta. Which one is used? Whatever you want.

After installation...

Open the BMFont application, which is the black-white stuff,

 

When you see these things, there are some choices in the right column... I am not very clear about the specifics,

I know that the first Latin + Latin Supplement is to select all English letters and characters,

 

You can select a Font from the Options> Font setting in the upper left corner (for example,,, and some fonts with the English name of Bala)

If your font is out of order, you can press Ctrl + A or Edit-> Select All Chars (this command is actually Select All/cancel All)

The Visualize of menu Options can be used to view the exported files, such as PNG, and the character arrangement format.

The Expot Options of menu options can control the attributes of exported files.

The command will be OK now.

 

In fact, the usage of this file can be summarized:

Select font-> select the characters that need to use these fonts-> select export file secondary properties-> export. fnt

Select the Font and use Font Setting (under the Options menu ),

Select a character. You can click it manually or import it through a file,

If you want to import data through a file, it is Edit-> select chars from file

Select the exported image, and use Export options (under the Options menu)

Then export the. fnt file, Options-> save bitmap font...

 

Here are a few examples:

1. Export 26 English letters (uppercase and lowercase) + 10 digits.

① Select the font. Select the font here ~

 

② Select 0 ~ 9 10 digits and 26 English letters (uppercase/lowercase)

 

③ Set Options-> export options

 

-- You can choose options> Visualize to see what the output PNG looks like:

 

It can be found that its numbers and letters are in disorder.

 

⑤ Export the. fnt file, Options-> save bitmap font...

We can find that there are two more files stored, one is. fntand the other is. PNG.

. Png is the font of your own, and. fnt is the position of each font in png.

 

2. This time we will try Chinese. It also applies to the txt files that we do not know which words need to use custom fonts.

 

① Create a txt, enter some Chinese characters you want to save, save pay attention to the selection of UTF-8 encoding format

 

(2) set the font and setting. set either of them. I will use the imitation character here. The Charse will use Unicode.

 

③ Import our txt, Edit-> select chars from file

Then let's take a look at Visualize. We can see that the Chinese characters we have entered are already in it:

 

Hey, the text content is small ~.~

 

④ Next, export. fnt to O (∩ _ ∩) O ~

 

 

You can not only select the desired characters, but also import them from a file or add the selected characters to the file.

OK.