If you are using Internet Explorer, please remove blackberry.com from your compatibility view settings.

Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Java Development

Reply
Developer
bbman
Posts: 16
Registered: ‎06-01-2009
My Device: Not Specified
Accepted Solution

How to fully set the background of a Button

Hi, I have a ButtonField whose background I want to change to red. However, invoking setBackground(BackgroundFactory.createSolidBackground(Color.DARKRED)) would only change part of the background of the button where only the text resides.

 

I've tried instantiating a VerticalFieldManager, change its color to red, and then add the button to it, but to no avail. The manager has different syle of border than the ButtonField, and it ended up overlaying its background on top of the ButtonField. This method works well for EditField but not ButtonField apparently.

 

Does anyone know a good workaround? Thanks a lot.

Please use plain text.
Developer
bikas
Posts: 984
Registered: ‎02-10-2009
My Device: Not Specified

Re: How to fully set the background of a Button

Here is one of my CustomButtonField. This is almost same as default ButtonField.

You can set your desired background color(with focus and without focus) to the following variables in the code.

     DEFAULT_COLOR_NORMAL

     DEFAULT_COLOR_IN_FOCUS 


This might help you. 

import net.rim.device.api.ui.Field;
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.Font;
import net.rim.device.api.system.Bitmap;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.XYRect;
import net.rim.device.api.ui.XYPoint;
import net.rim.device.api.system.Characters;

public class CustomButtonField extends Field
{
private String label;
private int labelLength;
private int width;
private int height;
private int alignment;
private XYPoint labelTopLeftPoint;
private boolean isFocusable;

/**
* Margin for the button
*/
private final static int DEFAULT_LEFT_MARGIN = 1;
private final static int DEFAULT_RIGHT_MARGIN = 1;
private final static int DEFAULT_TOP_MARGIN = 4;
private final static int DEFAULT_BOTTOM_MARGIN = 4;

/**
* Padding for the button
*/
private final static int DEFAULT_LEFT_PADDING = 5;
private final static int DEFAULT_RIGHT_PADDING = 5;
private final static int DEFAULT_TOP_PADDING = 4;
private final static int DEFAULT_BOTTOM_PADDING = 4;

/**
* Margins around the text box
*/
private int leftMargin = DEFAULT_LEFT_MARGIN;
private int rightMargin = DEFAULT_RIGHT_MARGIN;
private int topMargin = DEFAULT_TOP_MARGIN;
private int bottomMargin = DEFAULT_BOTTOM_MARGIN;

/**
* Padding around the text box
*/
private int leftPadding = DEFAULT_LEFT_PADDING;
private int rightPadding = DEFAULT_RIGHT_PADDING;
private int topPadding = DEFAULT_TOP_PADDING;
private int bottomPadding = DEFAULT_BOTTOM_PADDING;

/**
* Alignment
*/
public final static int ALIGNMENT_LEFT = 0x00000001;
public final static int ALIGNMENT_RIGHT = 0x00000002;
public final static int ALIGNMENT_TOP = 0x00000004;
public final static int ALIGNMENT_BOTTOM = 0x00000008;
public final static int ALIGNMENT_CENTER = 0x00000010;


public final static int DEFAULT_BACKGROUND_COLOR_NORMAL = 0x00ffffff;
public final static int DEFAULT_BACKGROUND_COLOR_ON_FOCUS = 0x009c0000;
private int backgroundColorNormal = DEFAULT_BACKGROUND_COLOR_NORMAL;
private int backgroundColorOnFocus = DEFAULT_BACKGROUND_COLOR_ON_FOCUS;

public final static int ALIGNMENT_DEFAULT = ALIGNMENT_LEFT | ALIGNMENT_TOP;


public CustomButtonField(final String label)
{
this(label, 0);
}

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

this.label = (label == null) ? "" : label;

this.isFocusable = true;
Font font = getFont();

labelLength = font.getAdvance(this.label);

this.width = (width != 0) ? width : (labelLength + leftMargin + leftPadding + rightPadding + rightMargin);
this.height = font.getHeight() + topMargin + topPadding + bottomPadding + bottomMargin;

labelTopLeftPoint = new XYPoint();

setAlignment(ALIGNMENT_DEFAULT);
}

public void setWidth(int width)
{
int displayWidth = Display.getWidth();

if (width > 0 && width <= displayWidth)
{
this.width = width;
adjustAlignment();
}
}

public void setWidth(String refStr)
{
this.labelLength = getFont().getAdvance(refStr);
int tempWidth = leftMargin + leftPadding + labelLength + rightPadding + rightMargin;

setWidth(tempWidth);
}

public void setHeight(int height)
{
this.height = height;
}

public void setSize(int width, int height)
{
setWidth(width);
setHeight(height);
}

public void setAlignment(int alignment)
{
if ((alignment & ALIGNMENT_CENTER) != 0)
{
this.alignment = alignment;
}
else
{
this.alignment = 0;

if ((alignment & ALIGNMENT_RIGHT) != 0)
{
this.alignment |= ALIGNMENT_RIGHT;
}
else
{
this.alignment |= ALIGNMENT_LEFT;
}

// Vertical alignment
if ((alignment & ALIGNMENT_BOTTOM) != 0)
{
this.alignment |= ALIGNMENT_BOTTOM;
}
else
{
this.alignment |= ALIGNMENT_TOP;
}
}
adjustAlignment();
}

