Tuesday, February 14, 2012

Custom EditFiled in blackberry

Every java blackberry application developer require EditField in blackberry. Here as following code is use full how to create custom EditField component in blackberry.

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.

4 comments:

  1. 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?

    ReplyDelete
    Replies
    1. PS. When i mean scroll backwards i refer to scrolling back throw the text.

      Delete
    2. Hey, 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.

      Delete
  2. Hello, 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;

    pswdEditField = new PasswordEditField(style);

    it gives error because no overloaded method for PasswordEditField takes 1 argument which is style. What I need to do here?

    ReplyDelete