본문 바로가기
Android/Android Basic

안드로이드 멀티 터치 이벤트

by 수쓰뎁 2023. 1. 25.


1. 멀티 터치 이벤트

멀티 터치란 여러 손가락을 이용하여 화면을 터치하는 것을 말한다.

주로 이미지의 확대/축소에 많이 사용된다.

 

  • ACTION_DOWN
    화면을 터치하는 첫 번째 포인터에 대하여 제스처 인식이 시작된다.
    첫 번째 터치는 항상 MotionEvent에서 인덱스 0번에 저장된다.
  • ACTION_POINTER_DOWN
    첫 번째 포인터 이외의 포인터에 대하여 발생된다.
    포인터 데이터는 getActionIndex()가 반환하는 인덱스에 저장된다.
  • ACTION_MOVE
    화면을 누르면서 이동할 때 발생한다.
  • ACTION_POINTER_UP
    마지막 포인터가 아닌 다른 포인터가 화면에서 없어지면 발생한다.
  • ACTION_UP
    화면을 떠나는 마지막 포인터에 대하여 발생한다.

2. 이미지 확대/축소 기능 구현

안드로이드 이미지 확대 축소 예제를 작성해보자.

작성할 순서는 다음과 같다.

  • ImageScaleView.java 작성
  • MainActivity.java 작성

멀티 터치를 이용한 간단한 이미지 확대 및 축소 기능을 구현해보자.

  • 두 손가락으로 화면을 확대 및 축소하는 기능을 구현한다.
  • 캔버스의 현재 상태를 저장하고 스케일 연산을 통해 캔버스 상태의 스케일을 조정한다.
  • 제스처디텍터의 터치 이벤트를 처리해준다.

 

1) ImageScaleView.java

이 예제에서는 특별히 레이아웃 코드를 작성할 필요가 없다.

먼저 다음과 같이 이미지 화면 축소를 위한 코드를 작성한다.

public class ImageScaleView extends View {
    private Drawable image;
    private ScaleGestureDetector gestureDetector;
    private float scale = 1.0f;

    public ImageScaleView(Context context) {
        super(context);
        image = context.getResources().getDrawable(R.drawable.rabbit);
        setFocusable(true);
        image.setBounds(0, 0, image.getIntrinsicWidth(), image.getIntrinsicHeight());
        gestureDetector = new ScaleGestureDetector(context, new ScaleListener());
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.save();
        canvas.scale(scale, scale);
        image.draw(canvas);
        canvas.restore();
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        gestureDetector.onTouchEvent(event);
        invalidate();
        return true;
    }

    private class ScaleListener extends ScaleGestureDetector.SimpleOnScaleGestureListener {

        @Override
        public boolean onScale(ScaleGestureDetector detector) {
            scale *= detector.getScaleFactor();
            if (scale < 0.1f) {
                scale = 0.1f;
            }
            if (scale > 10.0f) {
                scale = 10.0f;
            }
            invalidate();
            return true;
        }
    }

}

ImageScaleView 클래스를 생성하고 그 안에 이너클래스 ScaleListener 클래스를 생성한다.

ScaleListener 클래스에서는 확대/축소 연산을 정의하고 제스쳐 디텍터가 감지되면 호출된다.

onDraw() 메서드에서는 캔버스의 현재 상태를 저장하고 확대/축소 연산을 적용하여 캔버스의 스케일을 조절한다.

onTouchEvent() 메서드에서는 제스처 디텍터의 터치 이벤트 처리 메서드를 호출한다.

 

2) MainActivity.java

다음과 같이 MainAtivity에 SingleTouchView를 연결한다.

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(new ImageScaleView(this));
    }
}

3. 실행 결과

작성한 테스트 앱을 실행해보면 다음과 같이 구동되는 것을 확인할 수 있다.

구현하고자 했던대로 화면의 이미지를 확대/축소할 수 있다.

올해는 토끼의 해니까 토끼 이미지로 테스트해보았다~

 

끝.

반응형

댓글