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
Contributor
Posts: 38
Registered: ‎05-26-2010
My Device: Bold 9700
My Carrier: Rogers

Image Scaling

Hello All,

 

I finally finished my app, but now need to know how to scale the background images according to the device it is running on. I used png files for the background images.

 

Thanks!

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

Re: Image Scaling

If you search the forum using scroll, you wil find that there are a number of Threads that discuss this sort of issue.  You might also find this KB article has come useful code in it.

 

http://supportforums.blackberry.com/t5/Java-Development/Rotate-and-scale-bitmaps/ta-p/492524

Contributor
Posts: 38
Registered: ‎05-26-2010
My Device: Bold 9700
My Carrier: Rogers

Re: Image Scaling

I was hoping to do some sort of IF statement using Display.getHeight() and Display.getWidth() to determine what image is used for the background, to avoid any image distortion caused by scaling. It didn't seem to work for me though. Does anyone know if this is possible?

 

Thanks!

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

Re: Image Scaling

Certainly possible.  Not sure why it should not work.  Can we see the failing code and can you describe why it failed?

 

However be aware that the creation of a Bitmap from an image file is a heavy operation, so you should try to do this as part of the creation or layout of the Screen/Manager, and not every time in paint or paintBackground.

Contributor
Posts: 38
Registered: ‎05-26-2010
My Device: Bold 9700
My Carrier: Rogers

Re: Image Scaling

Here is a sample of my code:

 

public class Choice_Screen extends MainScreen implements FieldChangeListener{
    
    private ButtonField b1,b2;
    
    protected boolean onSavePrompt()
	{       
    	return false;   
	}
    
    Bitmap backgroundBitmap = Bitmap.getBitmapResource("sportsapp3.png");
     
