bitmapfonts
Differences
This shows you the differences between two versions of the page.
| Both sides previous revisionPrevious revision | |||
| bitmapfonts [2015/01/30 20:37] – [How to build a Bitmap Font?] alex_curran | bitmapfonts [2015/01/31 17:47] (current) – fixed headline levels splitbrain | ||
|---|---|---|---|
| Line 1: | Line 1: | ||
| - | =====Bitmap Fonts===== | + | ====== Bitmap Fonts ====== |
| So you already have a huge library of True Type fonts ... so why would you use Bitmap fonts? | So you already have a huge library of True Type fonts ... so why would you use Bitmap fonts? | ||
| Line 6: | Line 6: | ||
| {{: | {{: | ||
| - | ====What' | + | |
| + | ===== What's good about Bitmap Fonts ===== | ||
| * They render and update quicker on your watch! | * They render and update quicker on your watch! | ||
| * You can use your favorite photo editor, e.g. Photoshop, GIMP, to create high quality effects: shadows, gradients, blur, etc | * You can use your favorite photo editor, e.g. Photoshop, GIMP, to create high quality effects: shadows, gradients, blur, etc | ||
| - | ====What is a Bitmap Font? :==== | + | ===== What is a Bitmap Font? ===== |
| * Made up of 2 files, e.g. Metal.fnt and Metal.png | * Made up of 2 files, e.g. Metal.fnt and Metal.png | ||
| * The .fnt file is the font definition which specifies supported characters, e.g. A-Z, and the size of each character in the spritesheet | * The .fnt file is the font definition which specifies supported characters, e.g. A-Z, and the size of each character in the spritesheet | ||
| Line 16: | Line 17: | ||
| * See example files at the bottom | * See example files at the bottom | ||
| - | ====How to build a Bitmap Font?==== | + | ===== How to build a Bitmap Font? ===== |
| * There are apps for PC, Mac and web that will help : | * There are apps for PC, Mac and web that will help : | ||
| * [[http:// | * [[http:// | ||
| Line 22: | Line 23: | ||
| * [[http:// | * [[http:// | ||
| - | ====Tips==== | + | ===== Tips ===== |
| * Aim for a png resolution of under 1000x1000 | * Aim for a png resolution of under 1000x1000 | ||
| * Remember watches can crash if you send textures that are too large | * Remember watches can crash if you send textures that are too large | ||
| Line 28: | Line 29: | ||
| * Don't generate characters you won't use, e.g. lowercase letters, punctuation, | * Don't generate characters you won't use, e.g. lowercase letters, punctuation, | ||
| - | ====Using Bitmap fonts in WatchMaker==== | + | ===== Using Bitmap fonts in WatchMaker |
| * Copy both the .png and .fnt files to the folder BeautifulWatches/ | * Copy both the .png and .fnt files to the folder BeautifulWatches/ | ||
| * Customize a watch | * Customize a watch | ||
| Line 34: | Line 35: | ||
| * Select Font -> Bitmap Font and you should see your new font! | * Select Font -> Bitmap Font and you should see your new font! | ||
| - | ====Example Bitmap Font==== | + | ===== Example Bitmap Font ===== |
| * You can play with this metal font, e.g. change the png file and save to WatchMaker : | * You can play with this metal font, e.g. change the png file and save to WatchMaker : | ||
| * [[http:// | * [[http:// | ||
| * Metal.png: | * Metal.png: | ||
| * {{: | * {{: | ||
bitmapfonts.txt · Last modified: by splitbrain
