Search code examples
androidbitmapdrawbitmap

android placing bitmap in middle


I am designing a drawing app where user can import image from gallery and then scale up or down to fit the screen width or height. so that user can draw onto the imported picture, using the below code.

I am extending View, named DrawView. The DrawView is same as screenwidth, but its height is less than screenheight because there are some buttons above it, placing the DrawView to the bottom of the Screen under the functioning buttons, and so I declared DrawViewHeight.

See below for examples for dimension and results of variables.

Question:

The bitmap can be properly loaded and scaled to fit to the DrawView.

However, it is located at the top of the DrawView. I would like to place it in the middle of the screen, so i added the following code but still FAILS.

bitmapCanvas.drawBitmap(bitmap, x_adjustment, y_adjustment, null);

How could it be further modified such that the imported image (decoded and copied as bitmap while importing) is placed center of DrawView, with blank space (eg. white) above and below and left and right of the loaded scaled bitmap image?

Note: Those surrounding space around the image are not to be drawn onto by user.

Codes:

Declarations:

private Bitmap bitmap; // drawing area for display or saving
private Canvas bitmapCanvas; // used to draw on bitmap

OnSizeChanged:

   public void onSizeChanged(int w, int h, int oldW, int oldH)
   {
      super.onSizeChanged(w, h, oldW, oldH);
      DrawViewWidth = w;       
      DrawViewHeight = h;

      bitmap = Bitmap.createBitmap(getWidth(), DrawViewHeight, Bitmap.Config.ARGB_8888);
      bitmapCanvas = new Canvas(bitmap);
      bitmap.eraseColor(Color.WHITE); // erase the BitMap with white            
   } 

OnDraw:

   @Override
   protected void onDraw(Canvas canvas)  // called each time this View is drawn 
   {
      canvas.drawBitmap(bitmap, 0, 0, paintScreen);       
   } 

Load Pictures:

   public void load_pic(final String picturePath) 
   {   

// get screen dimension first
WindowManager wm = (WindowManager) context_new.getSystemService(Context.WINDOW_SERVICE);
Display display = wm.getDefaultDisplay();
final int screenWidth = display.getWidth();
final int screenHeight = display.getHeight(); 

//get importing bitmap dimension
Options op = new Options();
op.inJustDecodeBounds = true;
Bitmap pic_to_be_imported = BitmapFactory.decodeFile(picturePath, op);
final int x_pic = op.outWidth;
final int y_pic = op.outHeight;

// scaling     
final int IMAGE_MAX_SIZE= (int) Math.max(DrawViewWidth, DrawViewHeight);

int scale = 1;
if (op.outHeight > IMAGE_MAX_SIZE || op.outWidth > IMAGE_MAX_SIZE) {
scale = (int)Math.pow(2, (int) Math.round(Math.log(IMAGE_MAX_SIZE /  (double) Math.max(op.outHeight, op.outWidth)) / Math.log(0.5)));  }

final BitmapFactory.Options o2 = new BitmapFactory.Options();
o2.inSampleSize = scale;



// Start loading image to the DrawView

if ((x_pic > DrawViewWidth) || (y_pic > DrawViewHeight))
{

AlertDialog.Builder onBackBuilder = new AlertDialog.Builder(context_new);

onBackBuilder.setPositiveButton(R.string.buttontext_create_load_pic_stretch, new DialogInterface.OnClickListener() 
    {
        //skipped
    }


onBackBuilder.setNegativeButton(R.string.buttontext_create_load_pic_keep_scale, new DialogInterface.OnClickListener() 
{
    public void onClick(DialogInterface dialog, int id) 
    {                       

    float xratio = (float) x_pic / (float) screenWidth;
    float yratio = (float) y_pic / (float) DrawViewHeight;
    int adjusted_x = 0;
    int adjusted_y = 0;

    if (xratio >= yratio) {adjusted_x = screenWidth; adjusted_y = (int) (y_pic / xratio);}
    if (xratio < yratio) {adjusted_y = DrawViewHeight; adjusted_x = (int) (x_pic / yratio);}                      

    bitmap = (BitmapFactory.decodeFile(picturePath, o2));
    bitmap = bitmap.copy(Bitmap.Config.ARGB_8888, true);
    bitmap = Bitmap.createScaledBitmap(bitmap, adjusted_x, adjusted_y, true);                     

    int x_adjustment = (screenWidth - adjusted_x) /2;
    int y_adjustment = (DrawViewHeight -adjusted_y) /2;

    bitmapCanvas.drawBitmap(bitmap, x_adjustment, y_adjustment, null);

    // How to modify to put to center of DrawView????                 

    invalidate();
    }             
});

AlertDialog alert = onBackBuilder.create();
alert.show();          
}

Examples of dimension and results of variables:

Screen         : 480W * 800H
DrawView       : 480W * 590H
Original image : 3264W * 2448H
Scaled image   : adjusted_x=480 (meet screenwidth), adjusted_y=360
x_adjustment   : 0
y-adjustment   : 115

Layout.xml

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout 
    xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

<com.pearmak.drawing.DrawView
            xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@+id/drawView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:layout_gravity="center_vertical|center_horizontal|center"
            android:background="@drawable/drawview_border" />

</RelativeLayout> 

Solution

  • In your onDraw() you specify (0,0) as the bitmap (x,y) which will draw it at the top left corner of your DrawView so your x_adjustment, y_adjustment effect is lost once onDraw is called.

    You should do your bitmap location adjustment code inside onDraw not inside onClick

    @Override
    protected void onDraw(Canvas canvas)  // called each time this View is drawn 
    {
      canvas.drawBitmap(bitmap, x_adjustment, y_adjustment, null);       
    }