이 튜토리얼에서는 안드로이드에서 비트맵(Bitmap)으로부터 원형 영역을 잘라내는 방법을 단계별로 살펴봅니다. 사용자가 화면을 터치하여 그린 경로를 따라 이미지를 오려내는 기능을 Path와 PorterDuffXfermode를 활용해 구현하는 예제입니다.
1단계 — 새 프로젝트 생성
Android Studio에서 File ⇒ New Project를 선택하고, 새 프로젝트 생성에 필요한 모든 정보를 입력하여 프로젝트를 만듭니다.
2단계 — 레이아웃 파일 작성
res/layout/activity_main.xml 파일에 아래 코드를 추가합니다.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="https://schemas.android.com/apk/res/android"
xmlns:tools="https://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
</RelativeLayout>
3단계 — MainActivity.java 코드 작성
src/MainActivity.java에 다음 코드를 추가합니다. 이 코드는 사용자가 손가락으로 그린 경로(Path)를 따라 비트맵을 잘라내는 커스텀 뷰(CutImage)를 구현합니다. 핵심은 PorterDuff.Mode.SRC_IN 전송 모드를 사용해 그려진 경로 영역만 남기고 나머지 부분을 제거하는 것입니다.
import androidx.appcompat.app.AppCompatActivity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PorterDuff;
import android.graphics.PorterDuffXfermode;
import android.os.Bundle;
import android.view.MotionEvent;
import android.view.View;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(new CutImage(this));
}
class CutImage extends View {
Bitmap bitmap;
Path path = new Path();
Paint paint;
public CutImage(Context context) {
super(context);
bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.demo);
paint = new Paint();
paint.setColor(Color.RED);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(5f);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawBitmap(bitmap, 0,0, null);
canvas.drawPath(path, paint);
}
@Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
switch (event.getAction()){
case MotionEvent.ACTION_DOWN:
path.moveTo(x,y);
break;
case MotionEvent.ACTION_MOVE:
case MotionEvent.ACTION_UP:
path.lineTo(x,y);
CropBitmap();
break;
}
invalidate();
return true;
}
private void CropBitmap() {
Bitmap croppedBitmap = Bitmap.createBitmap( bitmap.getWidth(), bitmap.getHeight(), bitmap.getConfig());
Canvas cropCanvas = new Canvas(croppedBitmap);
Paint paint1 = new Paint();
cropCanvas.drawPath(path, paint1);
paint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.SRC_IN));
cropCanvas.drawBitmap(bitmap, 0, 0, paint1);
bitmap = croppedBitmap;
invalidate();
}
}
}
4단계 — AndroidManifest.xml 설정
androidManifest.xml 파일에 아래 코드를 추가합니다.
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="https://schemas.android.com/apk/res/android" package="app.com.sample">
<application
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:roundIcon="@mipmap/ic_launcher_round"
android:supportsRtl="true"
android:theme="@style/AppTheme">
<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
</application>
</manifest>
앱 실행 및 결과 확인
이제 애플리케이션을 실행해 보겠습니다. 실제 안드로이드 기기가 컴퓨터에 연결되어 있다고 가정합니다. Android Studio에서 프로젝트의 액티비티 파일 중 하나를 연 뒤, 툴바의 실행(Run) 아이콘을 클릭하세요. 목록에서 본인의 모바일 기기를 선택하면, 연결된 기기 화면에 아래와 같은 결과가 표시됩니다.
