読み込み中...

Kotlinでトーストを使う15の方法

Kotlinを使って表示されるシンプルなトーストメッセージのスクリーンショット Kotlin
この記事は約24分で読めます。

【サイト内のコードはご自由に個人利用・商用利用いただけます】

この記事では、プログラムの基礎知識を前提に話を進めています。

説明のためのコードや、サンプルコードもありますので、もちろん初心者でも理解できるように表現してあります。

本記事のサンプルコードを活用して機能追加、目的を達成できるように作ってありますので、是非ご活用ください。

※この記事は、一般的にプロフェッショナルの指標とされる『実務経験10,000時間以上』を満たす現役のプログラマチームによって監修されています。

※Japanシーモアは、常に解説内容のわかりやすさや記事の品質に注力しております。不具合、分かりにくい説明や不適切な表現、動かないコードなど気になることがございましたら、記事の品質向上の為にお問い合わせフォームにてご共有いただけますと幸いです。
(送信された情報は、プライバシーポリシーのもと、厳正に取扱い、処分させていただきます。)

はじめに

この記事を読めば、Kotlinを使用してAndroidアプリケーションでトーストメッセージを表示する方法を15通り身につけることができるようになります。

トーストは、短時間で消える小さなメッセージを表示する機能で、ユーザーへの簡単な通知やフィードバックに適しています。

Kotlinを使用すると、このトースト機能を簡単かつ効果的に実装することができます。

●Kotlinとトーストの基本

○Kotlinとは?

Kotlinは、JetBrainsが開発した静的型付けのプログラミング言語です。

Javaとの互換性を持ちつつ、よりシンプルで表現力豊かな文法を持っています。

特にAndroidの公式言語として採用されて以降、多くのAndroidアプリ開発者に支持されています。

Kotlinは安全性、簡潔さ、実用性を重視して設計されており、繁雑なコードを減少させつつ、生産性を向上させることが可能です。

○トーストとは?

トーストは、Androidのアプリケーション上で短時間に表示される小さなメッセージボックスのことを指します。

例えば、ユーザーの操作に対する確認メッセージや短い情報を伝える際に使用されます。トーストは画面のどこかに一時的に表示され、自動的に消えます。

トーストのメリットは、ユーザーの操作を中断させずに情報を伝えることができる点にあります。

●トーストの使い方

Androidアプリケーションで情報を短期間、ユーザーに伝える方法としてトーストは非常に役立ちます。

Kotlinを使用して、このトーストをどのように使うのか、初心者から上級者までの方々に向けて、基本的な使い方から少し高度なカスタマイズ方法までを解説していきます。

○サンプルコード1:シンプルなトーストを表示

まずは、Kotlinを使用して最も基本的なトーストメッセージを表示する方法を見ていきましょう。

import android.app.Activity
import android.os.Bundle
import android.widget.Toast

class MainActivity : Activity() {

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

        // トーストメッセージを表示
        Toast.makeText(this, "こんにちは、トースト!", Toast.LENGTH_SHORT).show()
    }
}

このコードでは、Toast.makeTextメソッドを使ってトーストを作成しています。

そして、showメソッドを呼び出すことで、トーストメッセージを表示しています。

表示されるメッセージは「こんにちは、トースト!」となります。

また、Toast.LENGTH_SHORTにより、短い時間だけトーストが表示されます。

このコードを実行すると、アプリを開始するとすぐに「こんにちは、トースト!」というメッセージが画面下部に一瞬だけ表示されます。

○サンプルコード2:トーストの位置を変更する

次に、トーストの表示位置を変更する方法を解説します。

import android.app.Activity
import android.os.Bundle
import android.widget.Toast
import android.view.Gravity

class MainActivity : Activity() {

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

        // トーストメッセージの作成
        val toast = Toast.makeText(this, "上部に表示されるトースト!", Toast.LENGTH_SHORT)
        // 位置の変更
        toast.setGravity(Gravity.TOP, 0, 0)
        // トーストを表示
        toast.show()
    }
}

