Crop Image Android Tutorial – Pick and Crop Image in Android
This post hasn't been updated for 5 years
Xin chào mọi người, trong bài này, mình sẽ chia sẻ cách để tạo 1 ứng dụng crop image nho nhỏ, giống như khi chúng ta chọn ảnh đại diện trên facebook vậy .
Adding Library
Đầu tiên, ta cần add thư viện, trong bài này, mình sẽ sử dụng thư viện: ":android-image-cropper" để xử lý:
- Add project level lib:
maven { url "https://jitpack.io" }
- Tiếp theo, add vào app level :
compile 'com.theartofdev.edmodo:android-image-cropper:2.3.+'
Creating Interface
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@android:color/black">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tap on the image below to change your profile picture"
android:textColor="@android:color/white"
android:textSize="20dp"
android:id="@+id/textView" />
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/quick_start_cropped_image"
android:background="@android:color/white"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:textColor="@android:color/black"
android:layout_height="wrap_content"
android:text="Name: Manish Kumar"
android:textSize="30dp"
android:layout_gravity="center"
/>
<TextView
android:textColor="@android:color/black"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Email: manishh776@gmail.com"
android:textSize="25dp"
android:layout_gravity="center"
/>
<TextView
android:textColor="@android:color/black"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="MobileNo:1234567890"
android:textSize="25dp"
android:layout_gravity="center"
/>
</LinearLayout>
</FrameLayout>
<ImageButton
android:id="@+id/quick_start_cropped_image"
android:layout_width="200dp"
android:layout_height="200dp"
android:src="@drawable/profile"
android:layout_marginTop="39dp"
android:layout_below="@+id/textView"
android:layout_centerHorizontal="true" />
</RelativeLayout>
MainActivity
- Nơi đây xử lý logic của app. Mọi logic sẽ được sử lý trong class này.
package chutka.bitman.com.bestimagecropperever;
import android.Manifest;
import android.annotation.SuppressLint;
import android.app.Activity;
import android.content.Intent;
import android.content.pm.PackageManager;
import android.net.Uri;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.Toast;
import com.theartofdev.edmodo.cropper.CropImage;
import com.theartofdev.edmodo.cropper.CropImageView;
public class MainActivity extends AppCompatActivity {
ImageButton imageButton;
/**
* Persist URI image to crop URI if specific permissions are required
*/
private Uri mCropImageUri;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imageButton = (ImageButton) findViewById(R.id.quick_start_cropped_image);
imageButton.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
onSelectImageClick(v);
}
});
}
/**
* Start pick image activity with chooser.
*/
public void onSelectImageClick(View view) {
CropImage.startPickImageActivity(this);
}
@Override
@SuppressLint("NewApi")
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
// handle result of pick image chooser
if (requestCode == CropImage.PICK_IMAGE_CHOOSER_REQUEST_CODE && resultCode == Activity.RESULT_OK) {
Uri imageUri = CropImage.getPickImageResultUri(this, data);
// For API >= 23 we need to check specifically that we have permissions to read external storage.
if (CropImage.isReadExternalStoragePermissionsRequired(this, imageUri)) {
// request permissions and handle the result in onRequestPermissionsResult()
mCropImageUri = imageUri;
requestPermissions(new String[]{Manifest.permission.READ_EXTERNAL_STORAGE}, 0);
} else {
// no permissions required or already grunted, can start crop image activity
startCropImageActivity(imageUri);
}
}
// handle result of CropImageActivity
if (requestCode == CropImage.CROP_IMAGE_ACTIVITY_REQUEST_CODE) {
CropImage.ActivityResult result = CropImage.getActivityResult(data);
if (resultCode == RESULT_OK) {
((ImageButton) findViewById(R.id.quick_start_cropped_image)).setImageURI(result.getUri());
Toast.makeText(this, "Cropping successful, Sample: " + result.getSampleSize(), Toast.LENGTH_LONG).show();
} else if (resultCode == CropImage.CROP_IMAGE_ACTIVITY_RESULT_ERROR_CODE) {
Toast.makeText(this, "Cropping failed: " + result.getError(), Toast.LENGTH_LONG).show();
}
}
}
@Override
public void onRequestPermissionsResult(int requestCode, String permissions[], int[] grantResults) {
if (mCropImageUri != null && grantResults.length > 0 && grantResults[0] == PackageManager.PERMISSION_GRANTED) {
// required permissions granted, start crop image activity
startCropImageActivity(mCropImageUri);
} else {
Toast.makeText(this, "Cancelling, required permissions are not granted", Toast.LENGTH_LONG).show();
}
}
/**
* Start crop image activity for the given image.
*/
private void startCropImageActivity(Uri imageUri) {
CropImage.activity(imageUri)
.setGuidelines(CropImageView.Guidelines.ON)
.setMultiTouchEnabled(true)
.start(this);
}
}
Android Manifest
- Tiếp theo là file Manifest, nơi khai báo các permission, activity....
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="chutka.bitman.com.bestimagecropperever">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:supportsRtl="true"
android:theme="@style/Base.Theme.AppCompat">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity android:name="com.theartofdev.edmodo.cropper.CropImageActivity"/>
</application>
</manifest>
Bây giờ chỉa cần bạn chạy app lên , sẽ thấy được thành quả !!
Và đây là thành quả của chúng ta:
Bài viết được tham khảo từ: https://github.com/ArthurHub/Android-Image-Cropper
All Rights Reserved