Android实现图片裁剪处理的操作步骤
作者:望佑
这篇文章介绍了构建具有图片选择、裁剪(含手动缩放和旋转)及保存到自定义路径功能的 Android 应用 demo 的步骤,包括设置权限、创建布局文件、实现自定义视图CustomCropImageView、更新Activity逻辑等,最终完成了具有完整裁剪功能的应用,需要的朋友可以参考下
前言
本文将介绍如何构建一个支持图片选择、裁剪(包括手动缩放和旋转)、以及保存到自定义路径的Android应用demo。
步骤 1: 设置权限
首先,在AndroidManifest.xml中添加必要的权限:
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
对于 Android 6.0 (API level 23) 及以上版本,需要在运行时请求权限。
步骤 2: 创建布局文件
创建一个简单的布局文件activity_main.xml,包含一个用于显示图片的CustomCropImageView,以及几个按钮用于控制裁剪操作。
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.CustomCropImageView
android:id="@+id/customCropImageView"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<Button
android:id="@+id/buttonPickImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Pick Image"
android:layout_below="@id/customCropImageView" />
<Button
android:id="@+id/buttonCrop"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Crop"
android:layout_toEndOf="@id/buttonPickImage"
android:layout_below="@id/customCropImageView" />
<Button
android:id="@+id/buttonCancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Cancel"
android:layout_toEndOf="@id/buttonCrop"
android:layout_below="@id/customCropImageView" />
<Button
android:id="@+id/buttonSave"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Save"
android:layout_toEndOf="@id/buttonCancel"
android:layout_below="@id/customCropImageView" />
</RelativeLayout>
步骤 3: 实现自定义View CustomCropImageView
接下来,我们将详细实现CustomCropImageView,这个自定义视图负责所有与裁剪相关的交互逻辑。
CustomCropImageView.java
```java
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.ScaleGestureDetector;
import android.widget.FrameLayout;
public class CustomCropImageView extends FrameLayout {
// 成员变量定义
private Bitmap mBitmap; // 要裁剪的图片
private Matrix mMatrix = new Matrix(); // 用于变换(缩放、旋转)图像的矩阵
private RectF mRect = new RectF(); // 定义裁剪框的位置和大小
private float[] mLastTouchPos = new float[2]; // 上次触摸位置,用于计算移动距离
private float[] mCurrentPos = new float[2]; // 当前触摸位置,用于更新图像位置
private float mRotation = 0f; // 图像的旋转角度
private boolean mIsDragging = false; // 标记是否正在拖动图像
private ScaleGestureDetector mScaleDetector; // 检测多点触控缩放手势
private GestureDetector mGestureDetector; // 检测单点触控手势(如点击)
// 构造函数,初始化自定义视图
public CustomCropImageView(Context context, AttributeSet attrs) {
super(context, attrs);
// 初始化手势检测器
mScaleDetector = new ScaleGestureDetector(context, new ScaleListener());
mGestureDetector = new GestureDetector(context, new GestureListener());
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if (mBitmap != null) {
// 绘制背景蒙层,使非裁剪区域变暗
drawOverlay(canvas);
// 保存当前Canvas状态,以便稍后恢复
canvas.save();
// 将Canvas原点移动到裁剪框中心,进行旋转操作
canvas.translate(mRect.centerX(), mRect.centerY());
canvas.rotate(mRotation);
// 移回原点以绘制旋转后的图像
canvas.translate(-mRect.centerX(), -mRect.centerY());
// 使用变换矩阵绘制图像
canvas.drawBitmap(mBitmap, mMatrix, null);
// 恢复Canvas到之前的状态
canvas.restore();
// 绘制裁剪框,让用户知道哪里会被裁剪
drawCropBox(canvas);
}
}
private void drawOverlay(Canvas canvas) {
Paint paint = new Paint();
// 设置半透明黑色作为蒙层颜色
paint.setColor(Color.argb(128, 0, 0, 0));
// 填充整个视图为半透明黑色
canvas.drawRect(0, 0, getWidth(), getHeight(), paint);
// 创建一个路径,添加裁剪框形状
Path path = new Path();
path.addRect(mRect, Path.Direction.CW);
// 使用canvas.clipPath剪切出裁剪框区域,使其透明
// 注意:Region.Op.DIFFERENCE在API 26以上已被弃用,应考虑使用其他方式实现相同效果
canvas.clipPath(path, Region.Op.DIFFERENCE);
canvas.drawColor(Color.TRANSPARENT, PorterDuff.Mode.CLEAR);
}
private void drawCropBox(Canvas canvas) {
Paint paint = new Paint(Paint.ANTI_ALIAS_FLAG); // 抗锯齿
paint.setStyle(Paint.Style.STROKE); // 只绘制边框,不填充内部
paint.setStrokeWidth(5); // 边框宽度
paint.setColor(Color.BLUE); // 裁剪框颜色设置为蓝色
// 绘制裁剪框矩形
canvas.drawRect(mRect, paint);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
// 分别将事件传递给缩放和手势检测器
mScaleDetector.onTouchEvent(event);
mGestureDetector.onTouchEvent(event);
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
// 记录按下时的坐标,开始拖动
mLastTouchPos[0] = event.getX();
mLastTouchPos[1] = event.getY();
mIsDragging = true;
break;
case MotionEvent.ACTION_MOVE:
if (mIsDragging) {
// 更新当前位置,并根据位移调整矩阵和平移裁剪框
mCurrentPos[0] = event.getX();
mCurrentPos[1] = event.getY();
updateMatrix();
invalidate(); // 请求重新绘制界面
}
break;
case MotionEvent.ACTION_UP:
// 结束拖动
mIsDragging = false;
break;
}
return true;
}
private void updateMatrix() {
// 更新矩阵以反映图像的新位置
mMatrix.setTranslate(mCurrentPos[0] - mLastTouchPos[0], mCurrentPos[1] - mLastTouchPos[1]);
// 同步裁剪框的位置
mRect.offset(mCurrentPos[0] - mLastTouchPos[0], mCurrentPos[1] - mLastTouchPos[1]);
}
private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {
@Override
public boolean onScale(ScaleGestureDetector detector) {
// 获取缩放因子并应用到矩阵上,保持缩放中心点不变
float scaleFactor = detector.getScaleFactor();
mMatrix.postScale(scaleFactor, scaleFactor, detector.getFocusX(), detector.getFocusY());
invalidate(); // 请求重绘以反映变化
return true;
}
}
private class GestureListener extends GestureDetector.SimpleOnGestureListener {
@Override
public boolean onDoubleTap(MotionEvent e) {
// 双击时重置所有变换
resetTransformations();
return true;
}
}
private void resetTransformations() {
// 重置矩阵和旋转角度,以及裁剪框位置
mMatrix.reset();
mRotation = 0f;
mRect.set(/* default values */);
invalidate(); // 请求重绘
}
// 设置要裁剪的图片
public void setImageBitmap(Bitmap bitmap) {
mBitmap = bitmap;
// 根据新图片尺寸调整裁剪框大小
updateCropBoxSize();
requestLayout(); // 请求布局更新
invalidate(); // 请求重绘
}
private void updateCropBoxSize() {
// 根据所选图片的尺寸设置合适的裁剪框大小
int width = mBitmap.getWidth();
int height = mBitmap.getHeight();
float aspectRatio = (float) width / height;
// 设定裁剪框的初始尺寸为图片的中心区域,同时确保其宽高比与原始图片一致
float rectWidth = Math.min(getWidth(), getHeight() * aspectRatio);
float rectHeight = Math.min(getHeight(), getWidth() / aspectRatio);
mRect.set((getWidth() - rectWidth) / 2, (getHeight() - rectHeight) / 2, (getWidth() + rectWidth) / 2, (getHeight() + rectHeight) / 2);
}
// 获取裁剪后的图片
public Bitmap getCroppedBitmap() {
// 创建一个新的位图来容纳裁剪结果
Bitmap croppedBitmap = Bitmap.createBitmap(
(int)mRect.width(),
(int)mRect.height(),
Bitmap.Config.ARGB_8888
);
Canvas canvas = new Canvas(croppedBitmap);
// 平移画布以对齐裁剪框左上角
canvas.translate(-mRect.left, -mRect.top);
// 绘制变换后的原始图片到新的位图中
canvas.drawBitmap(mBitmap, mMatrix, null);
return croppedBitmap;
}
}
自定义的CustomCropImageView,它允许用户通过触摸屏交互来裁剪图片。该视图支持基本的手势操作,包括拖动、缩放和双击重置。此外,还提供了设置图片和获取裁剪后图片的方法。
步骤 4: 更新Activity逻辑
现在我们将更新MainActivity.java,以加载图片到自定义视图,并处理裁剪后的保存逻辑。
MainActivity.java
import android.Manifest;
import android.content.Intent;
import android.content.pm.PackageManager;
import android.graphics.Bitmap;
import android.net.Uri;
import android.os.Bundle;
import android.provider.MediaStore;
import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.appcompat.app.AppCompatActivity;
import androidx.core.app.ActivityCompat;
import androidx.core.content.ContextCompat;
import java.io.File;
import java.io.FileOutputStream;
import java.io.IOException;
public class MainActivity extends AppCompatActivity {
private static final int PICK_IMAGE_REQUEST = 1;
private static final int REQUEST_PERMISSIONS = 2;
private CustomCropImageView customCropImageView;
private Uri imageUri;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
customCropImageView = findViewById(R.id.customCropImageView);
// 检查并请求存储权限
if (ContextCompat.checkSelfPermission(this, Manifest.permission.WRITE_EXTERNAL_STORAGE)
!= PackageManager.PERMISSION_GRANTED) {
ActivityCompat.requestPermissions(this,
new String[]{Manifest.permission.READ_EXTERNAL_STORAGE, Manifest.permission.WRITE_EXTERNAL_STORAGE},
REQUEST_PERMISSIONS);
}
findViewById(R.id.buttonPickImage).setOnClickListener(v -> pickImage());
findViewById(R.id.buttonCrop).setOnClickListener(v -> cropImage());
findViewById(R.id.buttonCancel).setOnClickListener(v -> cancelCrop());
findViewById(R.id.buttonSave).setOnClickListener(v -> saveImage());
}
private void pickImage() {
Intent intent = new Intent(Intent.ACTION_GET_CONTENT);
intent.setType("image/*");
startActivityForResult(intent, PICK_IMAGE_REQUEST);
}
private void cropImage() {
// 如果使用第三方库如uCrop,可以在这里启动裁剪活动
// 这里我们假设CustomCropImageView已经包含了所有裁剪功能
// 因此不需要启动新的活动。
}
private void cancelCrop() {
// 重置CustomCropImageView的状态
customCropImageView.resetTransformations();
}
private void saveImage() {
Bitmap bitmap = customCropImageView.getCroppedBitmap(); // 获取裁剪后的位图
try {
File path = new File(getExternalFilesDir(null), "custom_folder");
if (!path.exists()) {
path.mkdirs();
}
File file = new File(path, "cropped_image.jpg");
FileOutputStream out = new FileOutputStream(file);
bitmap.compress(Bitmap.CompressFormat.JPEG, 90, out);
out.flush();
out.close();
// 提示用户图片已保存
} catch (IOException e) {
e.printStackTrace();
// 处理保存失败的情况
}
}
@Override
protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
super.onActivityResult(requestCode, resultCode, data);
if (requestCode == PICK_IMAGE_REQUEST && resultCode == RESULT_OK && data != null && data.getData() != null) {
imageUri = data.getData();
try {
// 将选择的图片加载到CustomCropImageView中
Bitmap bitmap = MediaStore.Images.Media.getBitmap(getContentResolver(), imageUri);
customCropImageView.setImageBitmap(bitmap);
} catch (IOException e) {
e.printStackTrace();
}
}
}
@Override
public void onRequestPermissionsResult(int requestCode, @NonNull String[] permissions, @NonNull int[] grantResults) {
super.onRequestPermissionsResult(requestCode, permissions, grantResults);
if (requestCode == REQUEST_PERMISSIONS) {
if (grantResults.length > 0 && grantResults[0] == PackageManager.PERMISSION_GRANTED) {
// 权限授予成功,可以继续进行图片选择等操作
} else {
// 用户拒绝了权限,需要提示用户或者禁用相关功能
}
}
}
}
总结
通过上述步骤,我们完成了一个具有裁剪功能的Android demo。该应用允许用户从相册或相机选择图片,在界面上进行裁剪、旋转和缩放,并最终将处理过的图片保存到指定位置。
以上就是Android实现图片裁剪处理的操作步骤的详细内容,更多关于Android图片裁剪处理的资料请关注脚本之家其它相关文章!
