Next, we specify a dropDownSelector drawable, which in this case is going to be the same drawable that we created earlier. Here we’re setting the so that it doesn’t overlap with the background of our TextInputLayout. We’re now done with styling the TextInputLayout, so let’s move onto the AutoCompleteTextView. Next up, we’re going to round the corners of the box that’s placed around the TextInputLayout (due to our selected style) by changing the radius of the various corners and also set the boxStrokeWidth and boxStrokeWidthFocused to 0dp since we don’t want any outline on our dropdown.įurthermore, let’s add our custom dropdown arrow icon using the endIconDrawable attribute and also tint it to match our style using endIconTint. Alright, now that we have all of our resources, let’s style our dropdown further.įirst and foremost, we’re going to set the background of our TextInputLayout to the drawable that we created earlier. I used the down arrow from the free feather icon pack. The last thing we’ll need, is a dropdown icon which will be placed at the end of the TextInputLayout. Next, we’re going to create a new filter_spinner_dropdown_bg.xml drawable and use the following code to shape it: Let’s begin with the color that we’ll use for the background of our dropdown. To learn more about the various available styles and customization options, take a look at Google's Menus - Material Design documentation. This in combination with the custom style we’re assigning to the TextInputLayout, will allow the AutoCompleteTextView to function like a spinner when clicked. Pay attention to the inputType="none" line since that tells the AutoCompleteTextView that we’re not planning on entering any text details by hand. Here we’re simply adding a TextInputLayout that contains an AutoCompleteTextView which will act as our dropdown.
Let’s start by declaring the basic layout of a material exposed dropdown menu. I’m also going to be using V iewBinding for this tutorial, so make sure you enable it in your module’s adle by adding the following: android Designing the basic layout Let’s import the library into our project: implementation ‘:material:1.4.0’ On Android, this functionality can be implemented using a TextInputLayout along with a nested AutocompleteTextView which are both components of Android’s material library. Some variations can accept user-entered input.
Final exposed dropdown menu What are exposed dropdown menus?Įxposed dropdown menus display the currently selected menu item above the list of options.
0 kommentar(er)
