Android列表页的错位问题探讨

前言

在日常的项目开发中，类似于下面的列表页一般是采用ListView或RecyclerView去实现，有时候会出现其条目上的图片或文字错位的情况，而解决错位的常用方法是为错位的控件设置标识数据，比如当点击时候再将其标识的数据取出进行操作，可以说"设置标识"的方法基本可以解决大多列表页中错位的情况。

1.jpg
2.jpg

上面 "设置标识" 的方法虽然可以解决大多数列表页错位的情况,但总有特殊情况. 前几天在项目开发中也遇到列表页错位的情况，主要是App里的通讯录的头像错位了，尝试"设置Tag"的方法却得不到解决，所以当遇到问题的时候就得针对所遇到的问题进行分析，找到发生该问题的原因，才能更好的找到解决的方法.下面将分析、问题缘由以及如何解决等步骤总结记录下.

Ⅰ.总结，才能更好的提升

分析：

通讯录列表页的头像发生错位是属于偶然性的，事出反常必有因，接连测试发现:" 当进入通讯录页面立即对列表页进行快速滑动，当滑动停下来的时候，图片错位就随之发生了 " .

缘由：

由于滑动过程中滑动的速度快于图片从网络加载的速度，而在适配器的getView方法里是使用条目复用的方式，对ListView进行性能优化. 如果是使用RecyclerView控件默认就带有复用的效果，还拥有持有控件的ViewHolder类.

假设从条目A快速滑动到条目H，再假设条目H是复用了条目A的，这时条目H对应的图片还未从网络加载完成，所以没法显示在图片控件上，所以显示的依旧是条目A的图片，而当我们滑动停下来的时候，条目H的图片就发生错位的现象.

解决：

由于项目中使用的是Picasso框架加载图片，该框架是有对图片错位做了处理的，那么也方便解决：

    //对ListView的滚动状态进行监听
    listView.setOnScrollListener(new AbsListView.OnScrollListener() {
            @Override
            public void onScrollStateChanged(AbsListView view, int scrollState) {
             
                switch(scrollState){//正常情况是 1===>2====>0
                    case AbsListView.OnScrollListener.SCROLL_STATE_IDLE :
                      
                        Picasso.with(Global.getContext()).resumeTag((Context)mActivity);
                        break;
                    case AbsListView.OnScrollListener.SCROLL_STATE_TOUCH_SCROLL:
                        Picasso.with(Global.getContext()).pauseTag((Context)mActivity);
                        break;
                }
            }
            @Override
            public void onScroll(AbsListView view, int firstVisibleItem, int visibleItemCount, int totalItemCount) {
            }
        });

    //在适配器的getView方法中对图片设置Tag
      Picasso.with(this.context).load(url).placeholder(R.drawable.photo)
                        .error(R.drawable.photo)
                        .tag(context)
                        .into(viewholder.iv_icon);

思路：

主要是在列表页滑动的时候取消对图片的加载，当列表页停止滑动的时候才进行加载图片，这样就可以避免图片错位的发生.

Ⅱ.总结

• 1.Picasso框架已经解决了列表页的图片加载错位的问题，只需要实现相应的api；
• 2.设置Tag的方式并不能解决上面滑动导致的错位问题，使其图片在列表页滑动时不加载，列表页停止时才加载的方式就可以解决错位问题；
• 3.根据之前解决列表页错位的思路总结，设置Tag的方式比较适合将数据绑定于控件上，在某个时段(比如点击事件时，通过控件取出数据)再取出来对其数据操作；
• 4.Glide框架更优于Picasso框架，还等待着前去探索；
• 5.明天周六，早起的鸟儿有虫吃，晚起的虫儿被鸟吃 ~~ Bye