I haven't tested this code out, but I suspect your problem is in the layout method of your field:
protected void layout(int maxWidth, int maxHeight)
{
setExtent(maxWidth, maxHeight);
// setExtent(Math.min(weight, maxWidth), Math.min(height, maxHeight));
}
Is there a reason you commented that line? I think what's happening is that your custom field is taking up the whole width, and in your paint method you're drawing the bitmap at the extreme left, making it look like the field is aligned left. If you uncomment that line, and add a field style bit of Field.FIELD_HCENTER when you construct your field it should work.
Alternatively, you can keep the layout as is, and just draw the bitmap centered, by changing the line in your paint method to something like this
graphics.drawBitmap((this.getWidth()-img.getWidth())/2, 0 , img.getWidth(), img.getHeight(), img, 0, 0);
The field will still take up the whole width, but the image will be centered. This might cause unexpected behavior on touchscreen devices (i.e. the Storm).