このコードでは、setGravityメソッドを使用して、トーストの表示位置を変更しています。

指定されたGravity.TOPにより、トーストは画面の上部に表示されます。

また、後ろの2つの0, 0は、x軸とy軸のオフセットを示しており、これによりトーストの具体的な位置を微調整することができます。

このコードを実行すると、アプリを開始するとすぐに「上部に表示されるトースト!」というメッセージが画面上部に表示されます。

○サンプルコード3:トーストの持続時間を変更する

Androidのトーストはデフォルトで2つの持続時間を提供しています。

それはToast.LENGTH_SHORTToast.LENGTH_LONGです。前者は約2秒、後者は約3.5秒の表示時間となります。

この持続時間をカスタマイズすることは直接的にはサポートされていませんが、シンプルにはこの2つのオプションの中から選ぶことができます。

Kotlinを使用して、トーストの持続時間を変更するサンプルコードを見ていきましょう。

import android.app.Activity
import android.os.Bundle
import android.widget.Toast

class MainActivity : Activity() {

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

        // 長めの持続時間でトーストメッセージを表示
        Toast.makeText(this, "これは長めに表示されるトーストです", Toast.LENGTH_LONG).show()
    }
}

このコードでは、Toast.makeTextの第3引数としてToast.LENGTH_LONGを指定して、トーストの持続時間を長めにしています。

このサンプルを実行すると、メッセージ「これは長めに表示されるトーストです」が約3.5秒間、画面に表示されることになります。

○サンプルコード4:カスタムデザインのトーストを表示

標準のトーストデザインではなく、自分のアプリケーションのデザインに合わせたトーストを表示したい場合もあるでしょう。

カスタムデザインのトーストを表示するには、専用のレイアウトを作成し、そのレイアウトをトーストに適用します。

import android.app.Activity
import android.os.Bundle
import android.view.LayoutInflater
import android.widget.Toast

class MainActivity : Activity() {

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

        // カスタムトーストレイアウトの読み込み
        val layoutInflater = LayoutInflater.from(this)
        val customToastLayout = layoutInflater.inflate(R.layout.custom_toast_layout, null)

        // トーストにカスタムレイアウトを設定して表示
        val customToast = Toast(this)
        customToast.view = customToastLayout
        customToast.duration = Toast.LENGTH_SHORT
        customToast.show()
    }
}

R.layout.custom_toast_layoutは、あらかじめ作成したカスタムのトーストレイアウトのIDを示しています。

このサンプルを実行すると、custom_toast_layout.xmlで定義したデザインのトーストが表示されます。

○サンプルコード5:トーストで画像を表示

アンドロイドのトーストメッセージはテキストだけでなく、画像も一緒に表示することができます。

ユーザーへのフィードバックや通知をより視覚的に伝えるために、画像を含むトーストメッセージは大変効果的です。

Kotlinで画像を含んだトーストメッセージを表示する方法について、具体的なサンプルコードとともに見ていきましょう。

import android.app.Activity
import android.os.Bundle
import android.widget.ImageView
import android.widget.LinearLayout
import android.widget.Toast

class MainActivity : Activity() {

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

        // トースト用のレイアウトを作成
        val toastLayout = LinearLayout(this)
        toastLayout.orientation = LinearLayout.HORIZONTAL

        // 画像を設定
        val imageView = ImageView(this)
        imageView.setImageResource(R.drawable.sample_image)  // sample_imageは予めres/drawableに保存しておく
        toastLayout.addView(imageView)

        // トーストにレイアウトを設定して表示
        val customToast = Toast(this)
        customToast.view = toastLayout
        customToast.duration = Toast.LENGTH_SHORT
        customToast.show()
    }
}

このコードでは、LinearLayoutを使ってトースト用のレイアウトを生成し、その中にImageViewを追加して画像を表示しています。

R.drawable.sample_imageは、あらかじめアプリのres/drawableディレクトリに配置しておいた画像リソースのIDを指しています。

