Android ListView 滑动背景为黑色的解决办法_android ,滑动时背景闪烁黑色。-程序员宅基地

技术标签: cache  performance  optimization  listview  android  list  Android  

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

在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

 

 

 

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

One of the most common issues with ListView happens when you try to use a custom background. By default, like many Android widgets, ListView has a transparent background which means yo can see through the default window's background, a very dark gray (#FF191919 with the current dark theme.) Additionally, ListView enables the fading edges by 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 of Canvas.saveLayerAlpha() and the Porter-Duff Destination Out blending mode. This technique is similar to the one explained in Filthy Rich Clients and various presentations. Unfortunately, things start to get ugly when you try to use a custom background on the ListView or 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 fade Dark 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 on GridView.) 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.)

Since ListView is 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 class View) knows it will draw on a solid background and therefore replaces th expensive saveLayerAlpha()/Porter-Duff rendering 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, ListView has a transparent/translucent background by default, and so all default Android widgets. This implies that when ListView redraws 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 a Bitmap filled with the hint value (this assumes that another optimization, called scrolling cache, is not turned off.) ListView then 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 dome from code or preferably from XML, by using the android:cacheColorHint attribute. To disable the optimization, simply use the transparent color #00000000. The following screenshot shows a list with android: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.

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/offbye/article/details/6727449

智能推荐

幼儿园教案我和计算机比本领,比本领幼儿园教案-程序员宅基地

文章浏览阅读141次。新编童话故事比本领 从前,在一片大森林里,住着一只小巧玲珑、聪明伶俐的金丝猴,还住着大象伯伯。大象伯伯很有学问,是个有名的博士,大家都很尊敬它。一天,金丝猴唱了一支歌:“我是森林里最聪明的动物,我是这里的大博士!”小牛哥哥听了说:“哈!你这小家伙,想当大博士?”“异想天开”小羊...比本领正文:比本领安徽省蚌埠市凤阳路第一小学 二(2)班 董一格牙齿三兄弟在一起互相帮助,生活得很愉快。有一天他们为..._电脑本领大幼儿园教案

计算机主机后面的usb哪个不可接入,电脑无法连接U盘,USB接口被禁用怎么办?教你处理方法...-程序员宅基地

文章浏览阅读4.3k次。热搜数码2020-07-03 10:34:04我们在办公室或网吧其它公共场所使用电脑时,有的时候会发现,电脑主机的USB接口不能正常使用,U盘插入后没有反应。其实这主要是电脑主机USB接口被禁用了,我们可以在“通用串行总线控制器”把禁止的USB接口设置开启即可正常使用。下面小编具体说下处理方法:1、开启电脑主机,进入系统界面,在“我的电脑”界面,鼠标右击选择“管理”;2、在系统弹出来的“计算机管理..._黑群晖电脑后面的usb都不能插upan

vue2老项目webpack3升级webpack5教程-程序员宅基地

文章浏览阅读1.1w次,点赞4次,收藏15次。说明webpack5相对于webpack3有着各方面的提升,尤其是tree shaking功能更加强大,所以对老项目vue2.0+webpack3,尝试升级到webpack5,总结了升级过程中可能会遇到的问题,大部分内容出自如下文章中:vue-cli2 老项目webpack3升级webpack5过程总结_娃哈哈_的博客-程序员宅基地_webpack升级,补充一些遇到的其他问题。升级步骤1.拷贝除依赖外的项目文件到新文件夹中避免在原项目上操作,拷贝完后执行npm install安装依赖。2_webpack3升级webpack5

php匿名函数_php 匿函数-程序员宅基地

文章浏览阅读173次。PHP匿名函数和闭包使用的句法与普通函数相同,但匿名函和闭包数其实是伪装成函数的对象.匿名函数:就是没有名称的函数.匿名函数可以赋值给变量,对象传递.不过匿名函数仍是函数,因此可以调用,还可以传入参数.匿名函数特别适合作为函数或方法的回调.闭包:是指在创建时封装周围状态的函数.即使闭包所在的环境不存在了,闭包中封装的状态依然存在.注意:理论上讲,闭包和匿名函数是不同的概念. 不过,PH..._php 匿函数

android导入项目模拟器运行不了,无法运行Android模拟器(Unable to run Android Emulator)...-程序员宅基地

