Monday, January 14, 2013

Stop the ListView from turning black while scrolling in Android

While developing an Android app, I noticed that my nice white color ListView will turn black whenever I scroll the list. See the screenshot below.


I found out that I set the cacheColorHint property to black in the Android layout xml file.
    <ListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/listView1"
        android:background="#ffffff"
        android:cacheColorHint="#000000" >
    </ListView>

To rectify the problem, simply set the cacheColorHint property to white to match the background color as shown below.
    <ListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/listView1"
        android:background="#ffffff"
        android:cacheColorHint="#FFFFFF" >
    </ListView>
Alternatively instead of white, it is okay to set the CacheColorHint property to transparent.

    <ListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/listView1"
        android:background="#ffffff"
        android:cacheColorHint="@android:color/transparent" >
    </ListView>


And the resultant scrolling of the list will work correctly, as shown below.