android placing bitmap in middle

pearmak picture pearmak · Feb 3, 2013 · Viewed 9k times · Source

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> 

Answer

azamani picture azamani · Nov 25, 2015
    // You can try this :         

            int width = containerBitmap.getWidth();
            int height = containerBitmap.getHeight();
            float centerX = (width  - centeredBitmap.getWidth()) * 0.5f;
            float centerY = (height- centeredBitmap.getHeight()) * 0.5f;
            mCanvas.drawBitmap(centeredBitmap, centerX, centerY, paint);

You can use it to draw a bitmap at the center of another bitmap.