移动，缩放和裁剪android中的图像像facebook个人资料图片

Question

我想在我的应用程序中裁剪图像。我尝试了很多但没有成功。 它对Android开发人员的挑战。 是否有任何想法或参考实现功能移动，缩放和裁剪Android中的图像像Facebook上传个人资料pic。 现在我能够移动，缩放和裁剪图像。但不像facebook那样一致。我想根据方向设置修正图像比例。我附加了屏幕截图-3。

我的代码如下： -

crop_image.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical" >

    <FrameLayout
        android:id="@+id/flCrop"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" >

        <ImageView
            android:id="@+id/img"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scaleType="matrix"
            android:src="@drawable/nature" />

        <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:layout_gravity="center"
            android:scaleType="fitXY"
            android:src="@drawable/blur_with_frame"
            android:visibility="visible" />

        <ImageView
            android:id="@+id/troll_face"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="10dp"
            android:layout_gravity="bottom" />
    </FrameLayout>

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal" >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:onClick="btnSelectPic"
            android:layout_marginRight="10dp"
            android:text="select Pic" />

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="10dp"
            android:onClick="btnCrop"
            android:text="Crop" />
    </LinearLayout>

</LinearLayout>

MainActivity.java

package com.hotveryspicy.maskimage;

import android.app.Activity;
import android.content.Intent;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Matrix;
import android.graphics.PointF;
import android.net.Uri;
import android.os.Bundle;
import android.util.FloatMath;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewTreeObserver.OnGlobalLayoutListener;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.ImageView.ScaleType;

import com.ipaulpro.afilechooser.utils.FileUtils;

public class MainActivity extends Activity implements OnTouchListener{
    ImageView img;
    FrameLayout flCrop;

    int framWidth = 0;
    int framHeight = 0;

    int imageHeight ;
    int imageWidth ;

    int cropImageWidth = 320;
    int cropImageHeight = 263;

