`
love19820823
  • 浏览: 933983 次
文章分类
社区版块
存档分类
最新评论

Android ListView 滑动背景为黑色的解决办法

 
阅读更多

在别的地方看到的,转过来作为记录!!

在Android中,ListView是最常用的一个控件,在做UI设计的时候,很多人希望能够改变一下它的背景,使他能够符合整体的UI设计,改变背景背很简单只需要准备一张图片然后指定属性 android:background="@drawable/bg",不过不要高兴地太早,当你这么做以后,发现背景是变了,但是当你拖动,或者点击list空白位置的时候发现ListItem都变成黑色的了,破坏了整体效果,如下图所示:

这是为什么呢?

这个要从Listview的效果说起,默认的ListItem背景是透明的,而ListView的背景是固定不变的,所以在滚动条滚动的过程中如果实时地去将当前每个Item的显示内容跟背景进行混合运算,所以android系统为了优化这个过程用,就使用了一个叫做android:cacheColorHint的属性,在黑色主题下默认的颜色值是#191919,所以就出现了刚才的画面,有一半是黑色的.

那怎么办呢?

如果你只是换背景的颜色的话,可以直接指定android:cacheColorHint为你所要的颜色,如果你是用图片做背景的话,那也只要将android:cacheColorHint指定为透明(#00000000)就可以了,当然为了美化是要牺牲一些效率的。最后就不回出现上面所说的你不想要的结果了!
自定义ListView行间的分割线

在Android平台中系统控件提供了灵活的自定义选项,所有基于ListView或者说AbsListView实现的widget控件均可以通过下面的方法设置行间距的分割线,分割线可以自定义颜色、或图片。

在ListView中我们使用属性 android:divider="#FF0000"定义分隔符为红色,当然这里值可以指向一个drawable图片对象,如果使用了图片可能高度大于系统默认的像素,可以自己设置高度比如6个像素 android:dividerHeight="6px" ,Android开发网提示当然在Java中ListView也有相关方法可以设置。

1)点击Item时无背景颜色变化
在xml文件中的ListView控件中加入如下属性:
android:listSelector="@drawable/timer_list_selector"
在drawable中定义timer_list_selector的属性值
timer_list_selector.xml中定义如下:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="@android:color/transparent" />
</selector>
在values文件夹下的colors.xml中定义transparent如下:
<color name="transparent">#50000000</color>

2)设置Item之间无间隙
在xml文件中ListView控件中加入如下属性:
android:divider="#00000000"
或者在javaCode中如下定义:
listView.setDividerHeight(0);

3)自定义的BaseAdapter中调用notifyDataSetChanged()方法会重新调用BaseAdapter的getView()方法。

用心的朋友应该会发现,listview中在设置了背景之后。会有些问题。

1.、listview在拖动的时候背景图片消失变成黑色背景。等到拖动完毕我们自己的背景图片才显示出来。

2 、listview的上边和下边有黑色的阴影。

3、lsitview的每一项之间需要设置一个图片做为间隔。

针对以上问题 在listview的xml文件中设置一下语句。

问题1 有如下代码结解决 android:scrollingCache="false"

问题2 用如下代码解决:android:fadingEdge="none"
问题3 用如下代码解决: android:divider="@drawable/list_driver" 其中 @drawable/list_driver 是一个图片资源

总体如下

<ListView
android:id="@+id/myListView01"
android:layout_width="fill_parent"
android:layout_height="287dip"
android:fadingEdge="none"
android:divider="@drawable/list_driver"
android:scrollingCache="false"
android:background="@drawable/list">
</ListView>

Why is my list black? An Android optimization

ListViewis one of Android's most widely used widgets. It is rather easy to use, very flexible and incredibly powerful.ListViewcan also be difficult to understand at times.

One of the most common issues withListViewhappens when you try to use a custom background. By default, like many Android widgets,ListViewhas a transparent background which means yo can see through the default window's background, a very dark gray (#FF191919with the current dark theme.) Additionally,ListViewenables thefading edgesby default, as you can see at the top of the following screenshot; the first text item gradually fades to black. This technique is used throughout the system to indicate that the container can be scrolled.

Android's default ListView

The fade effect is implemented using a combination ofCanvas.saveLayerAlpha() and thePorter-Duff Destination Out blending mode. This technique is similar to the one explained inFilthy Rich Clientsand various presentations. Unfortunately, things start to get ugly when you try to use a custom background on theListViewor when you change the window's background. The following two screenshots show what happens in an application when you change the window's background. The left image shows what the list looks like by default and the right image shows what the list looks like during a scroll initiated with a touch gesture:

Dark fadeDark list

This rendering issue is caused by an optimization of the Android framework enabled by default on all instances ofListView(for some reason, I forgot to enable it by default onGridView.) I mentioned earlier that the fade effect is implemented using a Porter-Duff blending mode. This implementation works really well but is unfortunately very costly and can bring down drawing performance by quite a bit as it requires to capture a portion of the rendering in an offscreen bitmap and then requires extra blending (which implies readbacks from memory.)

SinceListViewis most of the time displayed on a solid background, there is no reason to go down that expensive route. That's why we introduced an optimization called the "cache color hint." The cache color hint is an RGB color set by default to the window's background color, that is #191919 in Android's dark theme. When this hint is set,ListView(actually, its base classView) knows it will draw on a solid background and therefore replaces th expensivesaveLayerAlpha()/Porter-Duffrendering with a simple gradient. This gradient goes from fully transparent to the cache color hint value and this is exactly what you see on the image above, with the dark gradient at the bottom of the list. However, this still does not explain why the entire list turns black during a scroll.

As I said before,ListViewhas a transparent/translucent background by default, and so all default Android widgets. This implies that whenListViewredraws its children, it has to blend the children with the window's background. Once again, this requires costly readbacks from memory that are particularly painful during a scroll or a fling when drawing happens dozen of times per second. To improve drawing performance during scrolling operations, the Android framework reuses the cache color hint. When this hint is set, the framework copies each child of the list in aBitmapfilled with the hint value (this assumes that another optimization, calledscrolling cache, is not turned off.)ListViewthen blits these bitmaps directly on screen and because these bitmaps are known to be opaque, no blending is required. And since the default cache color hint is#191919, you get a dark background behind each item during a scroll.

To fix this issue, all you have to do is either disable the cache color hint optimization, if you use a non-solid color background, or set the hint to the appropriate solid color value. This can be domefrom codeor preferably from XML, by using theandroid:cacheColorHintattribute. To disable the optimization, simply use the transparent color#00000000. The following screenshot shows a list withandroid:cacheColorHint="#00000000"set in the XML layout file:

Fade on a custom background

As you can see, the fade works perfectly against the custom wooden background. I find the cache color hint feature interesting because it shows how optimizations can make developers' life more difficult in some situations. In this particular case, however, the benefit of the default behavior outweighs the added complexity for the developer.

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics