Computer >> 컴퓨터 >  >> 프로그래밍 >> Android

안드로이드에서 좌우 스와이프 제스처를 감지하고 처리하는 방법

이 튜토리얼에서는 안드로이드 앱에서 오른쪽에서 왼쪽으로, 왼쪽에서 오른쪽으로 스와이프 제스처를 감지하고 처리하는 방법을 단계별로 살펴봅니다. 스와이프 제스처는 이미지 갤러리, 온보딩 화면, 사이드 메뉴 등 다양한 UI에서 활용되는 핵심 인터랙션이므로, 정확하게 구현해 두면 사용자 경험이 크게 향상됩니다.

1단계 — 새 프로젝트 만들기

Android Studio에서 File ⇒ New Project로 이동하여 새 프로젝트를 생성하고, 프로젝트 생성에 필요한 모든 정보를 입력합니다.

2단계 — 레이아웃 XML 작성

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"
    android:padding="4dp"
    android:id="@+id/relativeLayout"
    tools:context=".MainActivity">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textAlignment="center"
        android:layout_centerInParent="true"
        android:textSize="16sp"
        android:textStyle="bold"
        android:text="Swipe Left to right and Right to Left to detect Swipe Gesture"/>
</RelativeLayout>

3단계 — MainActivity 작성

src/MainActivity.java 파일에 아래 코드를 추가합니다. 레이아웃에 커스텀 터치 리스너를 연결하여 스와이프 이벤트를 수신하고, 감지 시 토스트 메시지를 표시합니다.

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.RelativeLayout;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {
    RelativeLayout layout;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        layout = findViewById(R.id.relativeLayout);
        layout.setOnTouchListener(new OnSwipeTouchListener(MainActivity.this) {
            @Override
            public void onSwipeLeft() {
                super.onSwipeLeft();
                Toast.makeText(MainActivity.this, "Swipe Left gesture detected", Toast.LENGTH_SHORT).show();
            }
            @Override
            public void onSwipeRight() {
                super.onSwipeRight();
                Toast.makeText(MainActivity.this, "Swipe Right gesture detected", Toast.LENGTH_SHORT).show();
            }
        });
    }
}

4단계 — OnSwipeTouchListener 클래스 추가

새 자바 클래스 OnSwipeTouchListener.java를 생성하고 아래 코드를 입력합니다. 이 클래스는 GestureDetector를 활용해 터치 시작점과 끝점의 거리(diffX, diffY)와 속도(velocityX, velocityY)를 계산하여 스와이프 방향을 판별합니다. 임계값(THRESHOLD)을 조정하면 감지 민감도를 바꿀 수 있으며, 좌우뿐 아니라 상하 스와이프, 클릭, 더블클릭, 롱클릭까지 함께 처리할 수 있는 확장성 있는 구조입니다.

import android.content.Context;
import android.view.GestureDetector;
import android.view.MotionEvent;
import android.view.View;
class OnSwipeTouchListener implements View.OnTouchListener {
    private GestureDetector gestureDetector;
    OnSwipeTouchListener(Context c) {
        gestureDetector = new GestureDetector(c, new GestureListener());
    }
    public boolean onTouch(final View view, final MotionEvent motionEvent) {
        return gestureDetector.onTouchEvent(motionEvent);
    }
    private final class GestureListener extends
    GestureDetector.SimpleOnGestureListener {
        private static final int SWIPE_THRESHOLD = 100;
        private static final int SWIPE_VELOCITY_THRESHOLD = 100;
        @Override
        public boolean onDown(MotionEvent e) {
            return true;
        }
        @Override
        public boolean onSingleTapUp(MotionEvent e) {
            onClick();
            return super.onSingleTapUp(e);
        }
        @Override
        public boolean onDoubleTap(MotionEvent e) {
            onDoubleClick();
            return super.onDoubleTap(e);
        }
        @Override
        public void onLongPress(MotionEvent e) {
            onLongClick();
            super.onLongPress(e);
        }
        @Override
        public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
            try {
                float diffY = e2.getY() - e1.getY();
                float diffX = e2.getX() - e1.getX();
                if (Math.abs(diffX) > Math.abs(diffY)) {
                    if (Math.abs(diffX) > SWIPE_THRESHOLD && Math.abs(velocityX) > SWIPE_VELOCITY_THRESHOLD) {
                        if (diffX > 0) {
                            onSwipeRight();
                        } else {
                            onSwipeLeft();
                        }
                    }
                }
                else {
                    if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
                        if (diffY > 0) {
                            onSwipeDown();
                        } else {
                            onSwipeUp();
                        }
                    }
                }
            }
            catch (Exception exception) {
                exception.printStackTrace();
            }
            return false;
        }
    }
    public void onSwipeRight() {
    }
    public void onSwipeLeft() {
    }
    private void onSwipeUp() {
    }
    private void onSwipeDown() {
    }
    private void onClick() {
    }
    private void onDoubleClick() {
    }
    private void onLongClick() {
    }
}

5단계 — 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 아이콘을 클릭하세요. 기기 목록에서 본인의 모바일 기기를 선택하면 앱이 실행되고, 아래와 같은 기본 화면이 표시됩니다.

안드로이드에서 좌우 스와이프 제스처를 감지하고 처리하는 방법