最近的一个新需求,简单描述下吧:

需求:

  

目标样式如图所示,我们需要根据需求动态添加网关和设备。

目标有了下面就是怎么实现了。首先我们选用的是RecycleView

那么主要目标就成了 在recycleView下如何实现多布局(我们看到网关和设备的布局不同)

首先写两个布局(一个网关 , 一个设备)

网关布局样式:

设备布局样式:

这些都比较简单,在这里就不赘述。

RecycleView的基本用法:

  1)引入包

  2)在布局中使用控件

  3)在activity中绑定并使用recycleView

  4)自定义recycleView的适配器

这些在我之前的博客有介绍,本篇主要说明多布局应当如何来写

适配器:

先上代码:

package com.wbnq.ryadie.utils;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.RecyclerView.ViewHolder;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Toast; import com.wbnq.ryadie.R;
import com.wbnq.ryadie.utils.SBViewHolder;
import com.wbnq.ryadie.utils.SBitem;
import com.wbnq.ryadie.utils.WGViewHolder;
import com.wbnq.ryadie.utils.WGitem; import java.util.ArrayList;
import java.util.List; /**
* Created by guwei on 16-10-22.
*/
public class RecAdapter extends RecyclerView.Adapter<ViewHolder> { //设置类型标志
private static final int TYPE_WG = 0x00;
private static final int TYPE_SB = 0x01; private LayoutInflater inflater;
private Context mContext;
private List<Object> mData; boolean isopen = false; public RecAdapter(Context context, List<Object> mdata) {
this.mContext = context;
this.mData = mdata;
inflater = LayoutInflater.from(context);
} //获取数据类型 方便分类
@Override
public int getItemViewType(int position) {
if (mData.get(position) instanceof WGitem) {
return TYPE_WG;
} else if (mData.get(position) instanceof SBitem) {
return TYPE_SB;
} else {
return super.getItemViewType(position);
}
} @Override
public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) { View view = null;
ViewHolder viewHolder = null;
switch (viewType) {
case TYPE_WG:
view = inflater.inflate(R.layout.wglist_item, parent, false);
viewHolder = new WGViewHolder(view);
break; case TYPE_SB:
view = inflater.inflate(R.layout.sblist_item, parent, false);
viewHolder = new SBViewHolder(view);
break;
}
return viewHolder;
} @Override
public void onBindViewHolder(final ViewHolder holder, final int position) { switch (getItemViewType(position)) { //网关 操作
case TYPE_WG:
final WGViewHolder wgholder = (WGViewHolder) holder;
WGitem wgbean = (WGitem) mData.get(position);
wgholder.title.setText(wgbean.mTitle);
wgholder.date.setText(wgbean.mDate); //定义可重载 监听方法
wgholder.history.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
Toast.makeText(mContext, "历史记录", Toast.LENGTH_SHORT).show();
}
}); //开关监听
wgholder.image_zykg.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (isopen) {
wgholder.image_zykg.setImageResource(R.mipmap.ryicon_guan);
isopen = !isopen;
} else {
wgholder.image_zykg.setImageResource(R.mipmap.ryicon_kai);
isopen = !isopen;
} }
}); break; // 设备 操作
case TYPE_SB:
final SBViewHolder sbholder = (SBViewHolder) holder;
SBitem sbitem = (SBitem) mData.get(position); sbholder.rongyang.setText(sbitem.mRongyang);
sbholder.wendu.setText(sbitem.mWendu);
sbholder.dianya.setText(sbitem.mDianya); sbholder.pb_rongyang.setProgress(Integer.valueOf(sbitem.mRongyang));
sbholder.pb_wendu.setProgress(Integer.valueOf(sbitem.mWendu));
sbholder.pb_dianya.setProgress(Integer.valueOf(sbitem.mDianya)); break;
} if (onItemClieckLinster != null) { //onitemlongclicklistener
holder.itemView.setOnLongClickListener(new View.OnLongClickListener() {
@Override
public boolean onLongClick(View view) {
onItemClieckLinster.onItemLongClickListener(holder.itemView, position);
return false;
}
});
} } //新增item
public void addData(int pos , int type) {
switch (type){
case TYPE_WG:
mData.add(new WGitem("date" , "新增item"));
notifyItemInserted(pos);
break; case TYPE_SB:
mData.add(pos , new SBitem("0","0","0"));
notifyDataSetChanged();
break;
} } //移除item
public void deleateData(int pos) {
mData.remove(pos);
notifyItemRemoved(pos);
}
//item 点击/长按 监听
public interface OnItemClieckLinster {
// void onItemClickListener(View view, int pos); void onItemLongClickListener(View view, int pos);
} private OnItemClieckLinster onItemClieckLinster; public void setOnItemClieckLinster(OnItemClieckLinster listener) { this.onItemClieckLinster = listener;
} @Override
public int getItemCount() {
return mData.size();
}
}

