Question

In BlackBerry, how to change the ButtonField background color during the click event? For example, for the long press the background color needs to change. For me it takes the default color blue. How to change it?

This is our custom buttton field. But it shows the default blue color for the button click event.

public class CustomButtonField extends ButtonField implements GlobalConstant {
int mHeight;
int mWidth;
public final static int DEFAULT_BACKGROUND_COLOR_NORMAL = 0x167c9c;
public final static int DEFAULT_BACKGROUND_COLOR_ON_FOCUS = 0x188118;
private int backgroundColorNormal = DEFAULT_BACKGROUND_COLOR_NORMAL;
private int backgroundColorOnFocus = DEFAULT_BACKGROUND_COLOR_ON_FOCUS;
private Background noraml_bg;
private Background focus_bg;
private boolean isFocusable;
private boolean isround_button = false;


public CustomButtonField(int height, int width, String label) {
    super(label, CONSUME_CLICK);

    noraml_bg = menuButton_bgNormal;
    focus_bg = menuButton_bgFocus;

    mHeight = height;
    mWidth = width;
    this.isFocusable = true;
    setBorder(BorderFactory.createSimpleBorder(new XYEdges(0, 0, 0, 0)));
    setBorder(VISUAL_STATE_ACTIVE,
            BorderFactory.createSimpleBorder(new XYEdges(0, 0, 0, 0)));

}

public CustomButtonField(int height, int width, String label, boolean isround_button) {
    super(label, CONSUME_CLICK);

    this.isround_button = isround_button;
    noraml_bg = roundButton_bgNormal;
    focus_bg = roundButton_bgFocus;
    mHeight = height;
    mWidth = width;
    this.isFocusable = true;

    XYEdges padding = new XYEdges(1,1,1,1);
    XYEdges color = new XYEdges (Color.BLACK,Color.BLACK,Color.BLACK,Color.BLACK);
    int lineStyle = Border.STYLE_SOLID;

   Border roundedBorder = BorderFactory.createSimpleBorder(padding, color, lineStyle);
    setBorder(roundedBorder);

}

/*
 * (non-Javadoc)
 * 
 * @see net.rim.device.api.ui.component.ButtonField#getPreferredHeight()
 */
public int getPreferredHeight() {
    return mHeight;
}

/*
 * (non-Javadoc)
 * 
 * @see net.rim.device.api.ui.component.ButtonField#getPreferredWidth()
 */
public int getPreferredWidth() {
    return mWidth;
}

/*
 * (non-Javadoc)
 * 
 * @see net.rim.device.api.ui.component.ButtonField#layout(int, int)
 */
protected void layout(int width, int height) {
    super.layout(mWidth, mHeight);
    setExtent(mWidth, mHeight);
}

/*
 * (non-Javadoc)
 * 
 * @see
 * net.rim.device.api.ui.component.ButtonField#paint(net.rim.device.api.
 * ui.Graphics)
 */
protected void paint(Graphics graphics) {

    String label = getLabel();
    int x = (getPreferredWidth() - getFont().getAdvance(label)) >> 1;
    int y = (getPreferredHeight() - getFont().getHeight()) >> 1;
    if (isFocus() == false) {
        this.setBackground(noraml_bg);
        if(isround_button){
            graphics.setColor(0x666666);
        }else{
            graphics.setColor(Color.WHITE);
        }

        graphics.drawText(label, x, y);
    } else {
        this.setBackground(focus_bg);
        graphics.setColor(Color.WHITE);

        graphics.drawText(label, x, y);
    }
}

protected void drawFocus(Graphics graphics, boolean on) {
    if (on) {
        graphics.setColor(backgroundColorOnFocus);
    } else {
        graphics.setColor(backgroundColorNormal);
    }
}

public boolean isFocusable() {
    return isFocusable;
}

}

Answer 1

Using visual states indicator of the Field, and BackgroundFactory you can set Background for following visual states:

• VISUAL_STATE_ACTIVE – Active visual state. The user is interacting with the field.
• VISUAL_STATE_DISABLED – Disabled visual state. There is no possible interaction with the field.
• VISUAL_STATE_DISABLED_FOCUS – Disabled, but focused visual state. The field is highlighted, but there is no other possible interaction with the field.
• VISUAL_STATE_FOCUS – Focus visual state. The field has focus (is highlighted).
• VISUAL_STATE_NORMAL – Normal visual state. There is no current interaction with the field.

Check following code snippet:

ButtonField bfTest = new ButtonField("Button Field");

Background commonBgOne = BackgroundFactory.createSolidBackground(Color.RED);
Background commonBgTwo = BackgroundFactory.createSolidBackground(Color.GREEN);

bfTest.setBackground(VISUAL_STATE_ACTIVE, commonBgOne);
bfTest.setBackground(VISUAL_STATE_DISABLED, commonBgTwo);
bfTest.setBackground(VISUAL_STATE_DISABLED_FOCUS, commonBgTwo);
bfTest.setBackground(VISUAL_STATE_FOCUS, commonBgOne);
bfTest.setBackground(VISUAL_STATE_NORMAL, commonBgTwo);

Cancelling default border

Border commonBorder = BorderFactory.createSimpleBorder(new XYEdges());

bfTest.setBorder(VISUAL_STATE_ACTIVE, commonBorder);
bfTest.setBorder(VISUAL_STATE_DISABLED, commonBorder);
bfTest.setBorder(VISUAL_STATE_DISABLED_FOCUS, commonBorder);
bfTest.setBorder(VISUAL_STATE_FOCUS, commonBorder);
bfTest.setBorder(VISUAL_STATE_NORMAL, commonBorder);