美文网首页优秀案例
Android利用ListView实现多种Item的复杂布局

Android利用ListView实现多种Item的复杂布局

作者: cfanr | 来源:发表于2016-04-25 17:16 被阅读11220次

在Android开发中,可能会遇到一个可滚动且布局比较复杂的界面,但它并不是一个纯粹的List,类似如下图:

demo.png

通常实现方法可以直接用一个ScrollView将所有内容包起来,里面是列表的部分在代码中用动态添加布局的方式实现;或者外层ScrollView,里面列表部分用ListView(或RecyclerView)实现,但这样需要解决滑动冲突问题(有时并不能很好解决)……所以最好不要同时使用ScrollView和ListView(或RecyclerView),但如果单使用ScrollView,每次滑动返回时都会重新动态加载,如果页面图片比较多,可能会造成卡顿,所以要自己做缓存判断的处理,而ListView自带有缓存机制,处理相对比较方便。

那这种不是纯粹List的布局用ListView如何实现?它也并不是只是头尾部分不相同而已(ListView可以addHeader, addFooter), 所以要将它分成一个个不同类型的item。下面展示一个之前公司项目所实践用到的一个例子,效果demo如图:

ComplexListViewDemo.gif

嗯,其实也没什么难度,也就是如何将整个页面的划分为不同的item,并处理不同的数据模块,使代码更加模块化,直观而且更容易维护。其中HomeAdapter是处理List不同item的适配器,相对于普通适配器多了一个getItemViewType()方法的处理;ImageAdapter是图片轮播适配器;HomeItem是整个页面的数据模型,包含了所有item的不同数据模型,接收到网络数据时需要对数据加工再设置到HomeItem,然后根据ItemType 作为不同item类型的判断,再根据不同item获取对应的字段;各个item的数据处理是在单独一个ViewHolder上处理……

class HomeItem{
  private ItemType itemType; //作为不同item类型的判断
  private String tagName;
  private Special special;
  private Ad ad;
  private MenuPo[] menuPos;
  private List<MealShow> mealShowList;
  private List<TalentShow> talentShowList;
//……
}

另外,可以看到当上滑时,搜索框会悬停在顶部,此处用到一个小技巧,障眼法,单独的搜索框一直在顶部,通过在滑动的过程中控制它的显示和隐藏即可

mListView.setOnScrollListener(new AbsListView.OnScrollListener(){

  @Override
  public void onScrollStateChanged(AbsListView absListView, int i){
  }
  @Override

  public void onScroll(AbsListView absListView, int firstVisibleItem,int visibleItemCount, int totalItemCount) {
    if (firstVisibleItem >= 1) {
      rlSearchBar.setVisibility(View.VISIBLE);
    } else {
    rlSearchBar.setVisibility(View.GONE);
    }
  }
});

Talk is cheap, read the code.

Github: ComplexListViewDemo

相关文章

网友评论

  • 0a5faa7ab7ab:您好 这种方式我遇到一个问题 就是当ListView频繁上下滑动的时候 顶部viewpager有时候会暂停轮播 需要手动滑动一下 才可以继续轮播 还有就是ListView快速上下滑动时候顶部ViewPager有时候虽然不会停止轮播 但是下次播放时候 没有了滑动动画效果 直接切换
    cfanr:demo 上的 ViewPager 轮播有个暂停轮播的逻辑,你看看有没有写错,在停止滑动时,有没有恢复轮播;或者自己写个 log 日志,看看代码逻辑上什么时候执行了暂停轮播
  • d138ef00f879:mListView=$(R.id.lv_home_list);
    这个$是插件么?
    cfanr:@d138ef00f879 呃,就一个封装的方法呀 :joy:
    private <T extends View> T $(int resId) {
    return (T) super.findViewById(resId);
    }
  • rabbitknight:纳兹咪23333
  • StandByMeSun:很好,感谢
  • 2e23e347fae0:好的 谢谢
  • 2e23e347fae0:除了complexviewdemo其他文件都是做什么用哒 :grin:
    cfanr:@海王子铁蛋 是其他项目的,有一个是设计模式相关的,其他的暂时还没有内容
  • 2e23e347fae0:哥么 这样的话服务器那边给数据你是什么方案啊 :grin:
    2e23e347fae0:@cfanr 哦哦 是的 你演示的类型有点多 所以我有点蒙圈 确实肯定要一个接口来完成的
    cfanr:@海王子铁蛋 每个模块的数据是一个model,最好只用一个接口给,之后再根据不同类型加工处理这些数据,如例子中,HomeItem是加工过的model,你看下代码就知道了
  • ac83b22f4351:怎么下载不了呢,不是可以克隆和下载吗,你这个没有下载的链接呢
    cfanr:@zhiweinitingliu 这只是项目中的某个文件夹,你可以整个项目下载下来或用svn下载特定文件夹,http://www.zhihu.com/question/25369412
  • Vivi成长吧:不能下载么?
    Vivi成长吧:@軍哥稀飯兒 谢谢啦
    cfanr:@拼命七娘 你是想下载单个文件夹,是吧?可以看下这个链接的方法,http://www.zhihu.com/question/25369412

本文标题:Android利用ListView实现多种Item的复杂布局

本文链接:https://www.haomeiwen.com/subject/pvzshttx.html