Crop and Zoom Image without Moving Overlay View Instead Move Image in ImageView

Question

Hi I want to crop Image without moving Overlay view instead move Image. enter image description here

The image can be moved all around. I would like to crop and save the highlighted area as shown below inside the black border.

I have ImageView with android:scaleType="matrix"

Here's my layout code

<RelativeLayout
    android:id="@+imageEdit/rl_ScaleImage"
    android:layout_width="match_parent"
    android:layout_height="fill_parent"
    android:layout_below="@+imageEdit/Topbar"
    android:visibility="visible" >

    <ImageView
        android:id="@+imageEdit/imageView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_alignParentLeft="true"
        android:scaleType="matrix" />

    <View
        android:id="@+imageEdit/viewTop"
        android:layout_width="fill_parent"
        android:layout_height="50dp"
        android:layout_alignParentTop="true"
        android:background="#99000000" />

    <View
        android:id="@+imageEdit/view_scaledImage"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_above="@+imageEdit/viewBottom"
        android:layout_below="@+imageEdit/viewTop"
        android:background="@drawable/rounded_corner_small" />

    <View
        android:id="@+imageEdit/viewBottom"
        android:layout_width="fill_parent"
        android:layout_height="150dp"
        android:layout_alignParentBottom="true"
        android:background="#99000000" />
</RelativeLayout>

ImageView has OnTouchListener. Image can be zoomed in or zoomed out and is also movable in ImageView1. View view_scaledImage is the area which I want to crop and save. How do I do this?

possible duplicate of [How to crop an image in android?](http://stackoverflow.com/questions/3846338/how-to-crop-an-image-in-android) — Maveňツ, Aug 05 '14 at 11:59
I have also checked that but this could not produce me the solution. Please suggest how to get the highlighted are coordinates. can you please provide some code — Raj, Aug 05 '14 at 12:01
@Raj Did u get the solution ? Actually I am also looking for the same.. can you give me the solution if it is resolved. Thanks in advance. — Ramesh Akula, Jan 27 '15 at 04:57
@Raj Finally I got the solution.. will update with my answer soon. — Ramesh Akula, Feb 09 '15 at 12:20
@Raj I answered and gave the github link.. you can accept as answer if it is eligible. — Ramesh Akula, Feb 10 '15 at 12:32

score 4 · Accepted Answer · answered Feb 10 '15 at 11:14

4

Finally I got the solution by combining Cropper library and PhotoView libraries.

https://github.com/rameshkec85/AndroidCropMoveScaleImage

answered Feb 10 '15 at 11:14

Ramesh Akula

5,720
4
43
67

Hi Ramesh Akula,i am using the above library it works fine but i facing the one issue.bitmap image is moved to outside of the overlay when zooming?please help me Thanks in Advance – Ashok Aug 28 '15 at 06:30

score 0 · Answer 2 · answered Dec 30 '14 at 11:35

You can use cropimage library. Add this line to your manifest file:

 <activity android:name="eu.janmuller.android.simplecropimage.CropImage" />

Select image from gallery or camera and call this function:

public void runCropImage(String path) {
    Intent intent = new Intent(this, CropImage.class);
    intent.putExtra(CropImage.IMAGE_PATH, path);
    intent.putExtra(CropImage.SCALE, true);
    intent.putExtra(CropImage.ASPECT_X, 2);//change ration here via intent
    intent.putExtra(CropImage.ASPECT_Y, 2);
    startActivityForResult(intent, REQUEST_CODE_CROP_IMAGE);//final static int 1
}

And in your onActivityResult:

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    // TODO Auto-generated method stub
    super.onActivityResult(requestCode, resultCode, data);
    switch (requestCode) {
    // gallery and camera ommitted
    case REQUEST_CODE_CROP_IMAGE:
        String path = data.getStringExtra(CropImage.IMAGE_PATH);
        // if nothing received
        if (path == null) {
            return;
        }
        // cropped bitmap
         Bitmap bitmap = BitmapFactory.decodeFile(path);
        imageView.setImageBitmap(bitmap);
        break;
    default:
        break;
    }
}

This library has zooming functionality too. Check the example in the link I mentioned

score 0 · Answer 3 · answered Dec 30 '14 at 16:46

This is how you can get the coordinates of any View in relation to the the current Window:

public Rect getViewPositionRelative(View v) {
   //Locate on screen
   int[] location = new int[2];
   view.getLocationInWindow(location); //change to getLocationOnScreen(location) for an absolute positioning

   Rect rect = new Rect();
   rect.left = location[0];
   rect.top = location[1];
   rect.right = rect.left + v.getWidth();
   rect.bottom = rect.top + v.getHeight();
   return rect;
}

Using this method you can get the area of both the ImageView and the overlay View, and then calculate the crop area using some base math ;)

Crop and Zoom Image without Moving Overlay View Instead Move Image in ImageView

3 Answers3