【コピペでOK】Androidアプリ開発（画面遷移）

Pocket

こんにちは！
せのり（@senoriblog）です。

今回はAndroidアプリの画面遷移方法を紹介します。

アプリ開発において、画面遷移は必ずと言って良いほど頻繁に使用するロジックです。

商品一覧画面で商品を選択すると商品詳細画面に遷移する、
注文画面で注文を行って決済画面に遷移する、など。
あらゆる場面で使われています。

今回はボタンをクリックしたら、
次画面に遷移する方法を紹介したいと思います。

プロジェクト構成
遷移元画面
遷移先画面

上記の内容で解説します。
それでは、順番にみていきましょう。

プロジェクト構成

例として「myapplication」というプロジェクトを作成しました。
※プロジェクト名は何でも好きなように設定できます。
　但し、日本語や半角スペースは使用できません。

Androidプロジェクトの作成方法は以下を参照下さい。

: 【Android Studio】Gradle sync failed(同期失敗)エラーの対処方法

プロジェクトを作成すると２つのファイルができています。

activity_main.xml
MainActivity.java

今回は遷移元と遷移先の２画面が必要となるため、
上記に加えて遷移先の画面(SubActivity)を追加しました。
従って、以下の構成になっています。

activity_main.xml
MainActivity.java
activity_sub.xml
SubActivity.java

遷移元画面

画面レイアウトは以下の通りです。

まずはMainActivity.javaに画面遷移のロジックを追加します。
5,7,17～25行目が追加したソースです。
17～25行目はボタンをクリックした際に呼び出されるメソッドです。
なお、5,7行目は自分で記載しなくても、Android Studioが補完してくれます。

上記メッセージが表示されるので、Alt+Enterを押すと自動で追記してくれます。

package com.example.myapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

    public void onClick(View v) {
        // ①インテントの作成
        Intent intent = new Intent(this, SubActivity.class);

        // ②遷移先画面の起動
        if (intent.resolveActivity(getPackageManager()) != null) {
            startActivity(intent);
        }
    }
}

package com.example.myapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;

import android.os.Bundle;

import android.view.View;

public class MainActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

}

public void onClick(View v) {

// ①インテントの作成

Intent intent = new Intent(this, SubActivity.class);

// ②遷移先画面の起動

if (intent.resolveActivity(getPackageManager()) != null) {

startActivity(intent);

}

画面遷移のポイントは以下の２つです。

①インテントの作成
②遷移先画面の起動

①はIntentの第二引数に遷移したいActivity(ここではSubActivity)を指定します。
②は①で作成したIntentを引数にstartActivityを起動します。

次にactivity_main.xmlを編集して、レイアウトを作成します。
9～24行目が追加したソースです。
LinearLayoutの中にボタンを１つ作成しています。
このボタンをクリックすると、次画面に遷移するようにしたいので、
android:onClick="onClick"
として、クリックした時にonClickメソッドを実行するように設定しています。
なお、onClickの名称は任意で決めることができます。

<?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">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent">

        <Button
            android:id="@+id/button_hello"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="@string/button_hello"
            android:onClick="onClick"/>

    </LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

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">

<LinearLayout

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="horizontal"

app:layout_constraintTop_toTopOf="parent"

app:layout_constraintBottom_toBottomOf="parent">

<Button

android:id="@+id/button_hello"

android:layout_width="0dp"

android:layout_height="wrap_content"

android:layout_weight="1"

android:text="@string/button_hello"

android:onClick="onClick"/>

</LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

遷移先画面

画面レイアウトは以下の通りです。

<?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=".SubActivity">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Hello"
        android:textSize="50sp"
        android:textColor="#0000aa"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintLeft_toLeftOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

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=".SubActivity">

<TextView

android:id="@+id/textView"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Hello"

android:textSize="50sp"

android:textColor="#0000aa"

app:layout_constraintTop_toTopOf="parent"

app:layout_constraintBottom_toBottomOf="parent"

app:layout_constraintRight_toRightOf="parent"

app:layout_constraintLeft_toLeftOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

package com.example.myapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class SubActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_sub);
    }
}

package com.example.myapplication;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;

public class SubActivity extends AppCompatActivity {

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_sub);

}

遷移先画面は特に編集不要です。
今回はテキストボックスを１つ追加しました。
ここまでで、遷移元画面でボタンをクリックすると、SubActivityが表示されます。
一度動作確認してみましょう。

画面が切り替われば成功です！

【コピペでOK】Androidアプリ開発（画面遷移）

プロジェクト構成

【Android Studio】Gradle sync failed(同期失敗)エラーの対処方法

遷移元画面

遷移先画面