简体   繁体   中英

How to Draw Portion of Bitmap via Canvas DrawBitmap

I have an
来源条件 :

  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:

第一个案件的结果

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:
案例#2
how can i achieve this result:
案例#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!

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!

PS Sorry for my eng :).

If your sourceBitmap is just bitmap set into ImageView then result is predictable. To achieve your goal you need:

  1. Orange square coordinates in coordinates of FrameLayout . Looks like you already have correct ones.
  2. As sourceBitmap you have to use Bitmap created by your FrameLayout.draw method. Notice that your orange square have to be not FrameLayout's child.

If you post all of your code somewhere I can check it.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM