Androidアプリ開発

スワイプ操作でActivityを画面遷移する

この記事は約11分で読めます。
スポンサーリンク

こんにちは、まっさん(@Tera_Msaki)です。

この記事は Android スマホ用のアプリ開発の中で、
今後の開発で再使用性が高いと思われるコーディングをまとめたものです。
Java での開発経験、XML構文規則、Android のアプリ開発経験がある方を対象としています。
Android のアプリ開発でお役にたててれば、嬉しいです。
(これから Android のアプリ開発や Java での開発を始めたい方への案内は、記事の最後で紹介します)

◎テーマ
スワイプ操作で Activity を画面遷移する

◎ポイント

Android スマホのアプリ開発で画面遷移が必要な場合で、
スワイプ操作でページ送りのように画面遷移することは、
ユーザインタフェース向上の有効な手段のひとつです。
Fragment で画面を構成する場合は、
ViewPager2 を使用
することで簡単に実装できるスワイプ操作での画面遷移も、
Activity で画面を構成する場合は、ひと工夫する必要があります。

一覧画面からタップ操作で詳細画面に遷移、詳細画面では右向きのスワイプ操作で一覧画面に遷移しています。

◎スワイプ操作の有効エリアのレイアウト定義

Androidアプリの画面はいくつもの View で構成されています。
それぞれの View で操作を受け取ることが可能ですが、
View ごとにスワイプ操作を受け取る実装は煩雑となります。
有効範囲の View を1つにまとめることをおすすめします。

         :
            <LinearLayout
                android:id="@+id/swipe"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:background="@android:color/transparent">
                <TextView
                    android:id="@+id/title"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="18sp"
                    android:textStyle="bold"
                    android:background="@android:color/transparent" />
                <TextView
                    android:id="@+id/conditions"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:textSize="16sp"
                    android:background="@android:color/transparent" />
            </LinearLayout>
        :

LinearLayout でいくつかの View をまとめて、
スワイプ操作の有効範囲としています。
画面の中の View でスクロール操作やスワイプ操作がある場合も、
スワイプ操作の有効範囲を決めておくこと

それぞれ独立した操作で動作させることが可能です。

◎スワイプ操作の実装

スワイプ操作のフックは GestureDetector を使用します。
スワイプ操作では2点のタッチ位置と移動スピードをフックできる onFling をオーバライドして実装します。
スワイプ操作の判定は、2点間のタッチ位置の移動距離と方向、移動スピードを使って判定可能ですが
今回の実装では、2点間のタッチ位置の移動距離が左(開始)から右(終了)が -100 未満の場合に、
スワイプ操作があったと判定しています。

    private GestureDetector         gestureDetector;
    private static final int        SWIPE_MIN_DISTANCE = -100;
    : 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        :
        // スワイプ
        gestureDetector = new GestureDetector(this, new GestureDetector.SimpleOnGestureListener() {
            @Override
            public boolean onFling(MotionEvent beforeEvent, MotionEvent afterEvent, float velocityX, float velocityY) {
                if (beforeEvent.getX() - afterEvent.getX() < SWIPE_MIN_DISTANCE) {
                    Intent intent = new Intent(context, MainActivity.class);
                    startActivity(intent);
                    overridePendingTransition(R.anim.slide_from_left, R.anim.slide_to_right);
                    finish();
                }
                return false;
            }
        });
        LinearLayout linearLayout = findViewById(R.id.swipe);
        linearLayout.setOnTouchListener((view, event) -> gestureDetector.onTouchEvent(event));
        linearLayout.setOnClickListener(view -> {});
        :

スワイプ操作の有効範囲とした LinearLayout にタッチ操作をフックするタッチリスナーをセットして、
GestureDetector のインターフェースに引き渡します。
ここでの
重要ポイントですが、タッチリスナーだけでは、onFling のイベントが発生しません
クリックリスナーをセットしてください。

◎画面遷移時のアニメーション

Activity 間の画面遷移で overridePendingTransition を使用することで、
簡単なアニメーション処理が実装できます。
リソース(res)にアニメーション定義を格納するためのフォルダ(anim)を作成します。
作成したフォルダにアニメーション定義ファイルを格納します。

slide_from_left.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="-100%p" android:toXDelta="0"
        android:duration="@android:integer/config_mediumAnimTime" />
</set>

slide_to_right.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <translate android:fromXDelta="0" android:toXDelta="100%p"
        android:duration="@android:integer/config_mediumAnimTime" />
</set>

overridePendingTransition の引数に遷移元画面のアニメーション定義、遷移先画面のアニメーション定義を指定します。

ブログランキング・にほんブログ村へ

◎これからAndroidのアプリ開発やJavaでの開発を始めたい方へ

初めての Android のアプリ開発では、アプリケーション開発経験がない方や、
アプリケーション開発経験がある方でも、Java や C# などのオブジェクト指向言語が初めての方は、
書籍などによる独学ではアプリ開発できるようになるには、
かなりの時間がかかりますので、オンラインスクールでの習得をおススメします。

コメント欄

タイトルとURLをコピーしました