Home » Android » Spinner Theme is dark in Android

Spinner Theme is dark in Android

Posted by: admin June 15, 2020 Leave a comment

Questions:

I am trying to change the toolbar spinner dropdown theme strangely this is not happening. It is coming up always dark when I click on the spinner. I would like to have the background grey and text black.

I don’t have any actionbar. I am setting everything through toolbar.

Hence I tried the following:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:local="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/colorPrimary"
    android:minHeight="?attr/actionBarSize"
    local:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    local:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <RelativeLayout
        android:id="@+id/relativeLayoutID"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:id="@+id/toolbar_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_gravity="left|center"
            android:text="@string/register_title"
            android:textColor="@color/whiteText"
            android:textSize="@dimen/text_size_medium" />

        <Spinner
            android:id="@+id/spinner"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:minWidth="80dp"
            android:spinnerMode="dropdown"
            android:visibility="gone" />

    </RelativeLayout>

</android.support.v7.widget.Toolbar>

Style xml:

 <resources>

<style name="Theme.default" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="md_widget_color">@color/numbertext</item>
    <item name="android:colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="android:colorPrimary">@color/colorPrimary</item>
    <item name="android:windowContentOverlay">@drawable/toolbar_dropshadow</item>
    <item name="android:windowBackground">@android:color/white</item>
    <item name="android:editTextColor">@android:color/background_dark</item>
    <item name="android:textColor">@android:color/background_dark</item>
    <item name="colorControlNormal">@android:color/background_dark</item>
    <item name="colorControlActivated">@color/orangeText</item>
    <item name="colorControlHighlight">@color/orangeText</item>
    <item name="android:statusBarColor">@color/colorPrimary</item>

</style>

<style name="Widget.MyApp.HeaderBar.Spinner" parent="Widget.AppCompat.Light.Spinner.DropDown.ActionBar">
    <item name="android:background">?android:selectableItemBackground</item>
    <item name="android:dropDownSelector">?android:selectableItemBackground</item>
    <item name="android:divider">@color/blackText</item>
    <item name="android:overlapAnchor">true</item>
</style></resources>

Update:

Added the following theme:

<style name="MyDarkToolbarStyle" parent="@style/Widget.AppCompat.Spinner.DropDown.ActionBar">
        <item name="background">?android:selectableItemBackground</item>
        <item name="android:popupBackground">@color/layoutbackground</item>
        <item name="android:dropDownSelector">?android:selectableItemBackground</item>
        <item name="android:divider">@color/blackText</item>
        <item name="android:overlapAnchor">true</item>
    </style>

And applied it to the spinner:

<Spinner
            android:id="@+id/spinner"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:minWidth="80dp"
style="@style/MyDarkToolbarStyle"
            android:spinnerMode="dropdown"
            android:visibility="gone" />

With above settings I could change the dropdown background color but not I am not able to get ripple effect on selection this used to happen before applying the theme to the spinner?

How to&Answers:

Just add the following to your Spinner the same way you did for your Toolbar:

local:popupTheme="@style/ThemeOverlay.AppCompat.Light"
local:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"

So your final Spinner will look like this:

<Spinner
    android:id="@+id/spinner"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:minWidth="80dp"
    android:spinnerMode="dropdown"
    local:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    local:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    android:visibility="gone" />