'Change the background color of exposed dropdown menu
I think Android developers are kidding us. First they removed the real spinner from the Material Design and second it is somehow impossible to style. Look at this image. I looks really good ALMOST!. I did not find a possibility to change the background color of the dropdown list. I can style each item in the list, but that still leaves the 'rounded corners area' on top and bottom of the list in white.
Does anybody know how to ONLY change the background color of the list?
There is indeed a way of changing it (Taken from here), by applying:
<style name="AppTheme.ExposedDropdownMenu" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu">
<item name="materialThemeOverlay">@style/AppTheme.ExposedDropdownMenu.MaterialThemeOverlay</item>
</style>
<style name="AppTheme.ExposedDropdownMenu.MaterialThemeOverlay" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
<!-- background color of dropdown (popup) items -->
<item name="colorSurface">#444444</item>
</style>
But this changes the padding, color, padding of the EditText. Also it completly removes the elevation of the menu, which i was not able to restore.
It cannot be so difficult to only change the background color of this menu?! Why is this API so damn confusing.
Follow up question: Anyone knows a way of making the TextView compund drawable round (Inside the EditText)?
Solution 1:[1]
<style name="changeBackgroundColor" parent="Widget.MaterialComponents.TextInputLayout.Outline dBox.Dense">
<item name="colorSurface">@color/yourColor</item>
</style>
Then, include this theme in your .xml layout inside TextInputLayout. i.e.
android:theme="@style/changeBackgroundColor"
Solution 2:[2]
Add this line " 8dp" for Elevation to popup.inside style :
<style name="AppTheme.ExposedDropdownMenu.MaterialThemeOverlay" parent="Theme.MaterialComponents.DayNight.DarkActionBar">
<!-- background color of dropdown (popup) items -->
<item name="colorSurface">@4f4f4f</item>
<item name="android:popupElevation">8dp</item>
</style>
use this sytle inside main style like:
<style name="dropdown" parent="Widget.MaterialComponents.TextInputLayout.OutlinedBox.ExposedDropdownMenu">
<!-- The color of the label when it is collapsed and the text field is active -->
<item name="colorControlActivated">@color/colorFFB44C</item>
<item name="materialThemeOverlay">@style/AppTheme.ExposedDropdownMenu.MaterialThemeOverlay</item>
</style>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | Rudra Rokaya |
Solution 2 |