If you want to use custom fonts the easiest one to start with is Monospaced.
As each character has the same width a simple math can define the correct point to draw.
Lets start with just numbers, from zero (Unicode value 48) to nine (Unicode value of 57).
Below is a PNG image of a very small font with three pixels width and five pixels height.
The following class can be used to draw numbers using this image.
import javax.microedition.lcdui.Graphics;
import javax.microedition.lcdui.Image;
public class MonospacedFont {
private Image image;
private char firstChar;
private int numChars;
private int charWidth;
public MonospacedFont(Image image, char firstChar, int numChars) {
if (image == null) {
throw new IllegalArgumentException("image == null");
}
// the first visible Unicode character is '!' (value 33)
if (firstChar <= 33) {
throw new IllegalArgumentException("firstChar <= 33");
}
// there must be at lease one character on the image
if (numChars <= 0) {
throw new IllegalArgumentException("numChars <= 0");
}
this.image = image;
this.firstChar = firstChar;
this.numChars = numChars;
this.charWidth = image.getWidth() / this.numChars;
}
public void drawString (Graphics g, String text, int x, int y) {
// store current Graphics clip area to restore later
int clipX = g.getClipX();
int clipY = g.getClipY();
int clipWidth = g.getClipWidth();
int clipHeight = g.getClipHeight();
char [] chars = text.toCharArray();
for (int i = 0; i < chars.length; i++) {
int charIndex = chars[i] - this.firstChar;
// current char exists on the image
if (charIndex >= 0 && charIndex <= this.numChars) {
g.setClip(x, y, this.charWidth, this.image.getHeight());
g.drawImage(image, x - (charIndex * this.charWidth), y,
Graphics.TOP | Graphics.LEFT);
x += this.charWidth;
}
}
// restore initial clip area
g.setClip(clipX, clipY, clipWidth, clipHeight);
}
}
Here is a sample code that uses this class.
Image img;
try {
img = Image.createImage("/monospaced_3_5.PNG");
MonospacedFont mf = new MonospacedFont(img, '0', 10);
mf.drawString(g, "9876543210", 40, 40);
} catch (IOException e) {
e.printStackTrace();
}
From here you can go on defining bigger images with more letters.
Posts
