リファレンス・カスタマイズ

【Android Studio】Snackbarを表示する方法(Kotlin編)

 

ここでは、アプリ画面の下部に簡単なメッセージを表示することができる Snackbar の使い方を紹介します。


 
 

関連記事

 
 


 

開発環境

Android StudioArctic Fox 2020.3.1
Android EmulatorNexus 4 (API 30)
minSdk16
compileSdk31

 

プロジェクトについて

Sample という名前でプロジェクトを作成しています。

また、以下のファイルに実装していきます。

  • MainActivity.kt
  • activity_main.xml

 
 

テーマの確認

themes.xml で指定しているテーマによって Snackbar のデザインが少し異なります。


 

Theme.AppCompat.DayNight.DarkActionBarTheme.MaterialComponents.DayNight.DarkActionBar を指定すると、以下のようなデザインになります。


 
 
 

Snackbar を表示する

基本的な使い方

まず Snackbar を表示するボタンを activity_main.xml に用意します。

 
 
 

次に、ボタンが押された時に呼ばれる showSnackbar メソッドを MainActivity.kt に書きます。(14~20行目)

 
 

14行目

Snackbar.make(view, "ここにメッセージを表示します", Snackbar.LENGTH_SHORT)

1つ目の引数は、Snackbar を表示するビューを指定します。

2つ目の引数には、表示するメッセージを指定します。

3つ目の引数は、Snackbar を表示する時間です。

使用できる値
LENGTH_SHORT短く表示
LENGTH_LONG少し長めに表示
LENGTH_INDEFINITESnackbar が閉じられるか、次の Snackbar が表示されるまで表示

 

表示時間を自分で指定する場合は setDuration メソッドを使うことができます。

.setDuration(10000)

ミリ秒で指定します。1秒 = 1000ミリ秒
 
 
 

アプリを実行すると、このように Snackbar が表示されます。


 
 
 

Snackbar をスワイプで消す方法

CoordinatorLayout を使うと Snackbar をスワイプで消せるようになります。

activity_main.xml の2行目を CoordinatorLayout に変更します。

 
 

アプリを実行すると Snackbar をスワイプして消すことができるようになっています。


 
 
 
 

view オブジェクトついて

ここまでのサンプルではボタンを押した時に Snackbar を表示しているので、クリックイベントの view オブジェクトを使っています。

例えば

  • メール送信完了時
  • ログイン完了時
  • onCreate メソッド内

で Snackbar を表示したい場合は、親レイアウトの id を使って表示することもできます。
 
 

onCreate メソッド内で表示するサンプル

activity_main.xml の親レイアウトに id を追加します。(9行目)

 
 

MainActivity.kt の onCreate メソッドで Snackbar を表示します。(13行目)

 
 
 

アプリを実行すると、このように Snackbar が表示されます。


 
 
 

【Kotlin】Snackbarの文字色・背景色を変更する方法 ここではSnackbar の文字色・背景色を変更する方法を紹介します。 Snackbar の基本的...
ABOUT ME
Sara
「わかりやすく・シンプル」をモットーに、スマホアプリ・ウェブアプリの作り方を紹介します。 独学でプログラミングを勉強をしている方、基礎は勉強したけれど次に何をすれば良いか分からない...という方のお役に立てるサイトを目指しています🙂
guest
0 Comments
Inline Feedbacks
View all comments
0
この記事にコメントするx