+2

Crop ảnh cực đơn giản với SimpleCropView trong Android

SimpleCropView là một thư viện crop ảnh trong android cực kỳ đơn giản. Nó làm đơn giản hóa code của bạn cho việc crop ảnh và cung cấp một giao diện có thể tùy biến một cách dễ dàng.

SimpleCropView được hỗ trợ cho API 10 trở lên.

I. Hường dẫn sử dụng

Thêm dòng dưới đâu vào file build.gradle, hãy sử dụng version mới nhất. Tại thời điểm này tội sử dụng phiên bản 1.1.4

repositories {
    jcenter()
}

dependencies {
    compile 'com.isseiaoki:simplecropview:1.1.4'
}

Để ứng dụng có thể đọc được ảnh trong bộ nhớ và ghi lại ảnh được crop. Ta cấp quyền cho nó. (Hãy tìm hiểu về cách cấp quyền cho android 6.0 trở lên)

<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

SimpleCropView đã dựng sẵn cho chúng ta 1 lớp CropImageView và việc của chúng ta là hãy đặt nó vào layout nơi mà bạn sẽ sử dụng để crop ảnh

Ví dụ

<com.isseiaoki.simplecropview.CropImageView
    xmlns:custom="http://schemas.android.com/apk/res-auto"
    android:id="@+id/cropImageView"
    android:layout_weight="1"
    android:paddingTop="16dp"
    android:paddingBottom="16dp"
    android:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    custom:scv_crop_mode="fit_image"
    custom:scv_background_color="@color/windowBackground"
    custom:scv_handle_color="@color/colorAccent"
    custom:scv_guide_color="@color/colorAccent"
    custom:scv_overlay_color="@color/overlay"
    custom:scv_frame_color="@color/colorAccent"
    custom:scv_handle_size="14dp"
    custom:scv_touch_padding="8dp"
    custom:scv_handle_show_mode="show_always"
    custom:scv_guide_show_mode="show_always"
    custom:scv_min_frame_size="50dp"
    custom:scv_frame_stroke_weight="1dp"
    custom:scv_guide_stroke_weight="1dp"/>

Load ảnh lên CropImageView trong layout từ Uri của ảnh mà bạn muốn crop. Việc load ảnh từ Uri được thực hiện bất đồng bộ nên bạn có thể tạo 1 biểu tượng waiting và remove biểu tượng đó cho tới khi việc load ảnh hoàn tất, khi đó hàm onSuccess() (nếu load thành công) hoặc onError() (nếu load thất bại) được thực hiện. Lúc này bạn có thể thêm vài thứ như thông báo vói user rằng việc load ảnh gặp lỗi. Rất tiếc là thư viện này lại không truyền một exception hay 1 thông tin gì đó về nguyên nhân lỗi nên chúng ta có thể hi vọng ở các version tiếp theo.

mCropView = (CropImageView) findViewById(R.id.cropImageView);

mCropView.startLoad(

    sourceUri,

    new LoadCallback() {
        @Override
        public void onSuccess() {}

        @Override
        public void onError() {}
});

Crop ảnh và lưu vào bitmap đã được crop trong saveUri. Cũng tương tự như việc load ảnh, khi bạn nhấn vào nút OK (mà bạn set hành động crop ảnh), việc crop ảnh cũng được thực hiện 1 cách bất đồng bộ. Bạn có thể xử lý chúng như dưới đây theo cách mà bạn mong muốn. Bạn có thể tạo 1 biểu tượng waiting và remove biểu tượng đó cho tới khi việc crop ảnh hoàn tất.

mCropView.startCrop(

    saveUri,

    new CropCallback() {
        @Override
        public void onSuccess(Bitmap cropped) {
            // Bạn có thể tùy ý làm gì đó với bitmap vừa được crop từ ảnh
        }

        @Override
        public void onError() {
            // Xử lý trong trường hợp crop không thành công
        }
    },

    new SaveCallback() {
        @Override
        public void onSuccess(Uri outputUri) {
            // Bạn có thể tùy ý làm gì đó với uri của output từ việc crop ảnh vừa được lưu
        }

        @Override
        public void onError() {
            // Xử lý trong trường hợp thể save bitmap của ảnh crop được
        }
    }
);

SimpleCropView hỗ trợ việc xoay ảnh

cropImageView.rotateImage(CropImageView.RotateDegrees.ROTATE_90D); // xoay 90 độ theo chiều kim đồng hồ
cropImageView.rotateImage(CropImageView.RotateDegrees.ROTATE_M90D); // và 90 độ ngược chiều kim đồ hồ

**Một số tùy chọn

  1. Tùy chọn định dạng nén ảnh Bạn có thể sử dụng 3 định dạng PNG (mặc định), JPEG và WEBP
setCompressFormat(Bitmap.CompressFormat.JPEG);
  1. Tùy chọn chất lượng Bạn cũng có thể đặt chất lượng nén từ 0 đến 100 % (mặc định)
setCompressQuality(90);
  1. Cài đặt kích cỡ lớn nhất cho ảnh đầu ra
setCompressQuality(90);
  1. Đặt kích cỡ cứng cho ảnh đầu ra Viều chiều rộng
setOutputWidth(100);
// Nếu ảnh được crop có cỡ 400*200 thì output sẽ là 100*50
// Điều đó có nghĩa là giữ nguyên tỉ lệ chiều của ảnh

Tương tự đối với chiều cao

setOutputHeight(100);
  1. Tùy chọn chế độ crop. Bạn có thể sử dụng khung crop với tỉ lệ khác nhau như chế độ 4:3, 1:1 (vuông - mặc định), 16:9, 9:16, tròn.v.v
cropImageView.setCropMode(CropImageView.CropMode.RATIO_16_9);

Các giá trị thay thế tùy bạn FIT_IMAGE, RATIO_4_3, RATIO_3_4, SQUARE(default), RATIO_16_9, RATIO_9_16, FREE, CUSTOM, CIRCLE, CIRCLE_SQUARE

Bạn có thể tìm hiểu nhiều hơn tại https://github.com/IsseiAoki/SimpleCropView


All rights reserved

Viblo
Hãy đăng ký một tài khoản Viblo để nhận được nhiều bài viết thú vị hơn.
Đăng kí