该代码参考listview的多布局实现

首先我们自定义的适配器需要继承 RecyclerView.Adapter<ViewHolder>

主要的重载方法为:

//获取数据类型 方便分类
@Override
public int getItemViewType(int position) {
if (mData.get(position) instanceof WGitem) {
return TYPE_WG;
} else if (mData.get(position) instanceof SBitem) {
return TYPE_SB;
} else {
return super.getItemViewType(position);
}
}

这个方法为后面的 onCreateViewHolder和onBindViewHolder 提供item类型

来方便加载不同的布局。

该方法中的WGitem 和 SBitem为我们自定义的bean包含对应item布局的相关参数

比如:

SBitem:

public class SBitem {

    public String mRongyang;
public String mWendu;
public String mDianya; public SBitem(String rongyang, String wendu, String dianya) {
this.mRongyang = rongyang;
this.mWendu = wendu;
this.mDianya = dianya;
}
}

这个bean中包含的就是设备布局中所有的参数(请忽略参数类型...)

接下来就是 onCreateViewHolder和onBindViewHolder 这两个方法

根据获取的类型来进行不同的绑定和操作

在onBindViewHolder中在确定类型后的第一个操作是:

//网关 操作
case TYPE_WG:
final WGViewHolder wgholder = (WGViewHolder) holder;
WGitem wgbean = (WGitem) mData.get(position);
wgholder.title.setText(wgbean.mTitle);
wgholder.date.setText(wgbean.mDate); // 设备 操作
case TYPE_SB:
final SBViewHolder sbholder = (SBViewHolder) holder;
SBitem sbitem = (SBitem) mData.get(position); sbholder.rongyang.setText(sbitem.mRongyang);
sbholder.wendu.setText(sbitem.mWendu);
sbholder.dianya.setText(sbitem.mDianya);

因为 onBindViewHolder获取到的holder 并不针对网关类型 或者设备类型所以要对该holder进行一个类型转换

@Override
public void onBindViewHolder(final ViewHolder holder, final int position)

当然啦你要先写好这两个ViewHolder:

例如 SBViewHolder:

package com.wbnq.ryadie.utils;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ProgressBar;
import android.widget.TextView; import com.wbnq.ryadie.R;
import com.wbnq.ryadie.utils.SBitem;
import com.wbnq.ryadie.utils.WGitem; import java.util.List; /**
* Created by guwei on 16-10-21.
*/
public class SBViewHolder extends RecyclerView.ViewHolder { public TextView rongyang, wendu, dianya;
public ProgressBar pb_rongyang, pb_wendu, pb_dianya; public SBViewHolder(View itemView) {
super(itemView); rongyang = (TextView) itemView.findViewById(R.id.sblist_text_ry);
wendu = (TextView) itemView.findViewById(R.id.sblist_text_wd);
dianya = (TextView) itemView.findViewById(R.id.sblist_text_dy); pb_rongyang = (ProgressBar) itemView.findViewById(R.id.progressBar_rongyang);
pb_wendu = (ProgressBar) itemView.findViewById(R.id.progressBar_wendu);
pb_dianya = (ProgressBar) itemView.findViewById(R.id.progressBar_dianchi); }
}

viewholder的作用我之前的博客也有介绍有兴趣可以去看下。只不过我现在把它单独取出来写在一个文件中而已:

需要用到的其他文件就是这些了。

还有一个比较重要的方法就是添加删除设备的问题了

这里就体现RecycleView的好用了,新增和删除非常简单,不过还是要根据类型来。

 //新增item
public void addData(int pos , int type) {
switch (type){
case TYPE_WG:
mData.add(new WGitem("date" , "新增item"));
notifyItemInserted(pos);
break; case TYPE_SB:
mData.add(pos , new SBitem("0","0","0"));
notifyDataSetChanged();
break;
} } //移除item
public void deleateData(int pos) {
mData.remove(pos);
notifyItemRemoved(pos);
}

用法很简单:

两个参数:

  第一个 需要放置的位置

  第二个 添加的类型(网关/设备)

移除同理,不过不需要类型只传位置就好~

下面大家自己去研究下代码吧。

