Android实现图片裁剪处理的操作步骤
目录
- 前言
- 步骤 1: 设置权限
- 步骤 2: 创建布局文件
- 步骤 3: 实现自定义View CustomCropImageView
- CustomCropImageView.Java
- 步骤 4: 更新Activity逻辑
- MainActivity.java
- 总结
前言
本文将介绍如何构建一个支持图片选择、裁剪(包括手动缩放和旋转)、以及保存到自定义路径的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]; // 上次触摸位置,用于计算移动距离 jsprivate 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()); php 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.ACTIONjavascript_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 Gesture编程客栈Detector.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 bitphpmap = 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图片裁剪处理的资料请关注编程客栈(www.devze.com)其它相关文章!
精彩评论