Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

【超初心者向け】Android入門 画面遷移編

はじめに

前回まではViewの表示の仕方など学んできました。
今回は画面遷移の方法を学んでいきます。
以前にも紹介しましたがこのシリーズはTodoアプリを作ることが目標です。
Todoアプリは

  • 一覧画面
  • 詳細画面
  • 追加画面

少なくともこの3つの画面がなければいけないので画面遷移が必須となってきます。

記事の対象

  • Androidアプリ開発初心者
  • Androidをこよなく愛する人
  • 前回の記事を読んだ方

そもそも画面ってどうやって構成されてるの?

今までActivityについては何も言及してきませんでしたが、複数の画面を扱うにあたってActivityを紹介していきたいと思います。

Activityとは?
公式リファレンスのAndroid Developersを見ると何やらややこしいことが書いてありますが、Activityを一言で表すのであれば画面のことです。
1画面1Activityで構成されていて、新しい画面を作りたい場合は新しいActivityを生成すればいいのです。

※当記事は初心者向けのため、わかりやすく1画面1Activityと書いてありますが、正確にはそうではありません。ですがここでFragmentの説明も加えてしまうと記事の量が膨大になる&初学者の方の理解の妨げになるためそう説明しています。ご了承ください。

1.新しいActivityを作ってみる。

現在存在しているのはMainActivityです。
遷移先のActivityの名前はTestActivityにしましょう。

まずはAndroid Studioでapp/java/your_packagenameを右クリックしNew→Kotlin File/Classをクリックし、TestActivityと入力しclassを押下します。

そうすると、

TestActivity.kt
class TestActivity {
}

こんな感じでTestActivityが生成されていると思います。ただこれだけだとActivityとして認識してもらえないためAppCompatActivityを継承させます。

TestActivity.kt
class TestActivity : AppCompatActivity() {
}

こんな感じでOKですね!

2. 遷移先のレイアウトを作ってみる

簡単に遷移先のレイアウトを作ってみましょう。

今度はapp/res/layoutを右クリックし、New→Layout Resource fileをクリックします。File名にactivity_testと入力し、OKをクリックします。
そうすると

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

</androidx.constraintlayout.widget.ConstraintLayout>

こんな感じのxmlファイルが生成されると思います。

ConstraintLayoutである必要がないので前回と同様にLinearLayoutにしていきましょう。

activity_test.xml
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
    android:layout_height="match_parent">

</LinearLayout>

これでOKですね!
遷移したとわかるように何か適当なTextViewを配置しておきましょう

activity_test.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="30dp"
        android:text="Success"
        android:textColor="@android:color/black"
        android:textSize="24sp" />

</LinearLayout>

遷移したらSuccessと表示するようにしました。わかりやすいですね。

TestActivityにこのレイアウトを読み込ませる処理をしましょう

TestActivity.kt
class TestActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_test)
    }
}

onCreateのなかでsetContentViewをするとレイアウトを読み込んでくれます。

最後にAndroidManifest.xmlにこのActivityを認識させます。

AndroidManifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.helloworld">

    <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/Theme.HelloWorld">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".TestActivity"/>
    </application>

</manifest>
<activity android:name=".TestActivity"/>

この1文を追加しました。

これをしないと画面遷移したときに「知らないActivityだよ!」と怒られてしまいます。

3. MainActivityを編集する

今MainActivityには前回のRecyclerViewを表示するAdapterやViewHolderなどが書かれていると思いますが、とりあえず全部消しちゃいましょう!
ついでにactivity_main.xmlも編集してButtonだけにしちゃいましょうか

MainActivity
class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val button = findViewById<Button>(R.id.button)
        button.setOnClickListener { 

        }
    }

}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="遷移!"
        android:textSize="24sp"/>

</FrameLayout>

さらっとFrameLayoutを使っていますが、説明は割愛させていただきます。

MainActivityを編集して、ボタンを押しても何もしないというところまで来ましたね

4. 遷移する

さぁここからが本題です。実際に画面遷移をしていきましょう。
画面遷移に必要になってくるのはIntentというものです。

Intentとは?

インテントを使用すると、実行したい簡単なアクション(「地図を表示する」、「写真を撮る」など)を Intent オブジェクトに記述することによって、別のアプリでアクティビティを開始できます。

Intentを使うと別のActivityを開始してくれるそうですね。

ではどうやって使うのか解説していきます。

val intent = Intent(this, TestActivity::class.java)
startActivity(intent)

まずはIntentのインスタンスを作成します。
第一引数にはcontext、第二引数には開始させたいActivityを記述していきます。第一引数はおまじないと思ってもらって構いません。
インスタンスが生成できたらstartActivityの引数にそのインスタンスを渡してあげると、Activityを開始してくれます。

先ほどのsetOnClickListenerの中に記述していきましょう。

MainActivity.kt
class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val button = findViewById<Button>(R.id.button)
        button.setOnClickListener {
            val intent = Intent(this, TestActivity::class.java)
            startActivity(intent)
        }
    }

}

こんな感じになりましたね!

5.実行

さぁ実行していきましょう!

筆者は上手く画面遷移できましたが皆さんはどうでしょうか?

まとめ

今回は画面遷移について学んでいきました。
次回から本格的にTodoアプリを作っていこうかと思っています

dosukoi_android
アルサーガパートナーズ㈱ Androidエンジニア 最近はCIばっかやってます
https://github.com/Naoki-Hidaka
arsagapartners
最高品質を最速で。 業務未経験でも最速最高の成長を!
https://www.arsaga.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away