Image Button in BlackBerry

Question

How do I implement an image button in BlackBerry?

Answer 1

perfect ImageButton for Blackberry , According to user point of view a Imagebutton should have  four states 
1. Normal
2. Focus
3. Selected Focus
4. Selected unfocus

the Following code maintain all four states (Field-Change-Listener and Navigation) 
if you want to maintain all four states than use 1st Constructor, If you just want to handle Focus/Un-Focu state of the button than use 2nd one

########################################

import net.rim.device.api.system.Bitmap;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.Graphics;

public class ImageButton extends Field
{

    Bitmap mNormalIcon;
    Bitmap mFocusedIcon;
    Bitmap mActiveNormalIcon;
    Bitmap mActiveFocusedIcon;
    Bitmap mActiveBitmap;
    String mActiveText;
    int mHeight;
    int mWidth;

    boolean isStateActive = false;
    boolean isTextActive = false;

    public boolean isStateActive()
    {
        return isStateActive;
    }



    public ImageButton(Bitmap normalIcon, Bitmap focusedIcon)
    {
        super(Field.FOCUSABLE | FIELD_VCENTER);
        mNormalIcon = normalIcon;
        mFocusedIcon = focusedIcon;
        mActiveBitmap = normalIcon;
        mActiveFocusedIcon = focusedIcon;
        mActiveNormalIcon = normalIcon;
        // isTextActive = false;
    }

    public ImageButton(Bitmap normalIcon, Bitmap focusedIcon, Bitmap activeNormalIcon, Bitmap activeFocusedIcon)
    {
        super(Field.FOCUSABLE | FIELD_VCENTER);
        mNormalIcon = normalIcon;
        mFocusedIcon = focusedIcon;
        mActiveFocusedIcon = activeFocusedIcon;
        mActiveNormalIcon = activeNormalIcon;
        mActiveBitmap = normalIcon;
        // isTextActive = true;
    }



    protected void onFocus(int direction)
    {
        if ( !isStateActive )
        {

            mActiveBitmap = mFocusedIcon;

        }
        else
        {

            mActiveBitmap = mActiveFocusedIcon;
        }

    }

    protected void onUnfocus()
    {

        super.onUnfocus();
        if ( !isStateActive )
        {

            mActiveBitmap = mNormalIcon;

        }
        else
        {

            mActiveBitmap = mActiveNormalIcon;

        }

    }

    protected boolean navigationClick(int status, int time)
    {

        mActiveBitmap = mActiveNormalIcon;

        toggleState();
        invalidate();
        fieldChangeNotify(1);
        return true;
    }

    public void toggleState()
    {
        isStateActive = !isStateActive;
    }

    public int getPreferredWidth()
    {
        return mActiveBitmap.getWidth() + 20;

    }

    public int getPreferredHeight()
    {
        return mActiveBitmap.getHeight() + 10;

    }

    protected void layout(int width, int height)
    {

        mWidth = getPreferredWidth();
        mHeight = getPreferredHeight();
        setExtent(mWidth, mHeight);

    }

    protected void paint(Graphics graphics)
    {

        graphics.drawBitmap(0, 5, mWidth, mHeight, mActiveBitmap, 0, 0);
        // graphics.setColor(0xff0000);
        // graphics.drawText(mActiveText, ( mActiveBitmap.getWidth() -
        // this.getFont().getAdvance("ON") ) / 2, mActiveBitmap.getHeight());

    }

    protected void drawFocus(Graphics graphics, boolean on)
    {

    }

    public void activate()
    {
        mActiveBitmap = mActiveNormalIcon;

        isStateActive = true;

        invalidate();
    }

    public void deactivate()
    {

        mActiveBitmap = mNormalIcon;

        isStateActive = false;

        invalidate();
    }

}