My Spinner View has an elevation shadow acquired from its parent

Question

I have a LinearLayout with two children: a TextView and a Spinner. The LinearLayout, which acquired a theme I defined in the style.xml file, has an elevation value to create the shadow. However, for some reason, the Spinner is getting a shadow as well. It seems to be acquiring it from its parent. If I remove the android:theme property from the LinearLayout parent, the shadow on both the layout and the Spinner go away.

What is going on here? I would like my Spinner to NOT have a shadow.

Also, if I make a custom theme for the Spinner and set the elevation to 0dp, that will get rid of the shadow, but the Spinner runs into other layout problems. I know I'm doing something wrong here...

Here is my code.

Layout Section:

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="5dp"
            android:layout_marginLeft="10dp"
            android:layout_marginRight="10dp"
            android:layout_marginTop="5dp"
            android:background="@drawable/section_background"
            android:orientation="vertical"
            android:theme="@style/AppTheme.Section">

            <TextView
                android:id="@+id/titleCalendar"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginBottom="10dp"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="5dp"
                android:text="Calendar"
                android:textAppearance="?android:attr/textAppearanceMedium"
                android:textStyle="bold" />

            <Spinner
                android:id="@+id/calendarSpinner"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginBottom="10dp"
                android:layout_marginRight="20dp"
                android:layout_marginLeft="20dp"/>
        </LinearLayout>

Theme of the LinearLayout (@style/AppTheme.Section):

        <style name="AppTheme.Section">
            <item name="android:elevation">6dp</item>
        </style>

Java code to fill the Spinner with options:

     String[] spinnerItems = new String[]{
            "Hello",
            "I Love You",
            "This is a Test"
    };

    calendarSpinner = (Spinner) findViewById(R.id.calendarSpinner);

    ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_spinner_item, spinnerItems);
    adapter.setDropDownViewResource( android.R.layout.simple_spinner_dropdown_item );
    calendarSpinner.setAdapter(adapter);

Here is how it looks on the device:

enter image description here

Now, if I add a custom theme to the Spinner...

<Spinner
     android:id="@+id/calendarSpinner"
     android:layout_width="match_parent"
     android:layout_height="wrap_content"
     android:layout_marginBottom="10dp"
     android:layout_marginRight="20dp"
     android:layout_marginLeft="20dp"
     android:theme="@style/SpinnerTheme"/>

Style:

 <style name="SpinnerTheme" parent="AppTheme.SpinnerBase">
      <item name="android:elevation">0dp</item>
 </style>

Style Parent (AppTheme.SpinnerBase):

 <style name="AppTheme.SpinnerBase" parent="Widget.AppCompat.Spinner.Underlined">
 </style>

Here is what I end up with:

enter image description here

The Spinner dropdown has the line and a spinner arrow on the right!

The solution provided by @ThMBc seems to correct the shadow showing up. But can anyone explain why the Spinner view is casting a shadow, even though it itself doesn't have an elevation value? — hellaandrew, Jul 18 '15 at 20:18
elevation in first example: a view is inflated with the parent's style when declared in xml: since you declared elevation, it got elevation. Elevation of the picker itself is because it is a new 'window', a dialog or popup that shows, with it's own lifecycle, default implementation shows shadow, even on Kitkat and earlier — ThMBc, Jul 26 '15 at 08:59

score 3 · Answer 1 · answered Jul 17 '15 at 08:20

inside the xml layout you can also set the elevation to 0.

 <Spinner
 android:id="@+id/calendarSpinner"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:layout_marginBottom="10dp"
 android:layout_marginRight="20dp"
 android:layout_marginLeft="20dp"
 android:elevation="0dp"/>

the element is ignored in earlier version of android if it is not recognized. Be aware that putting elements like this in xml on some devices will result in all arguments that follow the unrecognized one will be ignored, so don't put it as the first argument.

I will certain use this going forward. I was afraid to use this directly in my xml in case it might throw an error on older devices. But if it gets ignored - that eases my worries! — hellaandrew, Jul 18 '15 at 20:16

My Spinner View has an elevation shadow acquired from its parent

1 Answers1