文章浏览阅读2.9k次。无法运行Android模拟器(Unable to run Android Emulator)我在Visual Studio 2013中有一个Xamarin.Forms项目,当我尝试运行我的Android应用程序时,模拟器会加载,但是它不会加载应用程序,并且会发生不同的错误。当我尝试运行Android模拟器时,取决于我选择的设置,它会弹出DWP handshake failed或者在它显示的调试输出..._android 无法运行导模拟器

Linux安装JDK及环境变量配置_linuxfuwulijava命令,必须先安装jdk或jre并配置环境变量-程序员宅基地

文章浏览阅读1w次。从0搭建Vue+SpringCloud项目02环境配置安装JDK1.8设置环境变量环境配置安装JDK1.8通过命令直接安装:yum install -y java-1.8.0-openjdk-devel.x86_64通过命令:which java 查看jdk的安装地址命令:vim /etc/profile_linuxfuwulijava命令,必须先安装jdk或jre并配置环境变量

随便推点

postgresql gin索引使用-程序员宅基地

文章浏览阅读888次。由于属于老项目,postgresql使用版本9.6,主要解决‘%name%"查询无法使用索引问题。pg_trgm模块提供函数和操作符测定字母,数字,文本基于三元模型匹配的相似性, 还有支持快速搜索相似字符串的索引操作符类。1. 增加pg_trgm拓展CREATE EXTENSION pg_trgm;2. 采用pg_trgm 建立gin索引CREATE INDEX..._gin_trgm_ops

用js编写一个实现把字符串转换成json对象的方法。_easyui 将字符串转成对象的3种方法-程序员宅基地

文章浏览阅读409次。作者: 不要脸的死宅男&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;本人是一名正在培训机构培训前端的新人,因为最近课程不是很紧,于是闲着无聊便想着写这么一个东西。写这个的起因是因为自学XMLHttpRequest的时候,想要学jquery来把ajax进行简单的封装,然后进行返回数据处理编写的时候,因为对js如何将字符串转换成对象这里比较感兴趣,想要去查看一下源码,才..._easyui 将字符串转成对象的3种方法

mysql报错:In aggregated query without GROUP BY_in aggregated query without group by 数据库执行不报错,程序执行-程序员宅基地

文章浏览阅读1.4k次。【现象】Caused by: com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException: In aggregated query without GROUP BY, expression #1 of SELECT list contains nonaggregated column 'zjdx.sentiment_detail_res..._in aggregated query without group by 数据库执行不报错,程序执行报错

Delphi中Indy 10的安装和老版本的卸载_indy10 dll下载地址-程序员宅基地

文章浏览阅读4.1k次。Indy 10的安装和老版本的卸载Indy 10下载地址:http://www.indyproject.org/downloads/10/indy10.0.52_source.zipIndy 10 安装步骤1、解压压缩包。 2、打开\System\IndySystem70.dpk,点Compile。 3、打开\Core\IndyCore70.dpk,点Com_indy10 dll下载地址

小分子php蛋白,小分子-蛋白相互作用关系——简单的docking介绍-程序员宅基地

文章浏览阅读682次。前两天,老板突然QQ发了我一张截图附言“糖苷类化合物涉及水解和二相代谢,原型成分很少”,然后我立马回“好的~我来关注一下,我之前看文章的时候注意到了,在中药给药到细胞的时候,是先给鼠吃药后取其血,以药物血清的形式给药,作用于细胞”,后来老板当面提点我“你研究一下小分子和蛋白binding吧”。呵呵,我。。日常误解老板的话。。我已经习惯了。研究小分子跟蛋白的相互作用方法:平衡透析法?好像针对的是血浆..._蛋白与小分子互作关系分析

weex error NpmPackage.js:50_error loading image for billboard: [object event]-程序员宅基地

文章浏览阅读448次。npm\node_modules\weex-toolkit\node_modules\[email protected]@xtoolkit\src\package\NpmPackage.js:50在使用weex过程中,使用淘宝镜像安装出现如上的错误,可以确定是镜像的问题,解决方法:1、手动卸载cnpm 与 weex-toolkit(mac 目录:/usr/local/lib_error loading image for billboard: [object event]