    Choice_Screen() {
    	
    super(NO_VERTICAL_SCROLL);
        
    
    
    
    HorizontalFieldManager horizontalFieldManager = new HorizontalFieldManager(HorizontalFieldManager.USE_ALL_WIDTH |HorizontalFieldManager.USE_ALL_HEIGHT)
    {
    	public void paint(Graphics graphics)
    	{
    		graphics.clear();
    		graphics.drawBitmap(0, 0, Display.getWidth(), Display.getHeight(),backgroundBitmap, 0, 0);
    		super.paint(graphics);
    	}
    };

 

Not sure where I would place the IF statement. Possibly inside the horizontal field manager?

Contributor
Posts: 38
Registered: ‎05-26-2010
My Device: Bold 9700
My Carrier: Rogers

Re: Image Scaling

Here is my updated code. It now changes the background images based on screen resolution, but now only my first button on each screen works?

 

public class Choice_Screen extends MainScreen implements FieldChangeListener{
    
    private ButtonField b1,b2;
    
    protected boolean onSavePrompt()
	{       
    	return false;   
	}
    
    Bitmap backgroundBitmap = Bitmap.getBitmapResource("sportsapp3.png");
    Bitmap backgroundBitmap2 = Bitmap.getBitmapResource("stormback.png");
    Bitmap backgroundBitmap3 = Bitmap.getBitmapResource("curveback.png");
     
    Choice_Screen() {
    	
    super(NO_VERTICAL_SCROLL);
        
    
    
    
    HorizontalFieldManager horizontalFieldManager = new HorizontalFieldManager(HorizontalFieldManager.USE_ALL_WIDTH |HorizontalFieldManager.USE_ALL_HEIGHT)
    {
    	public void paint(Graphics graphics)
    	{
    		graphics.clear();
    		if((Display.getWidth() == 480) && (Display.getHeight() == 360))
    		{
    		graphics.drawBitmap(0, 0, Display.getWidth(), Display.getHeight(),backgroundBitmap, 0, 0);
    		}
    		else if((Display.getWidth() == 360) && (Display.getHeight() == 480))
    		{
    			graphics.drawBitmap(0, 0, Display.getWidth(), Display.getHeight(),backgroundBitmap2, 0, 0);
    		}
    		else if((Display.getWidth() == 320) && (Display.getHeight() == 240))
    		{
    			graphics.drawBitmap(0, 0, Display.getWidth(), Display.getHeight(),backgroundBitmap3, 0, 0);
    		}
    		super.paint(graphics);
    	}
    };
    	
    VerticalFieldManager verticalFieldManager = new VerticalFieldManager(Field.FIELD_VCENTER | USE_ALL_WIDTH);
   
    b1 = new ButtonField("  Mens Sports  ",ButtonField.NEVER_DIRTY | FIELD_VCENTER | FIELD_HCENTER);
    b2 = new ButtonField("Womens Sports",ButtonField.NEVER_DIRTY |  FIELD_VCENTER | FIELD_HCENTER);
    
    verticalFieldManager.add(b1);
	verticalFieldManager.add(b2);
	horizontalFieldManager.add(verticalFieldManager);			

 Any help?

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

Re: Image Scaling

Code looks basically OK to me.

 

I would make your nonScrolling Background manager a VFM rather than an HFM, and make it explicit in the MainScreen COnstructor and the non scrolling VFM (was HFM) and these are full width and full height and non scrolling.  I use a similar 'construction', and the constructor for the screen has:

 

super(MainScreen.DEFAULT_CLOSE | Manager.USE_ALL_HEIGHT | Manager.USE_ALL_WIDTH | Manager.NO_VERTICAL_SCROLL | Manager.NO_HORIZONTAL_SCROLL );

 

and the non scrolling manager is

 

new VerticalFieldManager( Manager.USE_ALL_HEIGHT | Manager.USE_ALL_WIDTH | Manager.NO_VERTICAL_SCROLL | Manager.NO_HORIZONTAL_SCROLL );

 

See it that resolves the problem you are having. 

 

Contributor
Posts: 38
Registered: ‎05-26-2010
My Device: Bold 9700
My Carrier: Rogers

Re: Image Scaling

It worked but then the buttons were no longer centered on the screen. The way I have them now is one above the other, centered on the screen. Below is my whole code for this screen, can you explain how I can go about changing the HFM to a VFM while still keeping this layout? Thanks!

 

package com.berkvens852.stfxschedule;

import net.rim.device.api.system.Bitmap;
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.*;
import net.rim.device.api.ui.component.*;
import net.rim.device.api.ui.container.*;


public class Choice_Screen extends MainScreen implements FieldChangeListener{
    
    private ButtonField b1,b2;
     
    Bitmap backgroundBitmap = Bitmap.getBitmapResource("sportsapp3.png");
    Bitmap backgroundBitmap2 = Bitmap.getBitmapResource("stormback.png");
    Bitmap backgroundBitmap3 = Bitmap.getBitmapResource("curveback.png");
     
    Choice_Screen() {
    	
    	super(MainScreen.DEFAULT_CLOSE | Manager.USE_ALL_HEIGHT | Manager.USE_ALL_WIDTH | Manager.NO_VERTICAL_SCROLL);
         
    
    HorizontalFieldManager horizontalFieldManager = new HorizontalFieldManager(HorizontalFieldManager.USE_ALL_WIDTH |HorizontalFieldManager.USE_ALL_HEIGHT)
    {
    	public void paint(Graphics graphics)
    	{
    		
    		if((Display.getWidth() == 480) && (Display.getHeight() == 360))
    		{
    		graphics.clear();
    		graphics.drawBitmap(0, 0, Display.getWidth(), Display.getHeight(),backgroundBitmap, 0, 0);
    		super.paint(graphics);
    		}
    		else if((Display.getWidth() == 360) && (Display.getHeight() == 480))
    		{
    			graphics.clear();
    			graphics.drawBitmap(0, 0, Display.getWidth(), Display.getHeight(),backgroundBitmap2, 0, 0);
    			super.paint(graphics);
    		}
    		else if((Display.getWidth() == 320) && (Display.getHeight() == 240))
    		{
    			graphics.clear();
    			graphics.drawBitmap(0, 0, Display.getWidth(), Display.getHeight(),backgroundBitmap3, 0, 0);
    			super.paint(graphics);
    		}
    		
    	}
    };
    	
    VerticalFieldManager verticalFieldManager = new VerticalFieldManager(Field.FIELD_VCENTER | USE_ALL_WIDTH);
   
    b1 = new ButtonField("  Mens Sports  ",ButtonField.NEVER_DIRTY | FIELD_VCENTER | FIELD_HCENTER);
    b2 = new ButtonField("Womens Sports",ButtonField.NEVER_DIRTY |  FIELD_VCENTER | FIELD_HCENTER);
    
    verticalFieldManager.add(b1);
	verticalFieldManager.add(b2);
	horizontalFieldManager.add(verticalFieldManager);			
	 
    
    b1.setChangeListener(this);
    b2.setChangeListener(this);
    this.add(horizontalFieldManager);
    
            }

public void fieldChanged(Field field, int context){
    
    
    if(field instanceof ButtonField)
    {
        String lbl = ((ButtonField)field).getLabel();
        
        if(lbl.equals("  Mens Sports  ")){
            
            Mens_Sports mens = new Mens_Sports();
            UiApplication.getUiApplication().pushScreen(mens);
            
            }
            
            else if(lbl.equals("Womens Sports")){
                
            	Womens_Sports womens = new Womens_Sports();
                UiApplication.getUiApplication().pushScreen(womens);
                
           }
     	}  
	}
}