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
Posts: 46
Registered: ‎05-18-2009
My Device: Not Specified
Accepted Solution

Custom ButtonField with images

Hi All,

 

I am trying to create a custom ButtonField, I am unable to remove the gray color from background. Could anyone tell me what's wrong with this code??

 

import net.rim.device.api.system.Bitmap; import net.rim.device.api.ui.Color; import net.rim.device.api.ui.Field; import net.rim.device.api.ui.Font; import net.rim.device.api.ui.FontFamily; import net.rim.device.api.ui.Graphics; import net.rim.device.api.ui.component.ButtonField; public class BigButtonField extends ButtonField{ private int backgroundColour = Color.BLACK; private Bitmap button; private Bitmap on = Bitmap.getBitmapResource("onbutton.png"); private Bitmap off = Bitmap.getBitmapResource("offbutton.png"); private int fieldWidth = Graphics.getScreenWidth(); private int fieldHeight = 31; private int buffer = (Graphics.getScreenWidth() - 105) / 2; private String text; private Font fieldFont; public BigButtonField(String _text) { super(Field.FOCUSABLE); this.text = _text; button = off; fieldFont = FieldFont(); } public String getText() { return text; } public void setText(String text) { this.text = text; } protected boolean navigationClick(int status, int time) { fieldChangeNotify(1); return true; } protected void onFocus(int direction){ button = on; invalidate(); } protected void onUnfocus(){ button = off; invalidate(); } public int getPreferredWidth() { return fieldWidth; } public int getPreferredHeight() { return fieldHeight; } protected void layout(int arg0, int arg1) { setExtent(getPreferredWidth(), getPreferredHeight()); } public static Font FieldFont() { try { FontFamily theFam = FontFamily.forName("SYSTEM"); return theFam.getFont(net.rim.device.api.ui.Font.BOLD, 14); } catch (ClassNotFoundException ex) { ex.printStackTrace(); } return null; } protected void drawFocus(Graphics graphics, boolean on){ // } protected void fieldChangeNotify(int context){ try { this.getChangeListener().fieldChanged(this, context); } catch (Exception exception) { } } protected void paint(Graphics graphics) { graphics.drawRect(0, 0, fieldWidth, fieldHeight); graphics.fillRect(10, 0, fieldWidth-200, fieldHeight); graphics.drawBitmap(0, 0, fieldWidth, fieldHeight, button, 0, 0); graphics.setColor(Color.BLACK); graphics.setFont(fieldFont); graphics.drawText(text, ((fieldWidth - fieldFont.getAdvance(text))/ 2) - 70, (fieldHeight - fieldFont.getHeight()) / 2); } }

Please provide your suggestion. If you have any other sample for custom buttonField using bitmap then please share it here.

 

buzz.

 

 

 

Developer
Posts: 41
Registered: ‎04-10-2009
My Device: Not Specified

Re: Custom ButtonField with images

hi,

 you can tyr this , hope it will sove ur problem . 

public class MyButton extends Field { private String label; Bitmap img; int horizontalPadding = 4; int verticalPadding = 10; static int height = 30; static int weight = 55; public MyButton(String name, Bitmap img) { label = name; this.img = img; } protected void layout(int maxWidth, int maxHeight) { Font font = getFont(); // Respect the maximum width and height available from our manager setExtent(Math.min(weight, maxWidth), Math.min(height, maxHeight)); } protected void paint(Graphics graphics) { // Draw background int focusColor = 0x00ffcf94; graphics.setColor(isFocus() ? focusColor : Color.WHITE); graphics.fillRoundRect(0, 0, weight, height, 10, 10); // Draw text and img graphics.setColor(Color.GRAY); graphics.drawRoundRect(0, 0, weight, height, 10, 10); int fontWidth = getFont().getAdvance(label); graphics.setColor(Color.BLACK); if (img != null) { graphics.drawBitmap(2, horizontalPadding, img.getWidth(), img.getHeight(), img, 0, 0); graphics.drawText(label, (weight - fontWidth) - horizontalPadding, verticalPadding); } else { graphics.drawText(label, (weight - fontWidth) / 2, verticalPadding); } } public boolean isFocusable() { return true; } protected void drawFocus(Graphics graphics, boolean on) { // Don't draw the default focus } protected void onFocus(int direction) { super.onFocus(direction); invalidate(); } protected void onUnfocus() { super.onUnfocus(); invalidate(); } }

 


 

Developer
Posts: 46
Registered: ‎05-18-2009
My Device: Not Specified

Re: Custom ButtonField with images

Hi Naveen,

 

It is not working, image is getting cut and not clear

 

buzz.

Developer
Posts: 696
Registered: ‎12-02-2008
My Device: Not Specified

Re: Custom ButtonField with images

Hi,

 

What exaclty do you want to do by overriding ButtonField.

Regards,
Rajat Gupta.
--------------------------------------------------------------------------------
If your problem was get solved then please mark the thread as "Accepted solution" and kudos - your wish
Developer
Posts: 46
Registered: ‎05-18-2009
My Device: Not Specified

Re: Custom ButtonField with images

I would like to create a custom ButtonField.

If i extend Field then i don't know how to put listener for the same.

 

buzz

Developer
Posts: 57
Registered: ‎04-07-2009
My Device: 8300

Re: Custom ButtonField with images


If i extend Field then i don't know how to put listener for the same.



 

You don't need to put listener to the same. Just implement FieldChangeListener in the screen on which you add those custom button fields.

Developer
Posts: 41
Registered: ‎04-10-2009
My Device: Not Specified

Re: Custom ButtonField with images

hi,.

You need to make some modification according to ur need , u can change the size of button to resolve ur problem. 

 static int height = 30;
static int weight = 55;

 

Developer
Posts: 46
Registered: ‎05-18-2009
My Device: Not Specified

Re: Custom ButtonField with images

Hi All,

 

I got the solution my own.

 

1. I extended "Field" in my code which has removed the gray area from the background.

2. I have added a FieldChanglistner to the customed button wherever i am using it.

 

once again thanks you.

 

buzz.

 

Developer
Developer
Posts: 46
Registered: ‎06-16-2009
My Device: Not Specified

Re: Custom ButtonField with images

So how does one CONSUME_CLICK with a Field? I am using a similar "button" class as naveen4nkp has posted, but I keep getting context menus popping up? Override the makeMenu()? or does this completely disable it? I just don't want the context menus popping up when I am clicking on my "button"

 

thanks...

Highlighted
Developer
Posts: 107
Registered: ‎10-06-2010
My Device: Not Specified

Re: Custom ButtonField with images

I know this is the solved and old post.

 

But I wanted to answer the dn8's question as it was frustrating for me as well.

 

You cannot have CONSUME_CLICK with the Field but you can atleaest implement the change listener.

 

Here is the quick code - how you can do it:

 

1. override navigationClick() method of the custom button field

 

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

 

2. Set the FieldChange listener of the CustomButtonField

 

    CustomButtonField btnCancel =  new CustomButtonField("Cancel");
    btnCancel.setChangeListener(this);
        
}

public void fieldChanged(Field field, int context) 
{ 
	if(field == btnCancel) 
	{
		//Do somethinh
	}
}

 

If you want to consume click if EnterKey pressed, you have to implement KeyListener in the Field class and if Enter pressed, then 

 

fieldChangeNotify(1);

 

I hope this is helpfull.

 

Nitin