Archive for November, 2009

Editing an image

Posted on November 4, 2009. Filed under: blackberry, image manipulation, software development | Tags: , , , |


When you are working with a screen, it is pretty obvious how to overlay text, images and custom shapes.  All the heavy-lifting is accomplished in the onPaint functions and through the graphics object.  I recently ran into an issue where I need to give some rudimentary image editing capabilities.  In essence, I need to display an image and allow the user to annotate the image with text and then save the image.

The first part is easy to accomplish (I managed to find a few examples on how to pan around a large bitmap image), but the annotating of the image was a bit more difficult to accomplish. 

My first iteration involved me having a custom class that kept track of the annotation and the annotation co-ordinates.  Something along the lines of …

class annotation {

public int x;

public int y;

public String text;


However, this was fine for the onPaint function, but I couldn’t figure out how to merge these array of annotations with the actual bitmap.  After some searching through forums I decided to resort to the intelli-sense built-in to the eclipse pluging, and there it was!  the holy grail that I was looking for: graphics.

It turns out that you can pass a bitmap to the graphics class, and then use all the graphics functions to manipulate the underlaying bitmap.   And because it uses the same graphics class as used in the onPaint, there was no learning curve.

So my code now looks like…

protected void annotateImage(String s)
                        Graphics g = new Graphics(_bmImage);
                        int globalX = _crossHairPos.getLeft() +  _imagePos.getLeft() ;
                        int globalY = _crossHairPos.getTop() + _imagePos.getTop();
                        g.drawText(s, globalX, globalY);

Read Full Post | Make a Comment ( None so far )

EncodedImage – How to Resize

Posted on November 2, 2009. Filed under: blackberry, multiple devices, software development | Tags: , , , |


I have been working on an application that has a number of navigation buttons.  This buttons must always be displayed and I want them to take up about half the width of the screen.  This is a simple problem when you have a single width to deal with, but I recently needed to port the application from the Bold to the Pearl handset.

I wanted to keep the same images but needed to resize based on the display’s width.  There are trivial solutions easily found on the web (where the image’s size is cut in half) but nothing to set an arbitrary size.  So here is my solution (so that I can remember it at a later time).

I know this is an obvious thing to do, but I am continually searching through old projects or the web to remember the details on how to accomplish this task.

The key thing to remember is that the value for the scaleImage is the reciprical of what you would expect.  So if the scaled image is one half (1/2) of the original then your scale factor is (2/1).

protected Bitmap scaleBitmap(EncodedImage ei, int newXSize, int newYSize)
        int xScale = 0;
        int yScale = 0;
        int xSize = ei.getWidth();
        int ySize = ei.getHeight();

        xScale = Fixed32.div(xSize,newXSize);       
        yScale = Fixed32.div(ySize,newYSize);
        return ei.scaleImage32(xScale, yScale).getBitmap();

You can add some refinements:

  1. keep the aspect ratio: just decide what dimension is the limiting factor for display and then apply that scale to both dimensions.
  2. keep images a consistent size: put the size into your class that defines your presentation style
Read Full Post | Make a Comment ( None so far )

Liked it here?
Why not try sites on the blogroll...