뷰에 그래픽 그리기

 activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello World!"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

만약 사각형을 녹색으로 그린 후 그 안을 빨간색으로 채우려고 할 떄는 페인트 객체에 스타일 정보를 설정해야 합니다.아래의 Case 1,2가 궁금하다면 앞에서 작성한 CustomView.java의 init 메서드에 case 1이나 case 2의 코드를 한 줄 더 추가하여 실행해 보세요.case 2의 코드를 추가하면 빨간 실선으로 된 사각형으로 바뀔 것입니다.

 

Case 1 Fill 스타일 적용 예 - 빨간색 사각형 채우기(디폴드)

paint.setStyle(Style.FILL);

 

Case 2Stroke 스타일 적용 예 - 빨간색 사각형 그리기

paint.setStyle(Style.STROKE);

CustomViewStyle.java

package org.techtown.customviewstule;

import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.DashPathEffect;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.view.View;

public class CustomViewStyle extends View {
    Paint paint;

    public CustomViewStyle(Context context) {
        super(context);

        init(context);
    }

    public CustomViewStyle(Context context, AttributeSet attrs) {
        super(context, attrs);

        init(context);
    }

    private void init(Context context) {
        paint = new Paint();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.RED);
        canvas.drawRect(10, 10, 100, 100, paint);

        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(2.0F);
        paint.setColor(Color.GREEN);
        canvas.drawRect(10, 10, 100, 100, paint);

        paint.setStyle(Paint.Style.FILL);
        paint.setARGB(128, 0, 0, 255);
        canvas.drawRect(120, 10, 210, 100, paint);

        DashPathEffect dashEffect = new DashPathEffect(new float[]{5,5}, 1);
        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(3.0F);
        paint.setPathEffect(dashEffect);
        paint.setColor(Color.GREEN);
        canvas.drawRect(120, 10, 210, 100, paint);

        paint = new Paint();

        paint.setColor(Color.MAGENTA);
        canvas.drawCircle(50, 160, 40, paint);

        paint.setAntiAlias(true);
        canvas.drawCircle(160, 160, 40, paint);

        paint.setStyle(Paint.Style.STROKE);
        paint.setStrokeWidth(1);
        paint.setColor(Color.MAGENTA);
        paint.setTextSize(50);
        canvas.drawText("Text (Stroke)", 20, 260, paint);

        paint.setStyle(Paint.Style.FILL);
        paint.setTextSize(50);
        canvas.drawText("Text", 20, 320, paint);

    }

}

CustomViewStyle

선의 두꼐를 설정할 떄는 setStrokeWidth 메서드를 사용하고, 투명하도를 조절할 떄는 setARGB메서드를 사용합니다, 점선으로 그리고 싶은 경우에는 여러 가지 효과 중에서 DashPathEffect클래스를 이용할 수 있습니다.여기에서는 선이 그려지는 부분과 선이 그려지지 않는 부분이 각각 5의 크기로 지정되었습니다.일반적인 선을 그릴 떄는 drawLine메서드,원을 그릴 때는 drawCircle 메서드 그리고 텍스트는 drawText메서드를 이용할 수 있습니다. 부드럽게 선을 그리고 싶을 경우에는 setAntiAlias(true)코드를 사용할 수 있으며,원 텍스트에 그 효과가 적용됨니다.

MainActivity.java

package org.techtown.customviewstule;

import android.os.Bundle;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        CustomViewStyle view = new CustomViewStyle(this);
        setContentView(view);
    }
}

다양한 스타일을 적용하여 그래픽 그리기