private void adjustAlignment()
{
int leftBlankSpace = leftMargin + leftPadding;
int rightBlankSpace = rightPadding + rightMargin;

int topBlankSpace = topMargin + topPadding;
int bottomBlankSpace = bottomMargin + bottomPadding;

if ((alignment & ALIGNMENT_CENTER) != 0)
{
int emptySpace = width - (leftBlankSpace + labelLength + rightBlankSpace);

labelTopLeftPoint.y = topBlankSpace;
labelTopLeftPoint.x = leftBlankSpace + emptySpace/2;
}
else
{
// Horizontal alignment
if ((alignment & ALIGNMENT_LEFT) != 0)
{
labelTopLeftPoint.x = leftBlankSpace;
}
else if ((alignment & ALIGNMENT_RIGHT) != 0)
{
labelTopLeftPoint.x = width - (labelLength + rightBlankSpace);
}
labelTopLeftPoint.y = topBlankSpace;
}
}

public String getText()
{
return label;
}

public int getButtonWidth()
{
return width;
}

public void setLeftMargin(int leftMargin)
{
if (leftMargin >= 0)
{
this.width -= this.leftMargin;
this.leftMargin = leftMargin;
this.width += this.leftMargin;

adjustAlignment();
}
}

public void setRightMargin(int rightMargin)
{
if (rightMargin >= 0)
{
this.width -= this.rightMargin;
this.rightMargin = rightMargin;
this.width += this.rightMargin;

adjustAlignment();
}
}


public void setTopMargin(int topMargin)
{
if (topMargin >= 0)
{
this.height -= this.topMargin;
this.topMargin = topMargin;
this.height += this.topMargin;
adjustAlignment();
}
}


public void setBottomMargin(int bottomMargin)
{
if (bottomMargin >= 0)
{
this.height -= this.bottomMargin;
this.bottomMargin = bottomMargin;
this.height -= this.bottomMargin;

adjustAlignment();
}
}

public void setMargin(int topMargin, int rightMargin, int bottomMargin,int leftMargin)
{
setLeftMargin(leftMargin);
setRightMargin(rightMargin);
setTopMargin(topMargin);
setBottomMargin(bottomMargin);
}

public void setFocusable(boolean isFocusable)
{
this.isFocusable = isFocusable;
}

public int getPreferredWidth()
{
return width;
}

public int getPreferredHeight()
{
return height;
}

protected void layout(int width, int height)
{
setExtent(Math.min(getPreferredWidth(), width), Math.min(getPreferredHeight(), height));
}

protected void paint(Graphics graphics)
{
int w = width - (leftMargin + rightMargin);
int h = height - (topMargin + bottomMargin);

if(isFocus() == false)
{
graphics.setColor(backgroundColorNormal);
graphics.fillRoundRect(leftMargin, topMargin, w, h, 6, 6);
graphics.setColor(0x00394142);
graphics.drawRoundRect(leftMargin, topMargin, w, h, 6, 6);
graphics.drawText(label, labelTopLeftPoint.x, labelTopLeftPoint.y);
}
else
{
graphics.setColor(backgroundColorOnFocus);
graphics.fillRoundRect(leftMargin, topMargin, w, h, 6, 6);
graphics.drawRoundRect(leftMargin, topMargin, w, h, 6, 6);

graphics.setColor(0x00ffffff);
graphics.drawText(label, labelTopLeftPoint.x, labelTopLeftPoint.y);
}
}

public boolean isFocusable()
{
return isFocusable;
}

public void getFocusRect(XYRect rect)
{
rect.set(leftMargin, topMargin, width - (leftMargin + rightMargin), height - (topMargin + bottomMargin));
}

protected void drawFocus(Graphics graphics, boolean on)
{
invalidate();
}

public boolean keyChar(char key, int status, int time)
{
if (key == Characters.ENTER)
{
fieldChangeNotify(0);
return true;
}

return false;
}

protected boolean navigationClick(int status, int time)
{
fieldChangeNotify(0);
return true;
}
}

 

Regards

Bikas 

Please use plain text.
Developer
bbman
Posts: 16
Registered: ‎06-01-2009
My Device: Not Specified

Re: How to fully set the background of a Button

Wow, I thought something simpler can be done without extending from fields though. Thank you very much for replying, if I have time before the deadline, then I would consider doing what you showed me. For now, I'll just settle with the thought that setting a backgound to a button field is not really doable without making your own.
Please use plain text.
Developer
bbman
Posts: 16
Registered: ‎06-01-2009
My Device: Not Specified

Re: How to fully set the background of a Button

Oh, I should've looked at the code more carefully. I think overriding the paint method the way that you do might just solve. I did try overriding the paint method, but gave up quickly when the setColor() didn't work as I quite expect it. I'll try the fillRectangle method and see if it would draw the whole background. Thanks
Please use plain text.
New Developer
foztr
Posts: 1
Registered: ‎12-06-2009
My Device: 8320
My Carrier: turkcell

Re: How to fully set the background of a Button

you shall NOT use invalidate in drawFocus, because it users alotof memory and cpu that way. i changed your code and added two functions, pls take a look. and also thanks for the code, i loved it:

 

   protected void drawFocus(Graphics graphics, boolean on)
    {
       
    }
   
   protected void onFocus(int direction) {
        super.onFocus(direction);
        invalidate();
    }

    protected void onUnfocus() {
        super.onUnfocus();
        invalidate();
    }

Please use plain text.