KotlinでAlertDialogを表示する方法を現役エンジニアが解説【初心者向け】

KotlinでAlertDialogを表示する方法について、TechAcademyのメンター（現役エンジニア）が実際のコードを使用して初心者向けに解説します。

初心者向けにKotlinの入門向けサイトをまとめた記事もありますので読んでみてください。

 

なお本記事は、TechAcademyのオンラインブートキャンプ、Androidアプリ開発講座の内容をもとに作成しています。

 

目次

• AlertDialogとは
• AlertDialogを表示してみよう
• AlertDialogをカスタマイズする方法
• まとめ

 

AlertDialogとは

AlertDialogとは何らかの選択や入力を行う小さな画面です。

[PR] Androidアプリ開発コース

AlertDialogを表示してみよう

AlertDialogを表示するにはメモリリーク防止などの観点からDialogFragmentを継承したクラスを作成することが推奨されています。

詳細はAndroid Developerでご確認ください。

Android Developer – AlertDialog

AlertDialogをカスタマイズする方法

今回のサンプルプログラムでは基本的なAlertDialogを作成、表示する方法を確認します。

タイトルやメッセージをカスタマイズできるのでいろいろと変えて試してみましょう。また今回は呼び出し元に結果を返す手法としてコールバックを採用しています。AlertDialogを利用する際には標準的に使用する方法ですので参考にすると良いでしょう。

ソースコードはAndroid Developerをベースとしています。プロジェクトを「Empty Activity」で新規作成し、ソースコードをそれぞれ以下のように変更します。

activity_main.xml

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

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="ダイアログを表示"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

NoticeDialogFragmentは新たに作成します。1行目のpackageは適宜ご自身の環境に置き換えてください。

package com.example.alertdialog

import android.app.Dialog
import android.content.Context
import android.os.Bundle
import androidx.appcompat.app.AlertDialog
import androidx.fragment.app.DialogFragment

class NoticeDialogFragment : DialogFragment() {
    // 呼び出し元のActivityを保持する
    private lateinit var listener: NoticeDialogListener

    // コールバック用インタフェース。呼び出し元で実装する
    interface NoticeDialogListener {
        fun onDialogPositiveClick(dialog: DialogFragment)
        fun onDialogNegativeClick(dialog: DialogFragment)
    }

    override fun onAttach(context: Context) {
        super.onAttach(context)
        try {
            // 呼び出し元のActivityを変数listenerで保持する
            listener = context as NoticeDialogListener
        } catch (e: ClassCastException) {
            // 呼び出し元のActivityでコールバックインタフェースを実装していない場合
            throw ClassCastException((context.toString() +
                    " must implement NoticeDialogListener"))
        }
    }

    override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        return activity?.let {
            // ダイアログの生成
            val builder = AlertDialog.Builder(it)
            builder.setMessage("OKかキャンセルを選択してください")
                .setPositiveButton("OK") { dialog, id ->
                        // 呼び出し元のActivityで定義されているonDialogPositiveClickが実行される
                        listener.onDialogPositiveClick(this)
                    }
                .setNegativeButton("キャンセル") { dialog, id ->
                    // 呼び出し元のActivityで定義されているonDialogNegativeClickが実行される
                        listener.onDialogNegativeClick(this)
                    }

            builder.create()
        } ?: throw IllegalStateException("Activity cannot be null")
    }
}

MainActivity

package com.example.alertdialog

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Toast
import androidx.fragment.app.DialogFragment
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity(), NoticeDialogFragment.NoticeDialogListener {

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

        // ボタンをクリックしたらダイアログを表示する
        button.setOnClickListener { showNoticeDialog() }
    }

    private fun showNoticeDialog() {
        // ダイアログフラグメントのインスタンスを生成
        val dialog = NoticeDialogFragment()
        // ダイアログを表示
        dialog.show(supportFragmentManager, "NoticeDialogFragment")
    }

    override fun onDialogPositiveClick(dialog: DialogFragment) {
        // Positiveボタンクリックのコールバック関数
        Toast.makeText(applicationContext, "OKが押されました", Toast.LENGTH_LONG).show()
    }

    override fun onDialogNegativeClick(dialog: DialogFragment) {
        // Negativeボタンクリックのコールバック関数
        Toast.makeText(applicationContext, "キャンセルが押されました", Toast.LENGTH_LONG).show()
    }
}

実行結果は以下のとおりです。ダイアログでの選択結果が呼び出し元のActivityに反映されているのが分かります。

まとめ

今回の記事ではAlertDialogの使い方について学習しました。

監修してくれたメンター

太田和樹（おおたかずき） ITベンチャー企業のPM兼エンジニア。 普段は主に、Web系アプリケーション開発のプロジェクトマネージャーとプログラミング講師を行っている。守備範囲はフロントエンド、モバイル、サーバサイド、データサイエンティストと幅広い。その幅広い知見を生かして、複数の領域を組み合わせた新しい提案をするのが得意。 開発実績：画像認識技術を活用した駐車場混雑状況把握（実証実験）、音声認識を活用したヘルプデスク支援システム、Pepperを遠隔操作するアプリの開発、大規模基幹系システムの開発・導入マネジメント。 地方在住。仕事のほとんどをリモートオフィスで行う。通勤で消耗する代わりに趣味のDIYや家庭菜園、家族との時間を楽しんでいる。

 

 

TechAcademyでは、初心者でも最短4週間で、Kotlinの技術を使ってAndroidアプリ開発を習得できる、オンラインブートキャンプを開催しています。

また、現役エンジニアから学べる無料体験も実施しているので、ぜひ参加してみてください。