Image stretching issue in blackberry

Question

I am trying to create a chat screen. In that screen, for text background, I am using image and resizing that background image according to number of characters in message text.

Problem is,when characters are less small, image will be shown but when characters increase in number, throughout the screen that image stretches unnecessarily.

Also, if first message is lengthy, image will be stretched but when we send next message of lesser character all background images shrinks according to that last message size. It is shown in first two messages in screen shot.

In one line we can say, image stretch or shrink according to last message size throughout the screen.

Code for white background is here :

public void sendMessage(String msg) {
    HorizontalFieldManager chatHFM = new HorizontalFieldManager();

    offsets_me[2] = offsets_me[1] + msg.length();

    BitmapField bitmapField = new BitmapField(_myPic);
    bitmapField.setBorder(roundedBorder1);

    imageVFM = new VerticalFieldManager();
    imageVFM.setMargin(0,0,0,0);
    imageVFM.add(bitmapField);

    _text_Length = msg.length()+ 6;

    if(_text_Length<=60){
        if(Constants.displayWidth<=360){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 70, 200);
        }else if(Constants.displayWidth>360 && Constants.displayWidth<640){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 90, 330);
        }else if(Constants.displayWidth>=640){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 100, 500);
        }
    }else if(_text_Length>60 && _text_Length <=120){
        if(Constants.displayWidth<=360){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 140, 200);
        }else if(Constants.displayWidth>360 && Constants.displayWidth<640){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 170, 330);
        }else if(Constants.displayWidth>=640){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 200, 500);
        }
    }else if(_text_Length>120 && _text_Length<200){
        if(Constants.displayWidth<=360){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 200, 200);
        }else if(Constants.displayWidth>360 && Constants.displayWidth<640){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 240, 330);
        }else if(Constants.displayWidth>=640){
            _bgImage_White = Constants.sizePic(EncodedImage.getEncodedImageResource("white_l.png"), 270, 500);
        }
    }

    textVFM = new VerticalFieldManager(){
        protected void paint(Graphics graphics) {
            graphics.drawBitmap(0,0 , _bgImage_White.getWidth() , getHeight(), _bgImage_White, 0, 0);
            super.paint(graphics);
        }
    };

    EditField richTextField = new EditField("" ,"" ,140, 0L){ 
        protected void paint(Graphics graphics) {
            graphics.setColor(Color.RED);
            super.paint(graphics);
        }
        public void layout (int width, int height) {
            super.layout (width, height);
            if (getExtent().height < _bgImage_White.getHeight()){
                setExtent (width, _bgImage_White.getHeight());
            }else{setExtent (width, _bgImage_White.getHeight());}

        }
    };
    //  richTextField.setBorder(roundedBorder1);
    richTextField.setText("Me : "+msg);
    richTextField.setEditable(false);
    richTextField.setMargin(10,10,10,10);
    textVFM.add(richTextField);
    textVFM.setMargin(0,75,0,0);
    chatHFM.add(imageVFM);
    chatHFM.add(textVFM);
    chatHFM.setMargin(8,0,8,0);
    this.add(chatHFM);
    this.add(new NullField(NullField.FOCUSABLE));    
}

Answer 1

Download the Advance UI code from the below link:

Advance UI

Run and check the UIExampleNegativeMarginScreen class.

I think it will help you.

Implementation of Advance UI components