このサンプルを実行すると、画像を含むトーストが短時間表示されます。

●トーストの応用例

アンドロイド開発において、トーストは単に情報を伝えるだけでなく、ユーザー体験を向上させるための多岐にわたる用途で活用できます。

Kotlinを利用して、トーストのさまざまな応用例を学びましょう。

○サンプルコード6:トーストでユーザーの入力をフィードバック

ユーザーのアクションや入力に対してフィードバックを提供することは、良いUI/UXの設計原則とされています。

下記のサンプルでは、ユーザーがボタンをクリックした際にトーストメッセージでフィードバックを与える方法を表しています。

import android.app.Activity
import android.os.Bundle
import android.widget.Button
import android.widget.Toast

class MainActivity : Activity() {

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

        val button = findViewById<Button>(R.id.myButton)
        button.setOnClickListener {
            Toast.makeText(this, "ボタンがクリックされました", Toast.LENGTH_SHORT).show()
        }
    }
}

ボタンをクリックすると、「ボタンがクリックされました」というメッセージのトーストが短時間表示され、ユーザーにそのアクションが正しく受け取られたことを知らせます。

○サンプルコード7:トーストで通知を表示

トーストは短期的な通知にも利用できます。

アプリケーション内で何らかのイベントが発生した際に、ユーザーにそれを知らせる目的でトーストを表示することができます。

import android.app.Activity
import android.os.Bundle
import android.widget.Toast

class MainActivity : Activity() {

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

        // 何らかのイベントが発生したと仮定
        val eventHappened = true

        if (eventHappened) {
            Toast.makeText(this, "新しい通知があります", Toast.LENGTH_LONG).show()
        }
    }
}

このコードの中で、eventHappenedという変数を使ってイベントが発生したかどうかを判定しています。

この変数がtrueの場合、トーストが表示されます。

このようにして、アプリの中で特定のイベントや変化があった際に、ユーザーにトーストを通じて通知を行うことができます。

○サンプルコード8:連続してトーストを表示

アンドロイドのトーストは、一度に一つのメッセージしか表示することができません。

しかし、状況によっては連続して複数のトーストメッセージを表示する必要があります。

こういった場合、適切なタイミングと間隔でトーストを連続表示する方法を学びます。

下記のサンプルコードでは、2つの異なるトーストメッセージを一定の間隔で連続して表示する方法を表しています。

import android.app.Activity
import android.os.Bundle
import android.widget.Button
import android.os.Handler
import android.widget.Toast

class MainActivity : Activity() {

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

        val button = findViewById<Button>(R.id.toastButton)
        button.setOnClickListener {
            Toast.makeText(this, "1つ目のトーストメッセージ", Toast.LENGTH_SHORT).show()

            // 2秒後に2つ目のトーストを表示
            Handler().postDelayed({
                Toast.makeText(this, "2つ目のトーストメッセージ", Toast.LENGTH_SHORT).show()
            }, 2000)
        }
    }
}

このコードを実行すると、ボタンをクリックすると「1つ目のトーストメッセージ」というトーストが表示され、その後2秒間の遅延を経て「2つ目のトーストメッセージ」という次のトーストが表示されます。

○サンプルコード9:トーストにアニメーションを追加

トーストをさらに魅力的にするためには、アニメーションを追加する方法も考えられます。

下記のコードは、トーストの表示や消失にフェードイン・フェードアウトのアニメーションを追加する方法を表しています。

まず、res/animディレクトリにアニメーションのXMLファイルを作成します。

<!-- res/anim/fade_in.xml -->
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="300"
    android:fromAlpha="0.0"
    android:toAlpha="1.0" />

<!-- res/anim/fade_out.xml -->
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
    android:duration="300"
    android:fromAlpha="1.0"
    android:toAlpha="0.0" />

次に、トーストを表示する際にこれらのアニメーションを適用します。

