Custom elegant EditField (textbox)

Similar Questions

• Custom edit field - not drawing while typing of the text

  I created a custom edit field (code below), but there is no slider or text drawn while typing.

  The text appears if you click another field on the screen, but not while typing. I guess it has something to do with my method of painting, but I don't know?

  Tips for making more effective methos painting would be a bonus!

  Thank you!

  import net.rim.device.api.system.Display;
  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.EditField;
  
  public class CustomTextField2 extends EditField {
  
      private int fieldWidth;
      private int fieldHeight;
      private int button_colour = 0xF9F9F9;
      private int text_colour = 0x666666;
      private int border_color = 0xCCCCCC;
      private Graphics graphics = null;
      public CustomTextField2(long arg0) {
          super(arg0);
          fieldWidth = Display.getWidth()-100;
          //int off = 8;
          FontFamily fFam = null;
  
          try {
              fFam = FontFamily.forName("SomeFontHere");
          }
          catch (ClassNotFoundException e) {
              e.printStackTrace();
          }  
  
          Font font = fFam.getFont(Font.PLAIN, 20);
  
          Font defaultFont = font;
          int off = 8;
          fieldHeight = defaultFont.getHeight() + off + 10;
          this.setPadding(5, 20, 5, 20);  }
  
      protected void paint(Graphics graphics) {
  
          graphics.setColor(button_colour);
          graphics.fillRect(0, 0, fieldWidth, fieldHeight);
          graphics.setColor(border_color);
          graphics.drawRect(0, 0, fieldWidth, fieldHeight);
          graphics.setColor(text_colour);
          graphics.drawText(this.getText(),20,10/2);               super.paint(this.graphics);
      }
  
      protected void onFocus(int direction) {
  
          button_colour = 0xF9F9F9;
          text_colour = 0x666666;
          border_color = 0x3598CC;
          this.invalidate();
      }
  
      protected void onUnfocus() {
  
          button_colour = 0xF9F9F9;
          text_colour = 0x666666;
          border_color = 0xCCCCCC;
          this.invalidate();
      }
  
      protected void drawFocus(Graphics graphics, boolean on) {
  
            super.drawFocus(graphics, on);
      }
  
      protected void fieldChangeNotify(int context)
      {
          try {
  
          this.getChangeListener().fieldChanged(this, context);
  
          }
          catch (Exception e){
  
          }
      }
  
      public int getPreferredHeight() {
  
          return fieldHeight;
      }
  
      public int getPreferredWidth() {
  
          return fieldWidth;
      }
  
      protected void layout(int arg0, int arg1) {
  
          setExtent(getPreferredWidth(), getPreferredHeight());
      }
  }
  

  I just posted a code in another thread - he does most, if not all, of what you want. Take a look:

  Custom elegant EditField (textbox)

