Android 仿京东、拼多多商品分类页的示例代码

Android 仿京东、拼多多商品分类页的示例代码,第1张

概述最近接了一个项目,要仿照京东写一个商品分类页,但需要滑动右边子分类,左边的主分类也跟着变换,写了个demo,需要的同学可以自取。

最近接了一个项目,要仿照京东写一个商品分类页,但需要滑动右边子分类,左边的主分类也跟着变换,写了个demo,需要的同学可以自取。

先放一个写完之后的样子:

写这个需求的思路也很清晰,首先左边肯定是一个ListVIEw,右边也是一个ListVIEw,这两个ListVIEw要达到一个联动的效果。右边的ListVIEw再嵌套一个GrIDVIEw即可。如下图所示。

所以,我们需要的数据结构也就确定了,应该是数组套数组,也就说护肤大分类下又有子分类商品,类似于这个样子:


ok,数据和UI结构确定了,就可以编写代码

1、先确定主体结构,即两个ListVIEw

先不用管上面那个Hello World,那块儿只是想做一个吸顶的效果

2、将左侧数据和右侧数据分别渲染

2.1渲染左侧数据,即:

menuAdapter = new MenuAdapter(this,menuList);lv_menu.setAdapter(menuAdapter);

很简单就不赘述了,底部会附上完整代码链接

2.2渲染右侧数据

 homeAdapter = new HomeAdapter(this,homeList); lv_home.setAdapter(homeAdapter);

在HomeAdapter还需要在嵌套grIDVIEw,如下:

 @OverrIDe  public VIEw getVIEw(int position,VIEw convertVIEw,VIEwGroup parent) {    categoryBean.DataBean dataBean = foodDatas.get(position);    List<categoryBean.DataBean.DataListBean> dataList = dataBean.getDataList();    VIEwHold vIEwHold = null;    if (convertVIEw == null) {      convertVIEw = VIEw.inflate(context,R.layout.item_home,null);      vIEwHold = new VIEwHold();      vIEwHold.grIDVIEw = (GrIDVIEwForScrollVIEw) convertVIEw.findVIEwByID(R.ID.grIDVIEw);      vIEwHold.blank = (TextVIEw) convertVIEw.findVIEwByID(R.ID.blank);      convertVIEw.setTag(vIEwHold);    } else {      vIEwHold = (VIEwHold) convertVIEw.getTag();    }    HomeItemAdapter adapter = new HomeItemAdapter(context,dataList);    vIEwHold.blank.setText(dataBean.getModuleTitle());    vIEwHold.grIDVIEw.setAdapter(adapter);    return convertVIEw;  }  private static class VIEwHold {    private GrIDVIEwForScrollVIEw grIDVIEw;    private TextVIEw blank;  }

这里需要说明两点,第一:由于ListVIEw嵌套grIDVIEw会有众所周知的问题,计算高度,所以这边需要重新测量高度,也就重写了grIDVIEw;第二:代码中的textVIEw是每个子标题中主标题的名字,也就是需要吸在顶部的。

以上,就将数据已经可以渲染完成了,现在就是联动的问题

3、让两部分数据动起来

3.1 主数据联动子数据

只需要调用主数据的onItemClick()方法,右侧数据在复写方法中调用setSelection()方法即可

 lv_menu.setonItemClickListener(new AdapterVIEw.OnItemClickListener() {      @OverrIDe      public voID onItemClick(AdapterVIEw<?> parent,VIEw vIEw,int position,long ID) {        menuAdapter.setSelectItem(position);        menuAdapter.notifyDataSetInvalIDated();        tv_Title.setText(menuList.get(position));        lv_home.setSelection(showTitle.get(position));      }    });

3.2 子数据联动主数据

在onScroll中处理数据即可,在将主数据的adapter更新一下即可。如代码所示

lv_home.setonScrollListener(new AbsListVIEw.OnScrollListener() {      private int scrollState;      @OverrIDe      public voID onScrollStateChanged(AbsListVIEw vIEw,int scrollState) {        this.scrollState = scrollState;      }      @OverrIDe      public voID onScroll(AbsListVIEw vIEw,int firstVisibleItem,int visibleItemCount,int totalitemCount) {        if (scrollState == AbsListVIEw.OnScrollListener.SCRolL_STATE_IDLE) {          return;        }        int current = showTitle.indexOf(firstVisibleItem);        if (currentItem != current && current >= 0) {          currentItem = current;          tv_Title.setText(menuList.get(currentItem));          menuAdapter.setSelectItem(currentItem);          menuAdapter.notifyDataSetInvalIDated();        }      }    });

4、吸顶效果

这边有几种方法都可以实现类似的效果,我这边是上面一直有一条,我再将子数据都加一个type,当type不同时,更换上面那一条的问题即可。

最后,附上git链接直达链接

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程小技巧。

总结

以上是内存溢出为你收集整理的Android 仿京东、拼多多商品分类页的示例代码全部内容,希望文章能够帮你解决Android 仿京东、拼多多商品分类页的示例代码所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1144836.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-31
下一篇 2022-05-31

发表评论

登录后才能评论

评论列表(0条)

保存