import net.rim.device.api.ui.Color;
import net.rim.device.api.ui.Manager;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.component.EditField;
import net.rim.device.api.system.Display;
import net.rim.device.api.system.Characters;
import net.rim.device.api.ui.Graphics;
import net.rim.device.api.ui.Font;
public class CustomTextBox extends Manager
{
private final static int DEFAULT_LEFT_MARGIN = 120;
private final static int DEFAULT_RIGHT_MARGIN = 25;
private final static int DEFAULT_TOP_MARGIN = 5;
private final static int DEFAULT_BOTTOM_MARGIN = 5;
private final static int DEFAULT_LEFT_PADDING = 10;
private final static int DEFAULT_RIGHT_PADDING = 10;
private final static int DEFAULT_TOP_PADDING = 5;
private final static int DEFAULT_BOTTOM_PADDING = 5;
private int topMargin = DEFAULT_TOP_MARGIN;
private int bottomMargin = DEFAULT_BOTTOM_MARGIN;
private int leftMargin = DEFAULT_LEFT_MARGIN;
private int rightMargin = DEFAULT_RIGHT_MARGIN;
private int topPadding = DEFAULT_TOP_PADDING;
private int bottomPadding = DEFAULT_BOTTOM_PADDING;
private int leftPadding = DEFAULT_LEFT_PADDING;
private int rightPadding = DEFAULT_RIGHT_PADDING;
private int totalHorizontalEmptySpace = leftMargin + leftPadding + rightPadding + rightMargin;
private int totalVerticalEmptySpace = topMargin + topPadding + bottomPadding + bottomMargin;
private int minHeight = getFont().getHeight() + totalVerticalEmptySpace;
private int width = Display.getWidth();
private int height = minHeight;
private int button_colour = 0xF9F9F9;
private int text_colour = 0x666666;
private int border_color = 0xCCCCCC;
private String heading ="";
private EditField editField;
private Font headingFont;
public CustomTextBox(String heading)
{
super(0);
this.heading = heading;
this.width = Display.getWidth()-15;
editField = new EditField();
add(editField);
}
public CustomTextBox(String heading, Font headingFont)
{
super(0);
this.heading = heading;
this.width = Display.getWidth()-15;
editField = new EditField();
this.headingFont = headingFont;
add(editField);
}
public CustomTextBox(String heading, Font headingFont, long style)
{
super(0);
this.heading = heading;
this.width = Display.getWidth()-15;
editField = new EditField(style);
this.headingFont = headingFont;
add(editField);
}
public CustomTextBox(String heading, long style)
{
super(0);
this.heading = heading;
this.width = Display.getWidth()-15;
editField = new EditField(style);
add(editField);
}
protected void sublayout(int width, int height)
{
Field field = getField(0);
layoutChild(field, this.width - totalHorizontalEmptySpace , this.height - totalVerticalEmptySpace);
setPositionChild(field, leftMargin+leftPadding, topMargin+topPadding);
setExtent(this.width, this.height);
}
public void setTopMargin(int topMargin)
{
this.topMargin = topMargin;
}
public void setBottomMargin(int bottomMargin)
{
this.bottomMargin = bottomMargin;
}
protected void paint(Graphics graphics)
{
graphics.setColor(border_color);
graphics.drawRoundRect(leftMargin, topMargin, width - (leftMargin+rightMargin), height - (topMargin+bottomMargin), 7, 7);
graphics.setColor(15333367);
graphics.fillRect(leftMargin+3, topMargin+3, (width - (leftMargin+rightMargin))-5,(height- (topMargin+bottomMargin))-5);
graphics.setColor(Color.BLACK);
if(headingFont!=null){
setFont(headingFont);
graphics.drawText(heading, 2, 10);
}else{
graphics.drawText(heading, 2, 7);
}
graphics.setColor(text_colour);
EditField ef = (EditField)getField(0);
String entireText = ef.getText();
String textToDraw = "";
Font font = getFont();
int availableWidth = width - totalHorizontalEmptySpace;
if (font.getAdvance(entireText) <= availableWidth)
{
textToDraw = entireText;
}
else
{
int endIndex = entireText.length();
for (int beginIndex = 1; beginIndex < endIndex; beginIndex++)
{
textToDraw = entireText.substring(beginIndex);
if (font.getAdvance(textToDraw) <= availableWidth)
{
break;
}
}
}
graphics.setColor(text_colour);
ef.setText(textToDraw);
super.paint(graphics);
}
public int getPreferredWidth()
{
return width;
}
public int getPreferredHeight()
{
return height;
}
protected boolean keyChar(char ch, int status, int time)
{
if (ch == Characters.ENTER)
{
return true;
}
else
{
return super.keyChar(ch, status, time);
}
}
public String getText()
{
return ((EditField)getField(0)).getText();
}
public void setText(final String text)
{
((EditField)getField(0)).setText(text);
}
protected void onUnfocus() {
super.onUnfocus();
}
protected void onFocus(int direction) {
// TODO Auto-generated method stub
super.onFocus(direction);
}
protected void drawFocus(Graphics graphics, boolean on) {
super.drawFocus(graphics, on);
}
public void setEnabled(boolean enabled) {
// TODO Auto-generated method stub
this.editField.setEnabled(enabled);
super.setEnabled(enabled);
}
}
Now add CustomTextBox on MainScreen
CustomTextBox editEmail = new CustomTextBox("Email: ");
add(editEmail);
Output Like this.
We can also create same CustomPassword filed please change EditField to PasswordEditField.
Thank you.

Hi Suresh, brilliant blog. Got a question for you about the Custom EditFiled. I am just wondering how u manage the moving of the focus. Cause i am experimenting with custom fields. Im following ur model of a manager and using a edit field however i cant seem to scroll backwards with the touch roller when at the end of the string. Have u ever experienced this?
ReplyDeletePS. When i mean scroll backwards i refer to scrolling back throw the text.
DeleteHey, I found out what the problem was lol, basically the loop drawing the text will always draw the same text. Need to check where the cursor is in the string.
DeleteHello, I am new to Blackberry development. I am creating a CustomPasswordEditField with the help of code you have supplied above. Problem is that when i replace the following line;
ReplyDeletepswdEditField = new PasswordEditField(style);
it gives error because no overloaded method for PasswordEditField takes 1 argument which is style. What I need to do here?