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

初心者向けにKotlinでAlertDialogを表示する方法について現役エンジニアが解説しています。KotlinのAlertDialogとは何らかの警告や選択や入力を行う小さな画面のことです。 DialogFragmentを継承する使い方やAlertDialogをカスタマイズして表示する方法を解説しています。

TechAcademyマガジンはオンラインのプログラミングスクールTechAcademy [テックアカデミー]が運営する教育×テクノロジーのWebメディアです。初心者でもすぐ勉強できる記事が2,000以上あります。

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

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

 

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

田島悠介

今回は、Androidアプリ開発に関する内容だね!

大石ゆかり

どういう内容でしょうか?

田島悠介

Kotlinで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アプリ開発を習得できる、オンラインブートキャンプを開催しています。

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