RecycleView 实现多布局的更多相关文章

  1. Recycleview实现复杂布局

    Recycleview实现复杂布局 首先 附上Demo链接和效果供大家参考 Demo 实现思路 代码思考 时间是一切财富中最宝贵的财富. -- 德奥弗拉斯多 <a 实现思路 开始看到设计稿子的时 ...

  2. 手把手教你给RecycleView添加头布局和尾布局

    RecycleView想必大家都不陌生,它已他的高拓展性取代了传统布局显示,同时配合协调布局,可以实现很多意想不到的酷炫交互,今天就和大家介绍一下,如何给RecycleView添加头布局和尾布局,同时 ...

  3. RecycleView实现多布局可展开列表

    代码地址如下:http://www.demodashi.com/demo/13193.html 前言 在开发的时候,我们不免会遇到这么一种数据展示,该数据有以下特征: 数据要以列表形式展示 每条数据要 ...

  4. RecycleView文字吸顶,点击吸顶布局刷新数据

    实现效果 需求 Recycle有一个头布局,可以跟随列表进行滑动 点击头布局之后可以重新加载列表数据 随着头布局的消失,留下一个可点击的布局(该布局在头布局中) 效果类似下图: 淘宝的商品列表,随着我 ...

  5. RecycleView 滑动到底部,加载更多

    android.support.v7 包提供了一个新的组件:RecycleView,用以提供一个灵活的列表试图.显示大型数据集,它支持局部刷新.显示动画等功能,可以用来取代ListView与GridV ...

  6. RecycleView设置顶部分割线(记录一个坑)

    大家都知道,想给RecycleView设置分割线可以重写RecyclerView.ItemDecoration 项目过程中,遇到一个需求:RecycleView顶部有一条灰色的间隔,我想到了给Recy ...

  7. 【腾讯Bugly干货分享】跨平台 ListView 性能优化

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:https://mp.weixin.qq.com/s/FbiSLPxFdGqJ00WgpJ94yw 导语 精 ...

  8. Material Design入门

    本文主要包括以下内容 ToolBar的使用 RecyclerView的定义与使用 ToolBar 风格 (style) 界面 (layout) 程序 (java) 首先自定义一个theme,并将App ...

  9. 解决Scrollview 嵌套recyclerview不能显示,高度不正常的问题

    我们先看一个效果,问题说的就是中间的Grid效果在Scrollview 嵌套recyclerview显示问题,在Android Api 24是好的,不过在5,1,1版本(api 22)缺出现了问题 最 ...

随机推荐

  1. CLR via C# 摘要二:IL速记

    最简单的IL程序 .assembly test {} .method void Func() { .entrypoint ldstr "hello world" call void ...

  2. react-native的tabbar和navigator混合使用

    前段时间搭建项目使用了navigator和react-native-tab-navigator,现在我教大家搭建一个通用的简单框架. 先把几张图贴在这里,这就是我们今天要搭建的东西,别看页面简单,但是 ...

  3. Node学习笔记(四):gulp+express+io.socket部署angularJs2(填坑篇)

    这篇就先暂停下上篇博客--你画我猜的进度,因为在做这个游戏的时候,想采用最新的ng2技术,奈何坑是一片又一片,这边就先介绍下环境部署和填坑史 既然要用ng2,首先要拿到资源,我这边用的是angular ...

  4. php函数强大的 strtotime

    使用strtotime可以将各种格式的时间字符串转换为时间戳 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 转换常规时间格式 echo date('Y-m-d H:i: ...

  5. java多线程解读二(内存篇)

    线程的内存结构图 一.主内存与工作内存 1.Java内存模型的主要目标是定义程序中各个变量的访问规则.此处的变量与Java编程时所说的变量不一样,指包括了实例字段.静态字段和构成数组对象的元素,但是不 ...

  6. 手机端访问web调用数字键盘。

    转自  http://www.webkfa.com/one4/w1937.html 最近在做手机页面时,遇到数字输入的键盘的问题,之前的做法只是一刀切的使用 type="tel", ...

  7. Regular Express正则表达式基础

    一. 创建一个正则表达式RegExp,有两种方式如下图所示 二. 创建一个正则表达式RegExp详述说明 1.构造函数 //RegExp 是js中一个内置的对象,是正则表达式的缩写 var reg = ...

  8. jq制作圣诞主题页面

    今天制作的是有飘雪效果的圣诞主题页面,个人灰常喜欢. 首先还是放张效果图: 当看到这这页面的时候我们要注意四点: 1.图片的轮播 2.文字的滚动效果 3.音乐播放 4.飘雪效果 那我们就一点一点来完成 ...

  9. ZeroC Ice启用SSL通讯的配置

    Zeroc ICE ( Internet Communications Engine )中间件号称标准统一,开源,跨平台,跨语言,分布式,安全,服务透明,负载均衡,面向对象,性能优越,防火墙穿透,通讯 ...

  10. [Android]使用Dagger 2依赖注入 - 自定义Scope(翻译)

    以下内容为原创,欢迎转载,转载请注明 来自天天博客:http://www.cnblogs.com/tiantianbyconan/p/5095426.html 使用Dagger 2依赖注入 - 自定义 ...