• Custom for an EditField method?

  Hello

  I have revised my strategy for this project (a previous publication wrote to ask for the help of tables and by assigning a "ID" to an EditField).

  I wonder if it is possible to create a custom method to the EditField, which is able to store a string or an integer?  I looked at the CustomTextField post (http://supportforums.blackberry.com/t5/Java-Development/Stop-edit-field-from-wrapping-text/m-p/25528...) and I found some useful information, but this type of procedure is not covered.

  Here's an example of how this might work (and which might look like the code):

  (MainScreen)
  ...
  int ID = 0;    //integer variable declared
  add(new customeditfield("Text...", ID);  //customeditfield is added to the mainscreen
  
  ...
  
  //customeditfield class declared
  class customeditfield extends EditField{
  
      public customeditfield(String string, int recordid) {
          setText(string); //sets contents using setText method
          RecordId(recordid); //stores recordid using RecordId method
      }
      protected void RecordId(int integer){
          //store the contents of "ID" the variable that was set
                  //when the customfield was added to the screen for
                  //future use
                  //not sure what this code would look like???
      }
  
  }
  

  Any ideas?

  Thank you!!!

  Hello world

  I managed to find a solution after consultation of a text of Java late last night.

  That's what I came up with the option - compatible with your suggestion of Peter!  And you're right - I'll make a change of the variable name as well.

  public class customeditfield extends EditField{
      private String recordID;
  
      public customeditfield(String string, String IdVariable) {
          setText(string);
          setRecordId(IdVariable);
      }
      protected void setRecordId(String ID){
          recordID = ID;
      }
      public String getRecordId(){
          return recordID;
      }
      public boolean invokeAction(int action){
          //I createdthis editfield just to check to see if each
                  //new editfield was storing the correct id variable
                  myeditfield.setText(getRecordId());
          return true;
      }
  }//closing bracket for main class
  

  Thanks for responding to my post!

  Yes, the goal is to connect the data in each editfield to a record in a database.

• Automatically resize the custom text - TextBox

  Hi all, I have a box of text customized with gratitude of this site. I like the idea of having the text resize automatically when it reaches the length of the text for the full text box will always be in view, limiting the amount of characters, of course.

  Could someone help me what do I do?

  package com.google.zxing.client.rim;
  import net.rim.device.api.ui.Font;
  import net.rim.device.api.ui.Graphics;
  import net.rim.device.api.ui.Manager;
  
  import net.rim.device.api.ui.component.EditField;
  
  import net.rim.device.api.ui.container.VerticalFieldManager;
  public class MyTextBoxField extends VerticalFieldManager {
  
    //define some variables to be used
    //in the class
    private int managerWidth;
    private int managerHeight;
    private EditField editField;
  
     public MyTextBoxField(int width, int height) {
      super(Manager.NO_VERTICAL_SCROLL);
      managerWidth = width + 5;
      managerHeight = height + 5;
  VerticalFieldManager vfm =
        new VerticalFieldManager
          (Manager.VERTICAL_SCROLL);
  
      editField = new EditField(){
        public void paint(Graphics g) {
        getManager().invalidate();
        g.setColor(0x999999);
        Font font = this.getFont().derive(Font.PLAIN, 35);
       g.setFont(font);
  //Log.info("B get WIDTH " + b.getWidth());
  
        super.paint(g);
      }
    };
      Font font = this.getFont().derive(Font.PLAIN, 35);
       editField.setFont(font);
    vfm.add(editField);
    add(vfm);
  }
  
  public void paint(Graphics g) {
  //Log.info("This is button size " + textButton.getHeight());
    super.paint(g);
    g.setColor(0x999999);
    Font font = this.getFont().derive(Font.PLAIN, 35);
    g.setColor(0x999999);
       g.setFont(font);
    g.drawRect(0, 0, getWidth(), getHeight());
  }
  
  public void sublayout(int width, int height) {
    if (managerWidth == 0) {
      managerWidth = width;
    }
    if (managerHeight == 0) {
      managerHeight = height;
    }
    super.sublayout(managerWidth, managerHeight);
    setExtent(managerWidth,managerHeight);
  }
  
  public String getText() {
      return editField.getText();
    }
    public void setText(String text) {
      editField.setText(text);
    }
  }
  

  Try changing the method object with below:

  public void paint(Graphics g)
  {
      super.paint(g);
      g.drawRect(0, 0, getWidth(), getHeight());
  
      Font font = editField.getFont();
      g.setColor(0x999999);
      String text = editField.getText();
  
      int totalWidth = this.getWidth() - 10;
      int fontHeight  = font.getHeight();
      for(int fontSize = fontHeight; fontSize >= 5; --fontSize)
      {
          //length of the text
          int length = Font.getDefault().derive(Font.PLAIN,
                       fontSize).getAdvance(text);
          if(length > totalWidth)
          {
              //derived font for the fontSize
              font = Font.getDefault().derive(Font.PLAIN, fontSize);
              continue;
          }
      }
  
      editField.setText(text);
      editField.setFont(font);
  }
  

  Concerning

  Bika

• typed letters are not visible after the end of the custom field in editfield

  class CustomEditField extends EditField {}

  CustomEditField (String text) {}

  Super("",Text);

  }

  public void layout (int width, int height) {}

  Super.Layout (getPreferredWidth (), getPreferredHeight ());

  setExtent (getPreferredWidth (), getPreferredHeight ());

  }

  public int getPreferredHeight() {}

  Return super.getPreferredHeight ();

  }

  public int getPreferredWidth() {}

  return (Display.getWidth () * 2/3);

  }

  }

  It's my edit custom field.

  When I type on this field and reached end of the field, can't see the letters after that, but I can type (the only thing is to type letters are not visible after the end of the field)

  What is the solution

  I'm sure that you must explicitly enable scrolling. See Manager javadocs.

  In addition, you limit the scope of your field, which may also fail to scroll.

