Android spinner arrow always above other views

Question

In my app, I have some spinners (each of which is part of a fragment) in a scrollView. This scrollView is placed below a textView.

The problem is that, when I'm running the app on my test device (Samsung Galaxy S6 Edge [G925F], API 23), the little arrow of the spinner stays visible above the textView, even though the rest of the spinner is already out of view.

I did a lot of research but couldn't find any solutions, so I'm asking here: What do I need to do so that the arrows disappear like the rest of the spinner?

Here some pictures:

In this picture, you can see the textView at the top of the activity and below the spinners, before I scrolled down

In this screenshot, you can see the problem. The little triangles of the spinner are still visible, but the spinner itself is already scrolled out of view.

Here is the XML code of the fragment containing the spinner:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 android:layout_width="match_parent" android:layout_height="match_parent">
<LinearLayout
    android:id="@+id/fragLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <TextView
        android:id="@+id/gradeDisplay"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="15dp"
        android:layout_marginLeft="15dp"
        android:text="1"
        android:textSize="30dp"/>
    <Spinner
        android:id="@+id/spinner"
        android:layout_weight="1"
        android:layout_width="0dp"
        android:layout_height="30dp"
        android:layout_marginLeft="15dp"
        android:layout_marginRight="15dp"
        android:entries="@array/grades"/>
    <ImageButton
        android:id="@+id/imageButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="15dp"
        android:layout_marginEnd="15dp"
        android:layout_marginRight="15dp"
        android:src="@drawable/ic_remove_black_24dp"
        android:background="@null"/>
</LinearLayout>
<Space
    android:layout_width="0dp"
    android:layout_height="5dp"
    android:layout_below="@id/fragLayout"/>
</RelativeLayout>

And here is the code of the MainActivitys content:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="de.jeanma.android.avo.MainActivity"
tools:showIn="@layout/activity_main">
    <Space
        android:id="@+id/mainContentSpace"
        android:layout_width="match_parent"
        android:layout_height="16dp" />
    <TextView
        android:id="@+id/textView"
        android:layout_below="@id/mainContentSpace"
        android:layout_width="match_parent"
        android:text="Standard text"
        android:layout_height="wrap_content"
        android:textSize="40dp"
        android:gravity="end"/>
    <ScrollView
        android:id="@+id/scrollView"
        android:layout_below="@id/textView"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:id="@+id/layout"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:divider="@drawable/divider"
            android:showDividers="middle">
        </LinearLayout>
    </ScrollView>
</RelativeLayout>

The fragments are added to the LinearLayout (@id/layout) by a Java method. If needed, I will post that here as well.

I'm using Java 1.8.05 and the target SDK is 23, the minimum is 14. The code is written in Android Studio

The textView with the problems is the @id/textView, displaying the large number at the top.

Forgotten

That's weird. Is the 0,0 the textview? What id is it and which layout is it in? – Afrikaner

This isn't the answer but: are you adding one fragment for each spinner in that scrollview? Isn't that a little bit overkill? Should be better to use simple ListView or RecyclerView, unless you really need this many fragments. – Trainer

Yes, that's the textView. Its id is @id/textView. @ScriptKitty – Forgotten

Yes, but the fragment also contains a button and an TextView as well. And I need a variable amount of them. The fab is adding them.@Trainer – Forgotten

@Forgotten Wukash's tip can still work. A listview can take a custom layout. As for your question, idk if this could work I'd have to put it on my computer first, but since it is a linear layout can you decrease the height of the scrollview? – Afrikaner

Okay, I'll try that tomorrow. I'll keep you updated. @ScriptKitty – Forgotten

@ScriptKitty I tried to change the height of the ScrollView to wrap_content but unfortunatly that didn't work. – Forgotten

@Forgotten Try placing your ScrollView above your TextView in your xml, so the order would be Space, ScrollView, TextView, changing the z-order of your views (you may also have to change android:layout_below to "@+id/textView" in your ScrollView). Then give your TextView a background color (the same color as the current background). It's a bit of a hacky workaround, but it should work. – Ida

While struggling with the same issue, I found out it has been reported at issuetracker.google.com/issues/37078834 – Tripinnate

Answer 1

@jeanma you can fix the issue with just setting

android:background="#00FFFFFF"

for your ScrollView or root LinearLayout of the ScrollView

Zimmer

Answer 2

I now have got a workaround running. As suggested as I set the textView's backgroundcolor the same as my activity, the arrrows wheren't showing any longer. But the space did behave difrently. There it han'd changed somethinf that I changed the backgroundcolor. So I just removed it. (It still looks kinda good).

The updated XML-file od the MainActivity'a content can be seen here:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="de.jeanma.android.avo.MainActivity"
tools:showIn="@layout/activity_main">
    <TextView
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:text="Standard text"
        android:layout_height="wrap_content"
        android:textSize="40dp"
        android:gravity="end"
        android:background="#FAFAFA"/>
    <ScrollView
        android:id="@+id/scrollView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/textView">
        <LinearLayout
            android:id="@+id/layout"
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:divider="@drawable/divider"
            android:showDividers="middle">
        </LinearLayout>
    </ScrollView>
</RelativeLayout>

But because the arrows were showing threw the padding as well, I changed my

src\main\res\values\dimens.xml to the following (I know that that's really bad practice):

<resources>
    <!-- Default screen margins, per the Android Design guidelines. -->
    <dimen name="activity_horizontal_margin">16dp</dimen>
    <dimen name="activity_vertical_margin">0dp</dimen><!-- This was changed from 16dp to 0dp -->
    <dimen name="fab_margin">16dp</dimen>
</resources>

Thanks @ScriptKity @Wukash @Bryan for your support

Forgotten

Can you have a look at this stackoverflow link ? I have almost the same problem using items containing Spinners. Thank you! – Breeding

Answer 3

Set Background Color in your parent layout.

    android:background="@color/white"

Lapointe

Answer 4

I've run into this problem recently, and believe this is a bug in the hardware accelerated rendering on Android when you combine ScrollView and Spinner.

I was able to fix this by turning the hardware acceleration off for the Spinner(s):

mySpinner.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

Other possibilities how to control the hardware acceleration are described here:

https://developer.android.com/guide/topics/graphics/hardware-accel

Fecula