    public static int SELECT_PHOTO =0;

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.crop_image);
        img = (ImageView) findViewById(R.id.img);
        flCrop = (FrameLayout) findViewById(R.id.flCrop);
        img.setOnTouchListener(this);


    }

    public void btnCrop(View v) {
        ImageView troll_face = (ImageView) findViewById(R.id.troll_face);
        makeMaskImage(troll_face, R.drawable.nature);
    }

    public void btnSelectPic(View v){
        Intent intent = new Intent(Intent.ACTION_PICK,
                android.provider.MediaStore.Images.Media.EXTERNAL_CONTENT_URI);
        startActivityForResult(intent, 0);
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
        super.onActivityResult(requestCode, resultCode, data);

        switch (resultCode) {
        case RESULT_OK:
            Uri targetUri = data.getData();

            final String path = FileUtils.getPath(this, targetUri);

            BitmapFactory.Options options = new BitmapFactory.Options();
            options.inJustDecodeBounds = true;

            Bitmap bitmap = null;
            try {

                bitmap = BitmapFactory
                        .decodeFile(path);
            } catch (Exception e) {
                // TODO Auto-generated catch block
                e.printStackTrace();
            }
            imageHeight = options.outHeight;
            imageWidth = options.outWidth;

            img.setOnTouchListener(MainActivity.this);

            img.setImageBitmap(bitmap);

            break;
        }
    }

    // Method of creating mask runtime
    public void makeMaskImage(ImageView mImageView, int mContent) {

        flCrop.setDrawingCacheEnabled(true);
        Bitmap bitmap = Bitmap.createBitmap(flCrop.getDrawingCache());
        flCrop.setDrawingCacheEnabled(false);

        Log.e("TEST", "Frame W : " + framWidth + " H : " + framHeight);
        Log.e("TEST",
                "Bitmap W : " + bitmap.getWidth() + " H : "
                        + bitmap.getHeight());

        Bitmap result = Bitmap.createBitmap(bitmap, (framWidth / 2)
                - (cropImageWidth / 2) +1, (framHeight / 2)
                - (cropImageHeight / 2), cropImageWidth -2, cropImageHeight);
        mImageView.setImageBitmap(result);
        mImageView.setScaleType(ScaleType.CENTER);
        // mImageView.setBackgroundResource(R.drawable.frame);
    }





    @Override
      public boolean onTouch(View v, MotionEvent event) {
            // handle touch events here
            ImageView view = (ImageView) v;
            switch (event.getAction() & MotionEvent.ACTION_MASK) {
                case MotionEvent.ACTION_DOWN:
                    savedMatrix.set(matrix);
                    start.set(event.getX(), event.getY());
                    mode = DRAG;
                    lastEvent = null;
                    break;
                case MotionEvent.ACTION_POINTER_DOWN:
                    oldDist = spacing(event);
                    if (oldDist > 10f) {
                        savedMatrix.set(matrix);
                        midPoint(mid, event);
                        mode = ZOOM;
                    }
                    lastEvent = new float[4];
                    lastEvent[0] = event.getX(0);
                    lastEvent[1] = event.getX(1);
                    lastEvent[2] = event.getY(0);
                    lastEvent[3] = event.getY(1);
                    d = rotation(event);
                    Log.e("MainActivity","MainActivity down d = "+d);
                    break;
                case MotionEvent.ACTION_UP:
                case MotionEvent.ACTION_POINTER_UP:
                    mode = NONE;
                    lastEvent = null;
                    break;
                case MotionEvent.ACTION_MOVE:
                    if (mode == DRAG) {
                        matrix.set(savedMatrix);
                        float dx = event.getX() - start.x;
                        float dy = event.getY() - start.y;
                        Log.e("TEST","Dx : "+ dx+" Dy : "+ dy);
                        matrix.postTranslate(dx, dy);
                    } else if (mode == ZOOM) {
                        float newDist = spacing(event);
                        if (newDist > 10f) {
                            matrix.set(savedMatrix);
                            float scale = (newDist / oldDist);
                            matrix.postScale(scale, scale, mid.x, mid.y);
                        }
                        if (lastEvent != null && event.getPointerCount() == 3) {
                            newRot = rotation(event);
                            Log.e("MainActivity","MainActivity move d= "+d);
                            float r = newRot - d;
                            float[] values = new float[9];
                            matrix.getValues(values);
                            float tx = values[2];
                            float ty = values[5];
                            float sx = values[0];
                            float xc = (view.getWidth() / 2) * sx;
                            float yc = (view.getHeight() / 2) * sx;
                            matrix.postRotate(r, tx + xc, ty + yc);
                        }
                    }
                    break;
                 default:
                     view.setImageMatrix(matrix);
                     return true;
            }
            view.setImageMatrix(matrix);
            return true;
        }

        /**
         * Determine the space between the first two fingers
         */
        private float spacing(MotionEvent event) {
            float x = event.getX(0) - event.getX(1);
            float y = event.getY(0) - event.getY(1);
            return FloatMath.sqrt(x * x + y * y);
        }

        /**
         * Calculate the mid point of the first two fingers
         */
        private void midPoint(PointF point, MotionEvent event) {
            float x = event.getX(0) + event.getX(1);
            float y = event.getY(0) + event.getY(1);
            point.set(x / 2, y / 2);
        }

        /**
         * Calculate the degree to be rotated by.
         *
         * @param event
         * @return Degrees
         */
        private float rotation(MotionEvent event) {
            double delta_x = (event.getX(0) - event.getX(1));
            double delta_y = (event.getY(0) - event.getY(1));
            double radians = Math.atan2(delta_y, delta_x);
            return (float) Math.toDegrees(radians);
        }
        // these matrices will be used to move and zoom image
        private static Matrix matrix = new Matrix();
        private static Matrix savedMatrix = new Matrix();
        // we can be in one of these 3 states
        private static final int NONE = 0;
        private static final int DRAG = 1;
        private static final int ZOOM = 2;
        private int mode = NONE;
        // remember some things for zooming
        private PointF start = new PointF();
        private PointF mid = new PointF();
        private float oldDist = 1f;
        private float d = 0f;
        private float newRot = 0f;
        private float[] lastEvent = null;

        boolean flag ;
}

看我的演示： -

截图-1

缩小图片如下图所示： - 截图2

我到底在寻找解决方案： - 截图-3

如果有人有想法。请帮助我。提前谢谢......

Answer 1

我有类似的要求。使用修改的Photoview和Cropper库创建裁剪组件。用户可以从图库中选择图像或从相机拍摄照片，然后使用移动和缩放裁剪图像，类似于Facebook个人资料图片裁剪。在github上共享项目。

请在这里查看github项目： https://github.com/ozeetee/AndroidImageZoomCrop

Answer 2

我不完全明白你想要完成的事情。我一直在做类似的事情，我想。

---

https://github.com/crystalpal/cropper

---

这样做：从存储中读取图像，将其与裁剪矩形一起显示，让您裁剪所选区域，并保存裁剪后的图像。您可以调整裁剪器的大小和保存图像的大小。

使用intent，将图像文件传递给新活动。从那里开始，一切都应该是自动的。

注意：这个项目是用Android 4.2编写的，代码是记录在案的，但推荐使用Android方面的知识。该项目使用qoppa pdf库。

Answer 3

当我实现图像捕获和裁剪功能时，我已经从下面的教程中参考了。我相信这对你有所帮助。 让我知道，如果有任何问题。我会尝试进一步帮助：）

http://code.tutsplus.com/tutorials/capture-and-crop-an-image-with-the-device-camera--mobile-11458