import android.app.Activity
import android.os.Bundle
import android.view.animation.AnimationUtils
import android.widget.Toast

class MainActivity : Activity() {

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

        val fadeIn = AnimationUtils.loadAnimation(this, R.anim.fade_in)
        val fadeOut = AnimationUtils.loadAnimation(this, R.anim.fade_out)

        val toast = Toast.makeText(this, "アニメーション付きのトースト", Toast.LENGTH_SHORT)
        toast.view.startAnimation(fadeIn)
        toast.show()

        toast.view.startAnimation(fadeOut)
    }
}

このコードを実行すると、「アニメーション付きのトースト」というメッセージのトーストがフェードインして表示され、表示が終わるとフェードアウトして消えます。

○サンプルコード10:スワイプでトーストを消す

トーストは、ショートメッセージを一時的に表示するためのツールとしてよく使用されます。

しかし、場合によっては、ユーザーがトーストメッセージを手動で即座に消去したいことがあります。

ここでは、トーストメッセージをスワイプして消去する方法について詳しく解説します。

Androidの標準的なトーストでは、スワイプで消去する機能は提供されていません。

そのため、カスタムトーストを使用してこの機能を実現します。

まずは、カスタムトーストを表示するための基本的なサンプルコードを紹介します。

import android.app.Activity
import android.os.Bundle
import android.view.MotionEvent
import android.view.View
import android.widget.Toast

class MainActivity : Activity() {
    private var toast: Toast? = null

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

        val customToastLayout = layoutInflater.inflate(R.layout.custom_toast_layout, null)
        customToastLayout.setOnTouchListener { _, event ->
            if (event.action == MotionEvent.ACTION_MOVE) {
                toast?.cancel()
                true
            } else {
                false
            }
        }

        toast = Toast(this)
        toast?.view = customToastLayout
        toast?.duration = Toast.LENGTH_LONG
        toast?.show()
    }
}

このコードでは、custom_toast_layout.xmlというレイアウトリソースからカスタムトーストのビューを作成しています。

作成したビューには、スワイプアクションのリスナーを追加しています。ユーザーがこのビューをスワイプすると、トーストが消去されます。

上述のサンプルコードの中で、setOnTouchListenerメソッドを使って、ビューにタッチイベントのリスナーを設定しています。

ユーザーがスワイプアクションを開始すると、ACTION_MOVEイベントが発生します。このイベントが検出されたら、toast?.cancel()メソッドを呼び出して、トーストを消去します。

●トーストの注意点と対処法

トーストは簡単に使えるため、多くのAndroid開発者にとって重宝されています。

しかし、その便利さの裏にはいくつかの注意点が存在します。

トーストを適切に使用するための注意点と、それらの問題を回避または対処する方法について詳しく見ていきましょう。

○サンプルコード11:トーストが重ならないようにする

多くのアクティビティや操作でトーストを頻繁に表示する場合、一度に多数のトーストが表示されることがあります。

これは見た目が良くないだけでなく、ユーザーに情報を正確に伝えられなくなることも考えられます。

そこで、前に表示されているトーストをキャンセルしてから新しいトーストを表示する方法を採用することが推奨されます。

import android.content.Context
import android.widget.Toast

class ToastManager(private val context: Context) {
    private var currentToast: Toast? = null

    fun showToast(message: String) {
        currentToast?.cancel()  // 現在のトーストをキャンセル

        currentToast = Toast.makeText(context, message, Toast.LENGTH_SHORT)
        currentToast?.show()
    }
}

このコードでは、ToastManagerクラスを定義しています。

showToastメソッドは、現在表示されているトースト(currentToast)があればキャンセルし、新しいトーストを表示します。

これにより、トーストが重なる問題を解決することができます。

○サンプルコード12:異なるアクティビティでトーストを正しく表示

アクティビティが変わる時、トーストが意図せず切れることがあります。

これはトーストがアクティビティのコンテキストに紐づいているためです。

アクティビティが終了または変更されると、そのアクティビティに紐づいたトーストも影響を受ける可能性があります。

