Material Design ComponentsにMenusというカテゴリがあります。
「Menus(メニュー)」なので、言葉のとおり、選択する項目を一覧表示する機能です。
Menusはメニューの表現方法によって、幾つかの種類があります。
このMenusの種類と特徴を紹介します。
目次
メニューの種類
Material Design componentsのMenusを分類すると図ようになります。
この中でOverflow/Context/Popup menusの3つは、AndroidのMenu APIが提供するもので、以前よりAndroidデベロッパー・ドキュメントに紹介されていたメニューです。
どれもDropdownMenu(起点から項目が垂れ下がるように表示されるメニュー)です。
メニューの特徴
各々のメニューの特徴をまとめると表のようになります。
Menu名 | 表示イベント | 表示位置 | アイテムの指定 | |
---|---|---|---|---|
Dropdown | Overflow (Option) | オーバーフローアイコンの クリック | コンテンツ画面の右上 | menuリソース |
Context | ターゲットViewの ロングクリック | ターゲットViewの クリック位置 |
||
Popup | ターゲットViewの クリック | アンカーViewの下 | ||
List popup window | ListAdapter | |||
Exposed dropdown | TextInputLayoutの クリック | TextInputLayoutの下 |
オーバーフローアイコンをクリックすることで、コンテンツ画面の右上(定位置)に表示されるメニューです。
アプリケーションに対するメニューに向いています。

実装方法は「Overflow menusの実装」を参照してください。
ターゲットViewをロングクリックした時、そのViewのクリックした位置に表示されるメニューです。

実装方法は「Context menusの実装」を参照してください。
ターゲットViewをクリックすることで、アンカーViewの下に表示されるメニューです。
※表示例はターゲット=アンカーViewになっています。

実装方法は「Popup menusの実装」を参照してください。
ターゲットViewをクリックすることで、アンカーViewの下に表示されるメニューです。
※表示例はターゲット=アンカーViewになっています。

実装方法は「List popup window menusの実装」を参照してください。
EditText(文字入力を要求するView)の入力候補を表示するメニューです。
※AutoCompleteTextViewはEditTextを継承しています。

Material Design ComponentsのText fieldsカテゴリの方が機能的に近いと思いますが、何故かMenusカテゴリに属しています。
実装方法は「Exposed dropdown menusの実装」を参照してください。
関連記事: