# Menu ## Design & API Documentation * [Material Design guidelines: Menus](https://material.io/design/components/menus.html) ## Material Styles The MaterialComponents theme provides styling for overflow, contextual and popup menus. Just use any `Theme.MaterialComponents.*` theme or add the widget styles to your theme: ```xml @style/Widget.MaterialComponents.PopupMenu @style/Widget.MaterialComponents.PopupMenu.ContextMenu @style/Widget.MaterialComponents.PopupMenu.Overflow ``` For information on the Exposed Dropdown Menu, see its [specific section below](#exposed-dropdown-menus). ## Overflow Menus The following will provide the Material style through the `actionOverflowMenuStyle` theme attribute. **res/menu/custom_menu.xml** ```xml ``` **MainActivity.java** ```java @Override public boolean onCreateOptionsMenu(Menu menu) { MenuInflater inflater = getMenuInflater(); inflater.inflate(R.menu.custom_menu, menu); return true; } ``` ## Popup Menus Inflating menus via `PopupMenu` will also have have the right styling through the `popupMenuStyle` theme attribute. ```java public boolean showMenu(View anchor) { PopupMenu popup = new PopupMenu(this, anchor); popup.getMenuInflater().inflate(R.menu.custom_menu, popup.getMenu()); popup.show(); } ``` ## Exposed Dropdown Menus The Exposed Dropdown Menu is implemented via the use of the `TextInputLayout`. For detailed information on how [Material text fields](https://material.io/design/components/text-fields.html) work, see the [TextInputLayout documentation](TextField.md). ### Usage In order to create an Exposed Dropdown Menu, you will need to use a [TextInputLayout](https://developer.android.com/reference/com/google/android/material/textfield/TextInputLayout) with a `Widget.MaterialComponents.TextInputLayout.*.ExposedDropdownMenu` style. Additionally, the `TextInputLayout` should have an [AutoCompleteTextView](https://developer.android.com/reference/android/widget/AutoCompleteTextView) as its direct child. **res/layout/dropdown_menu.xml** ```xml ``` You will also need an item layout resource to populate the dropdown popup. The example below provides a layout that follows the Material Design guidelines. **res/layout/dropdown_menu_popup_item.xml** ```xml ``` Finally, you will need to set the `AutoCompleteTextView`'s adapter. **MainActivity.java** ```java String[] COUNTRIES = new String[] {"Item 1", "Item 2", "Item 3", "Item 4"}; ArrayAdapter adapter = new ArrayAdapter<>( getContext(), R.layout.dropdown_menu_popup_item, COUNTRIES); AutoCompleteTextView editTextFilledExposedDropdown = view.findViewById(R.id.filled_exposed_dropdown); editTextFilledExposedDropdown.setAdapter(adapter); ``` The example above will provide an editable filled Exposed Dropdown Menu. Note: In order to have a non editable variation of the menu, you should disable user input in the `AutoCompleteTextView`. That can be achieved by setting `android:inputType="none"` on the `AutoCompleteTextView`. #### Setting a default value In order to have a pre-selected value displayed, you can call `setText(CharSequence text, boolean filter)` on the `AutoCompleteTextView` with the filter set to `false`. ### Variations #### Filled As seen above, apply this style to your `TextInputLayout`: ```xml style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.ExposedDropdownMenu" ``` #### Outlined Apply this style to your `TextInputLayout`: ```xml style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu" ``` #### Dense Filled Apply this style to your `TextInputLayout`: ```xml style="@style/Widget.MaterialComponents.TextInputLayout.FilledBox.Dense.ExposedDropdownMenu" ``` #### Dense Outlined Apply this style to your `TextInputLayout`: ```xml style="@style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense.ExposedDropdownMenu" ```