Search code examples
androidcanvasbitmapborderdrawbitmap

How to Draw Portion of Bitmap via Canvas DrawBitmap


I have an
source condition:

  1. FrameLayout(marked with red)
  2. Source ImageView(black)
  3. Object(imageview) with OnTouchListener (orange)

Via Object with OnTouchListener,i want to show a portion of bitmap,that are filled on imageview(source imageview).

So it's not a problem,i'm doing like this:
Bitmap bt = Bitmap.createBitmap(sourceBitmap,event.getX(),event.getY(),250,250);

where:

  1. SourceBitmap - is an image that are added to source ImageView
  2. event.getX() / event.getY() is an coord,where i start to draw portion of bitmap
  3. 250,250 - its an size of portion bitmap(part).

and the result is:

result of first case

So the problems occurs,when my object(with touchlistener),going to the border(i have made this possibility for orange object,to go out of border with Object.width()/2).

So in this case:
case #2
how can i achieve this result:
excepted result of case #2
where result of portion will be:

  1. Part of bitmap
  2. second part is color of framelayout background.

What i tried at current moment:

public boolean onTouch(View view, MotionEvent event) {

    switch (event.getAction()) {
        case MotionEvent.ACTION_MOVE:

            //i want to draw bigger portion then corrds
            int CurrentX = (int)view.getX() - (view.getWidth());
            int CurrentY = (int)view.getY() - (view.getHeight());

            //case,when object is going out of border
            if(CurrentX <= 0)
            {
                Paint paint = new Paint();
                paint.setStyle( Style.FILL  );
                paint.setColor( Color.RED );

                mBitmap = Bitmap.CreateBitmap(sourceBitmap,(int)view.getX() + Math.abs(CurrentX),(int)view.getY(),250,250);
                Canvas canvas = new Canvas(mBitmap);
                canvas.drawBitmap(mBitmap,new Rect((int)view.getX()+Math.abs(CurrentX), (int)view.getY(),250-Math.abs(CurrentX),250),new RectF(Math.abs(CurrentX), 0, 250,250),paint);
            }
            break;
    }

    return true;
}
}

Any suggestions? Thanks!


Solution

  • Solved by myself!
    It was complicated,but result is pretty nice.
    Here we go:
    So for my case(when object with OnTouchListener can go out of border On X and Y axes),i've made Post Conditions(some kind of regulations).


    Conditions

    Width = Width of imageView,where i want to show result.
    Height = Height of imageView,where i want to show result;

    LeftSide

    1. X_Coord < 0 && Y_Coord - Height / 2 < 0 && Y_Coord < Bitmap.Height
      This is our Top Area.
    2. X_Coord < 0 && Y_Coord - Height / 2 > 0 && Y_Coord < Bitmap.Height
      This is our Middle Area.
    3. X_Coord < 0 && Y_Coord - Height / 2 > 0 && Y_Coord > Bitmap.Height
      This is our Bottom Area.

    RightSide

    1. X_Coord > Bitmap.Height && Y_Coord - Height / 2 > 0 && Y_Coord < Bitmap.Height
      This is our Middle Area.
    2. X_Coord > Bitmap.Height && Y_Coord - Height / 2 < 0 && Y_Coord < Bitmap.Height
      This is our Top Area.
    3. X_Coord > Bitmap.Height && Y_Coord - Height / 2 > 0 && Y_Coord > Bitmap.Height
      This is our Bottom Area.

    Standart(Area of Middle,that are not going to Left or Right side)

    1. X_Coord - Width / 2 > 0 && X_Coord < Bitmap.Width && Y_Coord - Height / 2 < 0 && Y_Coord < Bitmap.Height
      This is our Top Area.
    2. X_Coord - Width / 2 > 0 && X_Coord < Bitmap.Width && Y_Coord - Height / 2 > 0 && Y_Coord > Bitmap.Height
      This is our Bottom Area.
    3. X_Coord - Width / 2 > 0 && X_Coord < Bitmap.Width && Y_Coord - Height / 2 > 0 && Y_Coord < Bitmap.Height
      This is our Middle Area.

    So via this "Conditions",i'm drawing portion of bitmap on my MotionEvent.ACTION_MOVE case.
    Let's see some example:

    public boolean onTouch(View view, MotionEvent event) {
    
        switch (event.getAction()) {
            case MotionEvent.ACTION_MOVE:
    
            int Width = ResultImgView.getWidth();
            int Height = ResultImgView.getHeight();
            //paint for our Red background
            Paint paint = new Paint();
            paint.setStyle( Style.FILL  );
            paint.setColor( Color.RED );
            Bitmap mBitmap = null;
            Canvas canvas = null;
    
            //Our Condition 
            if(view.getX() - Width / 2 >= SourceBitmap.getWidth() 
                && view.getY() - Height / 2 > 0 && view.getY() + Height / 2 <  SourceBitmap.getHeight())
            {
                //Nice,we entered here. Seems that we're now located at RightSide at Middle position
                //So let's draw part of bitmap.
                //our margin for X coords
                int Difference = (int)((view.getX() - Width / 2 ) - SourceBitmap.getWidth();
                //dont forget to put margin
                //BTW we're now took portion of bitmap
                mBitmap = Bitmap.createBitmap(SourceBitmap, ((int)view.getX() - Width / 2) - Difference, (int)view.getY() - Height / 2, Width,Height);
                canvas = new Canvas(mBitmap);
                //draw rect
                canvas.drawRect(0,0,mBitmap.getWidth(),mBitmap.getHeight(),paint);
                //draw portion of bitmap
                canvas.drawBitmap(mBitmap,new Rect(Difference, 0,mBitmap.getWidth(),mBitmap.getHeight()),new Rect(0,0,mBitmap.getWidth() - Difference,mBitmap.getHeight()),null);
                //and that's all!
            }
    
            //do the same for other  condition....etc
            break;
    }
    
    
    
       return true;
    }
    

    Enjoy!