Set the Background Image of a SurfaceView

Question

Is there a way to set the background image of a SurfaceView? Does it have to be done in xml or can I do it all in Java - I've got something that looks like this in my constructor:

Drawable sky = (getResources().getDrawable(R.drawable.sky));
    this.setBackgroundDrawable(sky);

But it still doesn't show anything.

Answer 1

You cannot set a background drawable on a SurfaceView. You'll have to draw the background onto the surface yourself.

Answer 2

Try this

public void surfaceCreated(SurfaceHolder arg0) {
    Bitmap background = BitmapFactory.decodeResource(getResources(), R.drawable.background);
    float scale = (float)background.getHeight()/(float)getHeight();
    int newWidth = Math.round(background.getWidth()/scale);
    int newHeight = Math.round(background.getHeight()/scale);
    Bitmap scaled = Bitmap.createScaledBitmap(background, newWidth, newHeight, true);
}

public void onDraw(Canvas canvas) {
    canvas.drawBitmap(scaled, 0, 0, null); // draw the background
}

Answer 3

While you can't directly set a background image to a SurfaceView, you can overlap an ImageView (displaying your background image) and your SurfaceView on top of this, making it transparent.

I had performances issues when drawing a 1920x1080 bitmap as a background image for each SurfaceView repaint: the only solution I found (thanks to this answer) was using an ImageView displaying this 1920x1080 (fixed) bitmap, and using my SurfaceView on top of it, making it transparent, to avoid painting the big background image for each SurfaceView repaint. Now my app is much smoother, thanks to this code:

// Setup your SurfaceView
SurfaceView surfaceView = ...;  // use any SurfaceView you want
surfaceView.setZOrderOnTop(true);
surfaceView.getHolder().setFormat(PixelFormat.TRANSPARENT);

// Setup your ImageView
ImageView bgImagePanel = new ImageView(context);
bgImagePanel.setBackgroundResource(...); // use any Bitmap or BitmapDrawable you want

// Use a RelativeLayout to overlap both SurfaceView and ImageView
RelativeLayout.LayoutParams fillParentLayout = new RelativeLayout.LayoutParams(
    RelativeLayout.LayoutParams.FILL_PARENT, RelativeLayout.LayoutParams.FILL_PARENT);
RelativeLayout rootPanel = new RelativeLayout(context);
rootPanel.setLayoutParams(fillParentLayout);
rootPanel.addView(surfaceView, fillParentLayout); 
rootPanel.addView(bgImagePanel, fillParentLayout); 

Then you shall start your SurfaceView's paint method with this: (in order to "flush" the previous drawn image in SurfaceView's buffer)

canvas.drawColor(0, PorterDuff.Mode.CLEAR);

Answer 4

A small addition to the answer by xav. You'd want to set the content view as rootPanel afterwards:

setContentView(rootPanel);

Also, since FILL_PARENT is deprecated, consider using MATCH_PARENT in both places.

Answer 5

your surfaceView.setBackground(getResources().getDrawable(R.drawable.?));