Android 列表形式的切换的示例代码
程序员文章站
2023-12-20 08:10:52
电商项目中经常有这样的需求:在商品列表页面中,切换列表的展现形式,一般分为列表形式和表格形式。
如京东:
本文最终实现的效果:
关键词:recyclerv...
电商项目中经常有这样的需求:在商品列表页面中,切换列表的展现形式,一般分为列表形式和表格形式。
如京东:
本文最终实现的效果:
关键词:recyclerview
主布局文件:activity_main.xml
<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent"> <android.support.v7.widget.recyclerview android:id="@+id/recycler_view" android:layout_width="match_parent" android:layout_height="wrap_content" /> </linearlayout>
列表形式布局文件:item_list.xml
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="98dp" android:layout_margin="8dp" android:background="@color/coloraccent"> <textview android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textappearance="@style/textappearance.appcompat.large.inverse" android:layout_centerinparent="true" tools:text="1" /> </relativelayout>
表格形式布局文件:item_grid.xml
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="98dp" android:layout_margin="8dp" android:background="@color/coloraccent"> <textview android:id="@+id/text" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textappearance="@style/textappearance.appcompat.large" android:layout_centerinparent="true" tools:text="1" /> </relativelayout>
实现原理:使用 recyclerview 的 gridlayoutmanager,列表形式指定列数为1,表格形式指定列数为具体列值。
默认为列表形式,指定列数为1:
recyclerview = (recyclerview) findviewbyid(r.id.recycler_view); // 指定列数为1 gridlayoutmanager = new gridlayoutmanager(this, column_one); recyclerview.setlayoutmanager(gridlayoutmanager);
列表形式和表格形式之间的切换:
@override public boolean onoptionsitemselected(menuitem item) { int id = item.getitemid(); if (id == r.id.action_toggle) { if (gridlayoutmanager.getspancount() == column_one) { gridlayoutmanager.setspancount(column_three); item.seticon(contextcompat.getdrawable(this, r.drawable.ic_grid)); } else { gridlayoutmanager.setspancount(column_one); item.seticon(contextcompat.getdrawable(this, r.drawable.ic_list)); } simpleadapter.notifyitemrangechanged(0, simpleadapter.getitemcount()); return true; } return super.onoptionsitemselected(item); }
通过 gridlayoutmanager.setspancount(int cloumn) 设置列数,最后不要忘记 simpleadapter.notifyitemrangechanged(0, simpleadapter.getitemcount()) 刷新数据。
adapter的处理:
定义两种 view 类型:view_type_list 和 view_type_grid
根据不同的 view 类型加载相应的布局文件,如下:
@override public simpleviewholder oncreateviewholder(viewgroup parent, int viewtype) { view itemview; if (viewtype == view_type_list) { itemview = layoutinflater.from(parent.getcontext()) .inflate(r.layout.item_list, parent, false); } else { itemview = layoutinflater.from(parent.getcontext()) .inflate(r.layout.item_grid, parent, false); } return new simpleviewholder(itemview, viewtype); }
获取 view 类型:列数为1时,view 类型为 view_type_list,列数为3时, view类型为 view_type_grid
@override public int getitemviewtype(int position) { final int viewtype; int column = layoutmanager.getspancount(); switch (column) { case column_one: viewtype = view_type_list; break; case column_three: viewtype = view_type_grid; break; default: throw new runtimeexception("wtf?"); } return viewtype;
完整代码:
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。