How do I make a background image fill and fit the screen?


Last Updated:

  1. EightBitSpade

    EightBitSpade Member This Topic's Starter

    Joined:
    Sep 29, 2010
    Messages:
    5
    Likes Received:
    0
    Hello everyone! I've started learning about drawing things to the screen with Surface view and canvases, but I've run into a problem. At the moment, all I want to do is draw a background image to the screen, and have it fit the screen, regardless of size or resolution. I've figured out how to draw the image just fine, but it doesn't fit the screen at all.

    Here is my situation: I'm developing on an Archos 5 internet tablet. It has a 4.8 inch screen and a resolution of 800x480 - putting it in the "Large" class of screens and "Medium" class of pixel density for Android. My background image is 800x480 - my thinking was that it would be displayed perfectly on my device, and scaled down on smaller screens.

    But this isn't happening. When I place my image in the "medium" density drawables folder, the image seems "zoomed in" and I can't see it all on my device. And when I emulate the app with different screen sizes, it's all over the place.

    I'm drawing my image in a Panel which extends Surface View. Here is the code:

    Code (Text):
    1.  
    2. package com.plant.drawing;
    3.  
    4. import android.graphics.BitmapFactory;
    5. import android.graphics.Canvas;
    6. import android.view.SurfaceView;
    7. import android.view.SurfaceHolder;
    8. import android.content.Context;
    9. import android.graphics.Bitmap;
    10. import android.graphics.Color;
    11. import android.graphics.Paint;
    12. import android.util.AttributeSet;
    13. import android.view.MotionEvent;
    14.  
    15.  
    16. class Panel extends SurfaceView implements SurfaceHolder.Callback {
    17.     CanvasThread canvasthread;
    18.     //The interface requires us to have three methods:
    19.     //surfaceCreated, surfaceDestroyed, and surfaceChanged
    20.    
    21.     @Override
    22.     public void surfaceChanged(SurfaceHolder holder, int format, int width, int height)
    23.     {
    24.        
    25.     }
    26.    
    27.     @Override
    28.     public void surfaceCreated(SurfaceHolder holder)
    29.     {
    30.         canvasthread.setRunning(true);
    31.         canvasthread.start();
    32.     }
    33.    
    34.     @Override
    35.     public void surfaceDestroyed(SurfaceHolder holder)
    36.     {
    37.         boolean retry = true;
    38.         canvasthread.setRunning(false);
    39.         while(retry)
    40.         {
    41.             try
    42.             {
    43.                 canvasthread.join();
    44.                 retry = false;
    45.             } catch (InterruptedException e) {
    46.                 //we try again and again...
    47.             }
    48.         }
    49.     }
    50.    
    51.     //Constructor
    52.     public Panel(Context context, AttributeSet attrs)
    53.     {
    54.         super(context, attrs);
    55.         //TODO stuff
    56.         getHolder().addCallback(this);
    57.         canvasthread = new CanvasThread(getHolder(), this);
    58.         setFocusable(true);
    59.     }
    60.    
    61.     @Override
    62.     public void onDraw(Canvas canvas)
    63.     {
    64.         Paint paint = new Paint();
    65.        
    66.         Bitmap plantBG = BitmapFactory.decodeResource(getResources(),      R.drawable.plantappbg);
    67.         canvas.drawColor(Color.BLACK);
    68.         canvas.drawBitmap(plantBG, 0, 0, null);
    69.     }
    70.      
    71. }
    72.  
    In my layout, I set this panel's properties of layout height and width to "wrap content."

    I'm really new to Surface views and the like, so I'm sure I'm simply not doing something - but what can I do to make this image fill the background of any size screen? The image is a .png, by the way.
     

    Advertisement
  2. EightBitSpade

    EightBitSpade Member This Topic's Starter

    Joined:
    Sep 29, 2010
    Messages:
    5
    Likes Received:
    0
    Figured out that drawing a background image on an image view gets my background sized like I want it, but it doesn't jive with my Panel (surface view.) I can either have one or the other, depending on their order but not both. I read somewhere else that one method is to use the background image as a background for the root layout, but that doesn't work - it never gets drawn.

    Has anyone else had any experience in this area?
     
  3. Haylowlow3

    Haylowlow3 New Member

    Joined:
    Dec 13, 2011
    Messages:
    2
    Likes Received:
    0
    Go to ur market and download dodol wallpaper. Wi"l make all ur pics fit PERFECTLY. Some 9yr old kid sh
    owd me this..daaamn:rolleyes:
     
  4. Haylowlow3

    Haylowlow3 New Member

    Joined:
    Dec 13, 2011
    Messages:
    2
    Likes Received:
    0
    Dodol wallpaper app
     

Share This Page

Loading...