Resize autocomplete field blackberry

Question

I want to reduce the height of my autocomplete field.How to go about it

heres my code

HorizontalFieldManager hfm = new HorizontalFieldManager();
LabelField lbl = new LabelField(" Name:                 ");

final AutoCompleteField TextField1 = new AutoCompleteField(filterLst)
{
    public int getPreferredWidth() 
    {
        return Display.getWidth()/2;
    }

    public void sublayout(int maxWidth, int maxheight)
    {
        super.sublayout(getPreferredWidth(), getPreferredHeight());
        setExtent(getPreferredWidth(), getPreferredHeight());
    }
};
hfm.add(lbl);
hfm.add(TextField1);
add(hfm); 

The picture below is how it looks. I want it to look the same size as my editfields that have been used for other labels.

Here's my code for editfield

   //Add box next to field for containing input 
   HorizontalFieldManager hfm1 = new HorizontalFieldManager();
   LabelField lbl1 = new LabelField(" Amount:              ");

   final EditField TextField2 = new EditField()
   {
      boolean _drawFocus = false;
      protected void layout(int maxWidth, int maxHeight) 
      {
         super.layout(Math.min(maxWidth, 300), Math.min(maxHeight, 30));
      }
      protected boolean keyChar(char ch, int status, int time) 
      {
         if (CharacterUtilities.isDigit(ch) || (ch == Characters.BACKSPACE)) 
         {
            return super.keyChar(ch, status, time);
         }
         return true;
      }
      protected void drawFocus(Graphics graphics,boolean on) 
      {
         _drawFocus = on;
         super.drawFocus(graphics, on);
         _drawFocus = false;
      }    
      protected void paint(Graphics g)
      {       
         if ( _drawFocus ) 
         {
            super.paint(g);
            return;
         } 
         g.clear();
         g.drawRect(0,0, 50, 50);
         int oldColor = g.getColor();
         g.setColor(Color.WHITE);
         g.fillRect(0, 0, this.getPreferredWidth(), this.getPreferredHeight());
         g.setColor(oldColor);
         g.drawRect(100, 100, 50, 50);
         super.paint(g);
      }
   };
   TextField2.setBorder(BorderFactory.createRoundedBorder(new XYEdges(6,6,6,6)));
   hfm1.add(lbl1);
   hfm1.add(TextField2);
   add(hfm1);

I would like to have the size of autocompletefield used for name same as other fields.Please help.

Thanks

Answer 1

One thing that's probably causing you trouble is that EditField is what people normally think of as a Field. AutoCompleteField, however, is handled more like a Manager. It wants to be a Manager, of course, because it (probably) contains an EditField, but then will also contain another child Field which shows the autocomplete options dynamically.

(Non-Manager) Field and Manager subclasses handle layout a little differently, so I found that trying to fix this with the normal getPreferredHeight() and layout() and sublayout() didn't work that well for me.

So, what I did was twofold:

1. First, I tried to mimic the decoration of the default AutoCompleteField with your EditField subclasses. It's not perfect. If you want them to look exactly alike, you might need to write custom paint() methods for both. You stated the problem as simply wanting to resize the fields, so I thought that was good enough.
2. Second, since the AutoCompleteField seems to contain a child EditField (at least logically ... I'm not sure if it's implemented that way), I decided to try to get that EditField to choose its own size, in a way that matched the normal EditFields. To do that, I controlled all fields' height by simply setting the same Font on each.

My changes to your code:

  final int fontSize = 24;   // pick whatever you like here
  final int pad = 2;
  final int margin = 2;

I removed the code in your edit field's layout() method that was attempting to control height, since ... as I said, I didn't have success setting the autocomplete field's height in a similar way. I just changed your edit field's layout() to a very standard implementation:

  final EditField TextField2 = new EditField()
  {
     boolean _drawFocus = false;
     protected void layout(int maxWidth, int maxHeight) 
     {
        super.layout(getPreferredWidth(), getPreferredHeight());
     }

Then, I set the padding on your edit field, because it looks to me like AutoCompleteField uses a pad of 2 pixels (on a 5.0 Storm2). You may not care, for this UI, but it also appears to have a margin of 2 pixels.

  TextField2.setPadding(pad, pad, pad, pad);
  TextField2.setMargin(margin, margin, margin, margin);

Then, I set the same font for all your fields. It doesn't have to be the default font. Just make them all the same. This step is what seemed to dictate the visible size of the rounded rectangle field drawn by AutoCompleteField ... setting the font.

  Font font = Font.getDefault().derive(Font.PLAIN, fontSize);
  TextField1.setFont(font);
  TextField2.setFont(font);

After that, the edit fields and autocomplete fields should be a consistent height. I tested this on a 5.0 9550. Since the pad and margin values were determined experimentally, I can totally believe that those values (e.g. 2 pixels) could change on different devices. You may have to experiment a bit.