これを回避するために、アプリケーションのコンテキストを使用してトーストを表示する方法があります。

import android.app.Application
import android.widget.Toast

class MyApp : Application() {
    fun showGlobalToast(message: String) {
        Toast.makeText(applicationContext, message, Toast.LENGTH_SHORT).show()
    }
}

このコードのMyAppクラス内で、showGlobalToastメソッドを定義しています。

このメソッドは、アプリケーションのコンテキスト(applicationContext)を使ってトーストを表示します。

この方法を使用すると、異なるアクティビティ間でのトーストの表示が切れる問題を回避することができます。

●トーストのカスタマイズ方法

AndroidのトーストはシンプルでわかりやすいUI要素ですが、時にそのデザインや表現を変更したい場面も出てきます。

Kotlinを使ったAndroidアプリケーションでのトーストのカスタマイズ方法に関するいくつかのテクニックを詳しく紹介します。

○サンプルコード13:カスタムフォントでトーストを表示

既存のアプリデザインに合わせて、トーストメッセージのフォントを変更したい場合があります。

下記の方法で、特定のフォントを使用してトーストを表示することができます。

import android.graphics.Typeface
import android.widget.TextView
import android.widget.Toast
import android.content.Context

fun showCustomFontToast(context: Context, message: String) {
    val toast = Toast.makeText(context, message, Toast.LENGTH_SHORT)
    val toastTextView = toast.view.findViewById<TextView>(android.R.id.message)
    val customFont = Typeface.createFromAsset(context.assets, "your_custom_font.ttf")
    toastTextView.typeface = customFont
    toast.show()
}

このコードでは、showCustomFontToast関数を定義し、トースト内のTextViewにアクセスして、カスタムフォントを設定しています。

your_custom_font.ttfは、アプリのassetsフォルダにあるカスタムフォントのファイル名に置き換えてください。

○サンプルコード14:トーストに影を追加

トーストメッセージに視覚的な強調を加えるために影を追加することができます。

下記のコードで、トーストに影を追加する方法を紹介します。

import android.widget.TextView
import android.widget.Toast
import android.content.Context

fun showShadowToast(context: Context, message: String) {
    val toast = Toast.makeText(context, message, Toast.LENGTH_SHORT)
    val toastTextView = toast.view.findViewById<TextView>(android.R.id.message)
    toastTextView.setShadowLayer(5f, 2f, 2f, android.R.color.black)
    toast.show()
}

このコードでは、トーストのテキストビューにsetShadowLayerメソッドを使用して影を追加しています。

○サンプルコード15:動的なデータをトーストで表示

アプリ内でのユーザーの動作や外部データの変更に基づいて、動的な内容をトーストで表示したい場面があります。

例えば、ユーザーがアイテムをカートに追加した際に、そのアイテム名をトーストで表示する場合の方法を見てみましょう。

import android.widget.Toast
import android.content.Context

fun showItemAddedToast(context: Context, itemName: String) {
    val message = "$itemName がカートに追加されました。"
    Toast.makeText(context, message, Toast.LENGTH_SHORT).show()
}

このコードでは、showItemAddedToast関数を定義しています。

関数にはアイテム名(itemName)を渡すことで、動的にトーストメッセージを生成して表示します。

まとめ

Kotlinを使用したAndroidアプリケーション開発におけるトーストの活用方法は多岐にわたります。

基本的な表示方法から、位置やデザインの変更、さらにはアニメーションやカスタマイズまで、トーストは非常に柔軟なUI要素としてアプリ内で利用できます。

アプリ開発の中でユーザーとのコミュニケーションは非常に重要です。

トーストは、短くてシンプルながらも、ユーザーに必要な情報や確認を迅速に伝える手段として効果的です。

適切なカスタマイズと適切なタイミングでの表示は、アプリの使いやすさやユーザーサティスファクションの向上に大きく寄与します。

この記事が参考になりましたら幸いです。