CODEWITHSUNDEEP
androidlistview
Melllvar
Melllvar

Reputation: 2086

Controlling the color of the fading edge in ListViews

I have a theme that derives from Android's default light theme. My ListViews are configured with a white background, and I guess as a side-effect of this, the color of the fading edge is white, which is not something that I want - I'd like them to be black.

It seems impossible to simply change the color of the edge (although I can control the length and other factors), and the usual suggestion of using a black color for listview's hint color results in some pretty horrible side-effects when the list scrolls.

Can anyone advise a reliable way of changing the color of the fading edge to an arbitrary color?

Upvotes: 14

Views: 22200

Answers (7)

Dan Harvey
Dan Harvey

Reputation: 798

I had the problem that white was the "Overscroll" color, not actually the fading edge.

try this (assuming you want a fading edge, but not the horrid white glare when you hit the ends! (otherwise set requires fading edge to none)):

<ListView
    android:id="@+id/listview"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" 
    android:cacheColorHint="#00000000"
    android:requiresFadingEdge="vertical"
    android:fadingEdgeLength="10dp" 
    android:overScrollMode="never" >      </-- this is the line you want i think -->
</ListView>

Upvotes: 10

Jared Rummler
Jared Rummler

Reputation: 38131

You can change the EdgeEffect color of a ListView or GridView using reflection. Copy the following static factory methods into your project and use setEdgeGlowColor(yourListView, yourAwesomeColor);:

public static void setEdgeGlowColor(AbsListView listView, int color) {
    try {
        Class<?> clazz = AbsListView.class;
        Field fEdgeGlowTop = clazz.getDeclaredField("mEdgeGlowTop");
        Field fEdgeGlowBottom = clazz.getDeclaredField("mEdgeGlowBottom");
        fEdgeGlowTop.setAccessible(true);
        fEdgeGlowBottom.setAccessible(true);
        setEdgeEffectColor((EdgeEffect) fEdgeGlowTop.get(listView), color);
        setEdgeEffectColor((EdgeEffect) fEdgeGlowBottom.get(listView), color);
    } catch (Exception ignored) {
    }
}

public static void setEdgeEffectColor(EdgeEffect edgeEffect, int color) {
    try {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
            edgeEffect.setColor(color);
            return;
        }
        Field edgeField = EdgeEffect.class.getDeclaredField("mEdge");
        Field glowField = EdgeEffect.class.getDeclaredField("mGlow");
        edgeField.setAccessible(true);
        glowField.setAccessible(true);
        Drawable mEdge = (Drawable) edgeField.get(edgeEffect);
        Drawable mGlow = (Drawable) glowField.get(edgeEffect);
        mEdge.setColorFilter(color, PorterDuff.Mode.SRC_IN);
        mGlow.setColorFilter(color, PorterDuff.Mode.SRC_IN);
        mEdge.setCallback(null); // free up any references
        mGlow.setCallback(null); // free up any references
    } catch (Exception ignored) {
    }
}

Upvotes: 4

jaxvy
jaxvy

Reputation: 5090

This library will solve your problem: https://github.com/AndroidAlliance/EdgeEffectOverride

Upvotes: 0

Menny
Menny

Reputation: 473

If you mean the "edge glow/effect", I found a very simple (but hackish) way to accomplish this (changing the color of the glow):

int glowDrawableId = context.getResources().getIdentifier("overscroll_glow", "drawable", "android");
Drawable androidGlow = context.getResources().getDrawable(glowDrawableId);
androidGlow.setColorFilter(brandColor, PorterDuff.Mode.MULTIPLY);

I took advantage of the fact that the glow effect is actually a Drawable (and un-mutate at that), and applied a filter on it. More about it, here: http://evendanan.net/android/branding/2013/12/09/branding-edge-effect/

Upvotes: 1

Thomson Comer
Thomson Comer

Reputation: 3919

I posted a complete solution for this problem in a class that extends ListView. Here: Is it possible to change the colour of the FadingEdge of a Listview?

Upvotes: 2

Scott
Scott

Reputation: 2602

It's actually much easier then that.

You can change the colour of the fade to anything you want using the: 'android:cacheColorHint' setting.

eg:

<ListView
....
android:cacheColorHint="#FFFFFF"
/>

Upvotes: 35

Romain Guy
Romain Guy

Reputation: 98521

Unfortunately you cannot do this easily. The whole point of the fading edges is to fade into the background, not to draw some random color. However, you can try to extend ListView and override getSolidColor() to return the color you want for the fading edges. It should work just fine.

Upvotes: 19

Related Questions