• Context menu on Custom EditField?

  Quick Q... I have this simple custom EditField and now I've lost the context menu (I have to cut and paste)...

  Can someone please indicate what to replace to get it back?

  Thank you

  public class EditFieldStyled extends EditField{
      public EditFieldStyled(long style) {
          super(style|EditField.NO_NEWLINE);
      }
      public EditFieldStyled() {
          super();
      }
      public void paint(Graphics g) {
          int _oColor = g.getColor();
          g.setColor(0x00999999);
          g.drawRect(0, 0, getWidth(),getHeight());
          g.setColor(_oColor);
          super.paint(g);
      }
  }
  

  Isn't it great how just ask a question on this forum lets you solve your problems?

  The EditFields were on a PopupScreen that does not have a default context menu. So just change the Style of the PopupScreen as follows.

  public MyPopupScreen(){
      super( new VerticalFieldManager(),DEFAULT_MENU);
  
  ...
  

• Custom EditField. questions

  Hello

  I'm referring more code to implement the custom editfield.

  http://supportforums.BlackBerry.com/T5/Java-development/help-resizing-width-of-EditField-on-storm-SC...

  &

  http://supportforums.BlackBerry.com/T5/Java-development/stop-edit-field-from-wrapping-text/m-p/25528...

  In the first link when the characters exceed the width of editfield it will start new line and start from the beginning. In the second link if the characters are greater than the width of editfield characters gets shifted to the left as and when the new character is typed. but the problem is that we cannot move the cursor backward to use the BACKSPACE key only. the movement of the ball track directional left is only.

  Is he still doing an edit field custom where if the characters exceed the width of the text box it shud offset to the left and also the left scroll with the movement of the trackball is not only.

  Create a HorizontalFieldManager (HORIZONTAL_SCROLL) (and potentially HORIZONTAL_SCROLLBAR) and add your EditField field.  In this way the field will think he has an almost unlimited width and will never go to the next line.  Instead, the Manager must follow the cursor and scroll accordingly.

  Hope that helps.

• custom passwordEditField and editField

  Hello

  I use an editField and a passwordEditField with a rectangle rounded as a backdrop.

  The codes are this:

  EditField myEditField = new EditField(){
       public void paint(Graphics g) {
      int prevColor = g.getColor();
      g.setColor(0xffffff);
      g.fillRoundRect(0, 0, getWidth(), getHeight(), 20, 20);
      g.setColor(prevColor);
      super.paint(g);
      }
  };
  

  PasswordEditField myPasswordEditField = new PasswordEditField(){
       protected void paint(Graphics g) {
      int prevColor = g.getColor();
      g.setColor( 0xffffff);
      g.fillRoundRect(0, 0, getWidth(), getHeight(), 20, 20);
      g.setColor(prevColor);
      super.paint(g);
       }
  };
  

  They both look ok, but the problem is when the user writes the text it is placed too close to the border of the rectangle, as I show in the following image:

  

  I tried to move the text to the right, replacing

  Super.Paint (g); line

  g.drawText (getText (), 5, 0);

  in the method down.

  But while the user writes last letter resembles cut half, second line do not appears and on the passwordEditField characters are not replaced by asterisks.

  Thanks in advance.

  Thank you for all your help,

  I filled the rectangle on the Manager and put the field on it.

• a custom positioning of editfield in line with horizontalfieldmanager

  Sorry guys, I guess its easy...

  but I failed to get the position of editfield at a fixed rate x position on the screen.

  I use the horizontalfieldmanager and add a labelfield, then an editfield. that way I can create a form with the addition of several honzontalmanagers. but I want that all editfields to start a same position x and not directly behind the labelfield of each line. in the end, I want to have a block of editfield, starting at a certain position x on the screen?

  where is my mistake? I tried setposition with no luck...

  Thank you very much

  Sven

  Thank you, two solutions helped me and I fixed it very fast

• Editable TextBox for customer

  I'm doing a site for a client. They have asked to have an area where after that I created the site they open a text document and just edit it and send it back through the FTP. So I thought there must be a way to make a box and have it call a .txt .doc or .xml file and all that is in the file will be displayed in this text box.
  
  Any ideas or comments are welcome! Thank you

  on the website of cushy, there is a small video. This explains everything.

  the customer is not editing a text box, the divs real edit. you just say cushy divs you want be editble by assigning the class .cushycms

  client connections in, they receive a user name and password can then change the divs that you set them as editable.

  Once it's done, it's very simple

• Question of the development of EditField and LabelField in HorizontalFieldManager

  I actually want a custom editfield (a label with a textbox), when he got focus on this textbox draws a border of climax, and I want the label got the same effect, however, I drew a border outside the text easily because of the text box could receive focus , here is my code:

  public class MyTextField extends EditField
  {
      public MyTextField()
      {
          super();
      }
  
      public void layout(int width, int height)
      {
          super.layout(width, height);
      }
  
      protected void paint(Graphics g)
      {
          if(g.isDrawingStyleSet(Graphics.DRAWSTYLE_FOCUS))
          {
              setBorder(BorderFactory.createRoundedBorder(new XYEdges(6, 6, 6, 6), 0x186DEF, Border.STYLE_SOLID));
          }else{
              setBorder(BorderFactory.createRoundedBorder(new XYEdges(6, 6, 6, 6), Color.GRAY, Border.STYLE_SOLID));
          }
  
          super.paint(g);
       }
  }
  

  And I use this code to show in screen

         HorizontalFieldManager hfm=new HorizontalFieldManager();
          LabelField label=new LabelField("something");
          MyTextField text=new MyTextField();
  
          hfm.add(label);
          hfm.add(text);
          add(hfm);
  

  Is there a way to implement that when the textbox has got the update at the same time also changed the color of the text of the label.

  set a Boolean flag that you record in paint, set it on the ground (from outside) and invalid call to redraw.

• The sum of total revenue for each customer unique and graphic it!

  Sunny greetings from Athens!  I walked for 5 hours for an elegant solution to the following:

  I want to add the total amount of revenue for each customer unique and graphic to view what customers bring in most of the species.

  Example of this in it:

  Customers	Charged €
  A	100
  B	200
  C	250
  A	130
  A	120
  B	100

  Customers	Total €
  A	350
  B	300
  C	250

  How this can be implemented by the numbers? As elegantly as possible?

  Hi menick,.

  SUMIF () will do the job.

  

  the formula in table 2::B2 =.

  SUMIF (table 1::A, A2, table 1::B)

  It is filled down.

  Quinn

• The custom tab width add-on does not work in Firefox 25

  I use the add-on "Width tab Custom" (https://addons.mozilla.org/en-US/firefox/addon/custom-tab-width) so that my tabs may shrink very much, but after updating Firefox 25, it seems to no longer work. This add-on incompatible with Firefox 25? In this case, is there another way to make the retractable legs infinitely?

  I found the problem. The problem is in the style of elegant http://userstyles.org/styles/53190/firefox-6-disable-resizing-tab-close-behavior. I had this style for a long time, but somehow, it should have been reset, because it contained "min-width: 100px'.» When I changed that back to 1px, everything was normal again.

  Thank you for your help.

• EditField: protected boolean insert (...) not called if the device uses VirtualKeyboard

  Hi all

  I extend the EditField class to intercept the entries of tank / backspaces and do something. I would outweigh all the methods of the superclass:

  protected boolean insert(char arg0, int arg1);
  public int insert(String text);
  protected int insert(String text, int context);
  
  protected boolean backspace();
  protected int backspace(int count, int context);
  public int backspace(int count);
  

  I tried on a 8520 (which has a physical keyboard) and the methods overridden were correctly when you type something in the field. However, this is not the case on a touch device (tried on a 9380). In this case the text is typed and showed correctly in the EditField custom, but not the method above is called never. I am quite confused...

  Is anyone of you know how to insert text in the virtual keyboard in the EditField? Is it possible to intercept these events?

  See you soon,.

  Beto

  The problem with keyChar and keyDown is that the char to insert depends on the keyboard layout, I didn't want to do something that it is already done by RIM.

  However, I have tried those overring however, but keyChar is never invoked, and keyDown gave place to a chariot double inserted in the editfield...

  In the end, I followed a suggestion made by @peter_strange in another post (I'll add the link if I managed to find it again) and put a FieldChangeListener on the edit field. When field changes, if the context is 0 (user action), I check if the text is changed and do what I have to do...

  Thank you.

  Beto

• OS 6.0 - Bug in the user interface for the custom control

  Hello

  I discovered a bug of UI on OS 6.0 with one of my UI controls. It seems to be linked to the control itself and how it is the calculation of the width. If my screen is full screen, painted correctly control, but as soon as I change the subLayout of the screen, the control still has a full screen width

  I spent a few hours trying to understand this one... but I can't seem to get their hands on the issue. I am sure that he as to do with the way in which it is the calculation of the width of the control of 99%... If someone could point me in the right direction would be appreciated...

  Thank you

  See the code snippet below

  UITest class

  public class UITest extends MainScreen
  {
    public UITest(long style)
    {
      super(style);
  
      add(new ButtonField("This is my test button", ButtonField.USE_ALL_WIDTH));
      TextBoxField ActionLog = new TextBoxField(0, 75, TextBoxField.USE_ALL_WIDTH);
      HorizontalFieldManager hfm = new HorizontalFieldManager(Manager.USE_ALL_WIDTH);
      hfm.setBorder(BorderFactory.createSimpleBorder(new XYEdges(), Border.STYLE_SOLID));
      hfm.add(ActionLog);
      hfm.add(new ButtonField("This is my test button", ButtonField.USE_ALL_WIDTH));
      add(hfm);
    }
  
    protected void sublayout(int width, int height)
    {
      layoutDelegate(width - 40, height - 40);
      setPositionDelegate(10, 10);
      setExtent(width - 20, Math.min(height - 20, getDelegate().getHeight() + 20));
      setPosition(10, (height - getHeight())/2);
    }
  }
  

  Class TextBoxField

  // http://na.blackberry.com/eng/devjournals/resources/journals/jul_2005/creating_textbox_field.jsp
  public class TextBoxField extends VerticalFieldManager
  {
  
    private static int PADDING = 2;
    private static int DEFAULT_WIDTH = 100;
    private int _managerWidth;
    private int _managerHeight;
    private String _pattern;
    private EditField _editField;
  
    public TextBoxField()
    {
      this(0, 0, Manager.USE_ALL_WIDTH);
    }
  
    public TextBoxField(long style)
    {
      this(0, 0, style);
    }
  
    public TextBoxField(int width, long style)
    {
      this(width, 0, style);
    }
  
    public TextBoxField(int width, int height, long style)
    {
  
      super(Manager.NO_VERTICAL_SCROLL | style);
      _managerWidth = width;
      _managerHeight = height;
  
      VerticalFieldManager vfm = new VerticalFieldManager(Manager.VERTICAL_SCROLL | style);
      _editField = new EditField(style)
      {
        public void paint(Graphics g)
        {
          super.paint(g);
        }
      };
  
      vfm.setPadding(PADDING, PADDING, PADDING, PADDING);
      vfm.add(_editField);
      add(vfm);
    }
  
    public int getPreferredHeight()
    {
      int fontHeight = getFont().getHeight() + (2 * PADDING);
      return (fontHeight > _managerHeight) ? fontHeight : _managerHeight;
    }
  
    public int getPreferredWidth()
    {
      if (_pattern != null)
      {
        return getFont().getAdvance(_pattern);
      }
      else
      {
        if (_managerWidth == 0)
          return DEFAULT_WIDTH;
        else
          return _managerWidth;
      }
    }
  
    public void paint(Graphics g)
    {
      super.paint(g);
  
      // BUG FIX: 17-08-2010
      // Before drawing the border, save the current color, after
      // change the color for the border, paint the border and re-set
      // back to the original color.
      int prevColor = g.getColor();
      g.setColor(Color.BLACK);
      g.drawRect(0, 0, getWidth(), getHeight());
      g.setColor(prevColor);
    }
  
    public void sublayout(int width, int height)
    {
      if (_managerWidth == 0)
        _managerWidth = width;
      else
        _managerWidth = getPreferredWidth();
  
      _managerHeight = getPreferredHeight();
  
      super.sublayout(_managerWidth, _managerHeight);
      setExtent(_managerWidth,_managerHeight);
    }
  
    public String getText()
    {
      return _editField.getText();
    }
  
    public void setText(String text)
    {
      _editField.setText(text);
    }   
  
    public int getTextLength()
    {
      return _editField.getTextLength();
    }
  
    public void setTextWidthPattern(String pattern)
    {
      _pattern = pattern;
    }
  };
  

   

  No, PopupScreen was still available. We have certainly used it in 4.2.1 but it was available before that as well.

  With PopupScreen, create it with your manager custom as a delegate.  In this handler, override sublayout to do most of the work. Sublayout of PopupScreen can contain a single functional element, if you wish: setPosition (x, y) (after the call to super.sublayout). SetExtent of the delegated manager will have an impact on the parent company PopupScreen fine (the screen apply the theme to the Manager and take more room, but it's OK).