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

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

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

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

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

# そもそも画面ってどうやって構成されてるの？
今までActivityについては何も言及してきませんでしたが、複数の画面を扱うにあたってActivityを紹介していきたいと思います。

[Activityとは?](https://developer.android.com/guide/components/activities/intro-activities?hl=ja)
公式リファレンスの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を押下します。

そうすると、

```kotlin:TestActivity.kt
class TestActivity {
}
```

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

```kotlin:TestActivity.kt
class TestActivity : AppCompatActivity() {
}
```

こんな感じでOKですね！

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

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

```xml: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にしていきましょう。


```xml: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を配置しておきましょう

```xml: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にこのレイアウトを読み込ませる処理をしましょう

```kotlin:TestActivity.kt
class TestActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_test)
    }
}
```
onCreateのなかでsetContentViewをするとレイアウトを読み込んでくれます。

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

```xml: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>
```

```xml
<activity android:name=".TestActivity"/>
```

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

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

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


```kotlin: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 { 
            
        }
    }

}
```

```xml: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とは？](https://developer.android.com/guide/components/intents-common?hl=ja)
>インテントを使用すると、実行したい簡単なアクション（「地図を表示する」、「写真を撮る」など）を Intent オブジェクトに記述することによって、別のアプリでアクティビティを開始できます。

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

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

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

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

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

```kotlin: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アプリを作っていこうかと思っています