unity3d-using bitmap font generator to customize fonts

Bitmap Font Generator is an open source freeware, http://www.angelcode.com/products/bmfont/

Do not use the Chinese catalog in the process of using this tool

Make a font of letters or numbers

1. This is the picture given by the art

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M00/7F/A4/ Wkiol1cnryswcxndaabmflr3xb0302.png "width=" 581 "height=" "/>"

2. Open Bmfont, Edit->open Image Manager

650) this.width=650; "Style=" background-image:none; border-right-0px; margin:0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M01/7F/A4/ Wkiol1cnrysd9-d7aabfzopkfzy404.png "width=" 182 "height=" 244 "/>

Open Image->import image, select the above image in the directory 37.png is "a", and fill in the ID of the corresponding ASCII code value, click OK

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M01/7F/A4/ Wkiol1cnrywsuxruaabmzvoybmu722.png "width=" 286 "height=" 111 "/>

Close the window after adding another picture with the corresponding ASCII code value.

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M02/7F/A4/ Wkiol1cnrybcria8aacwidzj4lw203.png "width=" 319 "height=" 129 "/>

3. Export Settings

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M00/7F/A5/wKiom1cnRlWQ_ 6ofaadlfkdupb4297.png "width=" 280 "height=" 369 "/>

Width and height determine the length and width of the last exported image, so that it is appropriate to include all text images, texture determines the format of the exported image. When set, click OK.

Click Options->save Bitmap font as, export, get file:

650) this.width=650; "Style=" background-image:none; border-right-0px; margin:0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/7F/A4/wKioL1cnRyjDOOe_ Aaa5oyku-di408.png "width=" 233 "height=" 142 "/>                                   when bit depth is set to 8 o'clock, not what we want 650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M01/7F/A5/ Wkiom1cnrlaacahaaaaequfhw9u817.png "width=" height= "133"/>

4. Put these two files into your Unity project and open NGUI FontMaker (ngui->open->fontmaker)

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M00/7F/A4/ Wkiol1cnryrznatyaacveiqsdkk694.png "width=" 343 "height=" 196 "/>

In output, set up which atlas our font images will be integrated into, then click Create the Font.

5. Use in label

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M02/7F/A5/ Wkiom1cnrljt-0qzaabvkvfigfo761.png "width=" 372 "height=" 98 "/>

6. Final effect

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M02/7F/A5/ Wkiom1cnrlndh9wgaaaglvhscza976.png "width=" "height="/>

Second, the chat in the picture and text mixed row

1. First obtain characters commonly used, in the (http://www.china-language.gov.cn/wenziguifan2/shanghi/013.htm) Chinese language text network copy to TXT file

Font.txt

1> first to remove the subtitle

650) this.width=650; "Style=" background-image:none; border-right-0px; margin:0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M02/7F/A4/ Wkiol1cnryydvm-naaaszgcbz7k338.png "width=" 244 "height="/>

2> removes white space in a file by using the [edit-blank action, move unless required blank and EOL] and Text Document Replace dialog box in the notepad++.

3> convert text to UTF-8 format by using [format-to-UTF-8 encoding format] in notepad++

The last is this:

650) this.width=650; "Style=" background-image:none; border-right-0px; margin:0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M00/7F/A4/wKioL1cnRy3xZi_ Maadfuhwq0w4717.png "width=" 238 "height=" 155 "/>

2. Open the Software Settings Chinese font

650) this.width=650; "Style=" background-image:none; border-right-0px; margin:0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M00/7F/A4/ Wkiol1cnry3q5p2qaabw6hutkpc439.png "width=" 244 "height=" 138 "/>

Import the text in Font.txt, Edit->select chars from File

650) this.width=650; "Style=" background-image:none; border-right-0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" Http://s3.51cto.com/wyfs02/M01/7F/A4/wKioL1cnRy_ Iyo4maajpzqezvue836.png "width=" 376 "height=" 238 "/>

You can also choose a number of other words to add, such as the English alphabet, the number

3. Next operation reference (first, the letter or number into a font)

In the process of making Atlas, note that the maxsize size is greater than or equal to the size of the PNG image generated by Bmfont. 650) this.width=650; "Style=" background-image:none; border-right-0px; margin:0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M02/7F/A6/ Wkiom1cnrl6dm6dgaaaunhzqp_0390.png "width=" 244 "height="/>

4. Finally:

650) this.width=650; "Style=" background-image:none; border-right-0px; margin:0px; padding-left:0px; padding-right:0px; border-top-width:0px; border-bottom-width:0px; border-left-width:0px; padding-top:0px "title=" image "border=" 0 "alt=" image "src=" http://s3.51cto.com/wyfs02/M01/7F/A4/ Wkiol1cnrzgbhganaaaeerw72dw089.png "width=" 117 "height=" "/>"

Third, the advantage of using Bmfont is (the official website wrote 10 fishes, I extract a few here)

1.Support for complete Unicode 8.0 character set, as well as 8 bit OEM character sets.

2.Optimal use of texture space, i.e. as little unused area as possible.

3.Support for kerning pairs.

4.Easy to use file Format,eighter Normal text file or XML files. Binary format is available for those that prefer.

5.8 bit or texture output (tga,png, and DDS files)

unity3d-using bitmap font generator to customize fonts