目次

• イベントリスナの基本
• 実装例

参考資料

• 参考ドキュメント
  https://material.io/design
  https://github.com/material-components/material-components-android

• スタートガイド
  https://github.com/material-components/material-components-android/blob/master/docs/getting-started.md

手順

1. build.gradle(Project:プロジェクト名)にgoogle()が含まれているかチェック

   1 2 3 4 5

   allprojects { repositories { google() <- これが記述してあればOK } }

2. build.gradle(Module:app)にライブラリを記述

   <version>の部分は以下のURLを参考にする
   - https://mvnrepository.com/artifact/com.google.android.material/material

   1 2 3 4 5

   dependencies { ... implementation 'com.google.android.material:material:<version>' ... }

3. 一度ビルドする

4. styles.xmlを書き換えてみる

   生成したての状態

   1 2 3 4 5 6 7 8 9 10

   <resources> <!-- Base application theme. --> <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/colorPrimary</item> <item name="colorPrimaryDark">@color/colorPrimaryDark</item> <item name="colorAccent">@color/colorAccent</item> </style> </resources>

   これの<style>ブロックのparentパラメーターを書き換えることで、テーマを変更できる

   1	<style name="AppTheme" parent="Theme.MaterialComponents.DayNight.NoActionBar">

   このテーマを書き換えることで、<Button> と <AutoCompleteTextView>の XML コンポーネントをそれぞれ <MaterialButton> と <MaterialAutoCompleteTextView> に置き換えます。

   他のコンポーネントのテーマを変えるには、XMLに直接記述する必要がある

Javaっぽく取得する

データバインディングというらしい？

1
2
3
4
5
6
7

override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
				
				// コンポーネントに設定したID(textView)からTextViewを取得する
				val textView = findViewById(R.id.textView) as TextView
}

Kotlinっぽく取得する（Kotlin Android Extensions使用）

Kotlin Android Extensions

Kotlinが公式で提供している、Androidアプリ開発をサポートしてくれる拡張機能
https://archive-blog.yagi2.dev/2017/10/18/good-bye-findviewbyid.html

1
2
3
4
5
6
7
8
9
10
11

// Inportする必要がある
// <layout>には取得したいLayoutXMLの名前を指定
import kotlinx.android.synthetic.main.<layout>.*

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

				// 後はViewないで指定した、コンポーネントのIDから呼び出せる
				textView.text = "テストだよ"
}