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
New Contributor
armankhan
Posts: 6
Registered: ‎06-24-2013
My Device: Bold-8900

Right Aligned TextField

Hi,

 

I am trying implement a right aligned multiline TextField with no luck. I need that to take arabic user input (aligned from right to left) where the cursor should always be places at the top right corner.

 

I already implemented RightAligned Custom Edit Field to support single line arabic text. But belive me whenever I am changing someing in the sublayout method of my code for considering multiple line issue it messing the content and cursor. Also I am not sure what to code when user press enter key. Its driving me crazy. Can someone please give me some proper direction what changes I need to make the below code to covert it behave like TextBox.

 

Code of RightAlignedEditField

public class EditFieldRightAligned extends Manager 
{
   private int fieldHeight = getFont().getHeight()+5;
   private int fieldWidth = 0;
   private int bgColor = Color.WHITE;
   private Font font = Font.getDefault();
   private RightAlignedEditField editField;
   boolean drawFocus = false;
   private int maxNumChars = 200;
   private long style = DrawStyle.RIGHT;
    
   
   public EditFieldRightAligned(String label, int width, Font font) 
   {
      super(NO_VERTICAL_SCROLL | NO_VERTICAL_SCROLLBAR);
      
      this.fieldWidth = width;
      this.font = font;
      
      editField = new RightAlignedEditField();
      add(editField);       
         
    }

   public String getText() {
      return editField.getText();
   }

   public void setFont(Font value) {
      font = value;
      editField.setFont(font);
      fieldHeight = getFont().getHeight()+5;
   }

   protected void sublayout(int width, int height) {      
        if (fieldWidth == 0) {
            fieldWidth = width;
        }
        if (fieldHeight == 0) {
            fieldHeight = height;
        }
        int gap = font.getAdvance(' ');
        int textWidth = editField.getPreferredWidth();
        layoutChild(editField, textWidth, fieldHeight);
        setPositionChild(editField, fieldWidth - textWidth - gap, 5);
        
        setExtent(fieldWidth, fieldHeight);
   }
   
    protected void paint(Graphics g) {
        
        if ( drawFocus ) {
           super.paint(g);
            return;
        }
        int oldColor = g.getColor();      
        if (this.isFocus()) 
        {
            g.setColor(Color.BLACK);
            g.drawRoundRect(0, 0, fieldWidth, fieldHeight,15,15);
            g.setColor(Color.LIGHTGREY);
            // paint a rounded rectangle background
            g.fillRoundRect(0, 0, fieldWidth, fieldHeight, 15, 15);
        } else {
            g.setColor(Color.BLACK);
            g.drawRoundRect(0, 0, fieldWidth, fieldHeight,15,15);
            g.setColor(bgColor);
            // paint a rounded rectangle background
            g.fillRoundRect(0, 0, fieldWidth, fieldHeight,15,15);
        }
        // reset the graphics state to where it was
        g.setColor(oldColor);
        super.paint(g);
   }

   public int getPreferredWidth() {
      return fieldWidth;     
   }

   public int getPreferredHeight() {
      return fieldHeight;
   }

   private void layoutEditField() {      
      sublayout(fieldWidth, fieldHeight);
   }
   
   protected void onFocus( int direction ) {
        super.onFocus( direction );
        invalidate();
    }
    
    protected void onUnfocus() {
        super.onUnfocus();
        invalidate();
    }
    
    protected void drawFocus(Graphics graphics,boolean on) {
        drawFocus = on;
        super.drawFocus(graphics, on);
        drawFocus = false;
    }

    private class RightAlignedEditField extends BasicEditField {
      public RightAlignedEditField() {
         super("", "", maxNumChars, style);
      }
      
      public int getPreferredWidth() {
         return Math.max(font.getAdvance(getText()), font.getAdvance('0')) + font.getAdvance(' ');        
      }
      
       protected boolean keyChar(char ch, int status, int time)
       {
            if (ch == Characters.ENTER)
            {
                return true;
            }
            else
            {   
                boolean result = super.keyChar(ch, status, time);
                layoutEditField();
                return result;
            }
        }
   }
}

 Someone please help me here.

 

Developer
peter_strange
Posts: 19,610
Registered: ‎07-14-2008
My Device: Not Specified

Re: Right Aligned TextField

Unless you take over the painting of the text, and focus/cursor, I don't think it is possible to create a multiple line Text Field that is right aligned. 

 

The trick of right aligning the Field fails when you have a multiple line Field, because then the area required by the TextField is a full width rectangle, so you can't position the rectangle on the right to get your right alignment.  So you have to paint the text right aligned.  And if you move the text, then you must also move the focus point (or cursor). 

 

Sorry I can't think of an easy way for you to do this. 

New Contributor
armankhan
Posts: 6
Registered: ‎06-24-2013
My Device: Bold-8900

Re: Right Aligned TextField

I wish there could have been any other easier way.

 

Then Do I need to get the content of the editfield from the paint method, calculate the number of line it requires and manually draw them using graphics.

Can you please give me some idea how I can always have the cursor/focus to the top right position.

Then what should be the width and height to place layoutChild and positionChild in sublayout method.

 

I am trying with many different combinations with no luck.

Please help with some direction.

New Contributor
armankhan
Posts: 6
Registered: ‎06-24-2013
My Device: Bold-8900

Re: Right Aligned TextField

Still strruggling to get this done.

 

Please anynone give me some more insight.

Developer
peter_strange
Posts: 19,610
Registered: ‎07-14-2008
My Device: Not Specified

Re: Right Aligned TextField

"Do I need to get the content of the editfield from the paint method, calculate the number of line it requires and manually draw them using graphics."

 

That is the only way I think you will do this.

 

"Can you please give me some idea how I can always have the cursor/focus to the top right position."

 

This is the problem.  And the reason I have never attempted to do this.  You need to recreate all the effects, for example cursor position, insertion, deletion and so on, all yourself.  I am not aware of any sample that will help you.  Or any good documentation on what you need to do. 

 

"Then what should be the width and height to place layoutChild and positionChild in sublayout method."

Once you have determined the number of rows you need, the size required is just the font height multiplied by the number of rows.  As noted above, you always specify a rectangle and once you have exceeded the width of a screen, the rectangle will always use the whole width, only the height will vary.