ListView的多种ViewType

本篇博客一没引语,二没铺垫,直入主题。
先说需求,接着看图,然后上代码。
需求:1.列表的不同行布局样式 2.列表添加头布局

看图:数据自行脑补。
这里写图片描述

先说列表部分:利用RecyclerView和ListView都可以完成,但是关于头布局的部分RecyclerView就需要处理很多,目前也没有发现一个比较好的方案,因此我选择的是ListView。
ListView有几个方法是用来设置头布局,尾布局的。

关于不同行布局的处理,ListView的BaseAdapter中同样提供了一系列的方法

**getViewTypeCount();方法:返回列表行布局形式的个数。
也就是返回列表的行布局有几种样式**

getItemViewType(int position);方法:根据position返回该行布局的type

方法都查找完成,下面上代码。

1.写适配器:在适配器中设计了3中不同类型的行布局,分别是3张图片,2张图片2个文字,1张图片2个文字,通过getItemViewType和getViewTypeCount方法完成不同type的Item的设置。

public class ListAdapter extends BaseAdapter {

    private List<ListBean> datas;
    private Context context;
    private LayoutInflater inflater;
    private static final int TYPE_ALL = 0;// 2图2字
    private static final int TYPE_ONE_IMG = 1;// 1图2字
    private static final int TYPE_THREE_IMG = 2;// 3图

    public ListAdapter(Context context) {
        this.context = context;
        inflater = LayoutInflater.from(context);
    }

    public void setDatas(List<ListBean> datas) {
        this.datas = datas;
        notifyDataSetChanged();
    }

    private boolean ifHasData() {
        return datas.size() > 0 && datas != null;
    }

    @Override
    public int getCount() {
        return ifHasData() ? datas.size() : 0;
    }

    @Override
    public ListBean getItem(int position) {
        return ifHasData() ? datas.get(position) : null;
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    /**
     * 根据position位置获取数据集合的数据
     * 返回行布局类型
     */
    @Override
    public int getItemViewType(int position) {
        String type = datas.get(position).getType();
        if ("0".equals(type)) {// 2张图2字
            return TYPE_ALL;
        } else if ("1".equals(type)) {// 1张图2字
            return TYPE_ONE_IMG;
        } else {
            return TYPE_THREE_IMG;// 3张图
        }
    }

    /**
     * 行布局类型总数
     */
    @Override
    public int getViewTypeCount() {
        return 3;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        AllHolder allHolder = null;
        OneImgHolder oneImgHolder = null;
        ThreeImgHolder threeImgHolder = null;
        int type = getItemViewType(position);

        // 加载行布局+缓存行布局组件
        if (convertView == null) {
            switch (type) {
                case TYPE_ALL:
                    convertView = inflater.inflate(R.layout.item_all, parent, false);
                    allHolder = new AllHolder(convertView);
                    convertView.setTag(allHolder);
                    break;
                case TYPE_ONE_IMG:
                    convertView = inflater.inflate(R.layout.item_one_img, parent, false);
                    oneImgHolder = new OneImgHolder(convertView);
                    convertView.setTag(oneImgHolder);
                    break;
                case TYPE_THREE_IMG:
                    convertView = inflater.inflate(R.layout.item_three_imgs, parent, false);
                    threeImgHolder = new ThreeImgHolder(convertView);
                    convertView.setTag(threeImgHolder);
                    break;
            }
        } else {
            switch (type) {
                case TYPE_ALL:
                    allHolder = (AllHolder) convertView.getTag();
                    break;
                case TYPE_ONE_IMG:
                    oneImgHolder = (OneImgHolder) convertView.getTag();
                    break;
                case TYPE_THREE_IMG:
                    threeImgHolder = (ThreeImgHolder) convertView.getTag();
                    break;
            }
        }

        // 设置行布局组件内容
        ListBean listBean = getItem(position);
        switch (type) {
            case TYPE_ALL:
                allHolder.titleTv.setText(listBean.getTitle());
                allHolder.contentTv.setText(listBean.getContent());
                allHolder.iv1.setImageResource(listBean.getImg1());
                allHolder.iv2.setImageResource(listBean.getImg2());
                break;
            case TYPE_ONE_IMG:
                oneImgHolder.titleTv.setText(listBean.getTitle());
                oneImgHolder.contentTv.setText(listBean.getContent());
                oneImgHolder.iv.setImageResource(listBean.getImg1());
                break;
            case TYPE_THREE_IMG:
                threeImgHolder.iv1.setImageResource(listBean.getImg1());
                threeImgHolder.iv2.setImageResource(listBean.getImg2());
                threeImgHolder.iv3.setImageResource(listBean.getImg3());
                break;
        }
        return convertView;
    }

    class AllHolder {
        TextView titleTv, contentTv;
        ImageView iv1, iv2;

        public AllHolder(View view) {
            super();
            titleTv = (TextView) view.findViewById(R.id.item_all_title_tv);
            contentTv = (TextView) view.findViewById(R.id.item_all_content_tv);
            iv1 = (ImageView) view.findViewById(R.id.item_all_iv_1);
            iv2 = (ImageView) view.findViewById(R.id.item_all_iv_2);
        }


    }

    class OneImgHolder {
        ImageView iv;
        TextView titleTv, contentTv;

        public OneImgHolder(View view) {
            super();
            titleTv = (TextView) view.findViewById(R.id.item_one_img_title);
            contentTv = (TextView) view.findViewById(R.id.item_one_img_content);
            iv = (ImageView) view.findViewById(R.id.item_one_img_iv);
        }
    }

    class ThreeImgHolder {
        ImageView iv1, iv2, iv3;

        public ThreeImgHolder(View view) {
            super();
            iv1 = (ImageView) view.findViewById(R.id.item_three_iv1);
            iv2 = (ImageView) view.findViewById(R.id.item_three_iv2);
            iv3 = (ImageView) view.findViewById(R.id.item_three_iv3);
        }
    }
}

2.数据类

public class ListBean {

    private String title;// 标题
    private String content; // 内容
    private int img1;
    private int img2;
    private int img3;
    private String type;

    public ListBean() {
    }

    // 三张图片
    public ListBean(int img1, int img2, int img3, String type) {
        this.img1 = img1;
        this.img2 = img2;
        this.img3 = img3;
        this.type = type;
    }

    // 一张图片2字
    public ListBean(String title, String content, int img1, String type) {
        this.title = title;
        this.content = content;
        this.img1 = img1;
        this.type = type;
    }

    // all
    public ListBean(String title, String content, int img1, int img2, String type) {
        this.title = title;
        this.content = content;
        this.img1 = img1;
        this.img2 = img2;
        this.type = type;
    }

    public String getTitle() {
        return title;
    }

    public void setTitle(String title) {
        this.title = title;
    }

    public String getContent() {
        return content;
    }

    public void setContent(String content) {
        this.content = content;
    }

    public int getImg1() {
        return img1;
    }

    public void setImg1(int img1) {
        this.img1 = img1;
    }

    public int getImg2() {
        return img2;
    }

    public void setImg2(int img2) {
        this.img2 = img2;
    }

    public String getType() {
        return type;
    }

    public void setType(String type) {
        this.type = type;
    }

    public int getImg3() {
        return img3;
    }

    public void setImg3(int img3) {
        this.img3 = img3;
    }
}

3.数据和适配器都准备完毕,现在要到Activity中配置数据了,我这里采用的是自己构造数据的方式,看官们可以根据自己的数据来调整。

public class MainActivity extends AppCompatActivity {

    private ListView listView;
    private ListAdapter listAdapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        listView = (ListView) findViewById(R.id.main_aty_list_view);

        List<ListBean> datas = buildLocalDatas();
        listAdapter = new ListAdapter(this);
        listAdapter.setDatas(datas);
        listView.setAdapter(listAdapter);

    }

    private List<ListBean> buildLocalDatas() {
        List<ListBean> beans = new ArrayList<>();
        beans.add(new ListBean(R.mipmap.ic_launcher, R.mipmap.ic_launcher, R.mipmap.ic_launcher, "2"));
        beans.add(new ListBean("测试", "内容", R.mipmap.ic_launcher, R.mipmap.ic_launcher, "0"));
        beans.add(new ListBean("测试", "内容", R.mipmap.ic_launcher, R.mipmap.ic_launcher, "0"));
        beans.add(new ListBean("测试", "内容", R.mipmap.ic_launcher, "1"));
        beans.add(new ListBean("测试", "内容", R.mipmap.ic_launcher, R.mipmap.ic_launcher, "0"));
        beans.add(new ListBean("测试", "内容", R.mipmap.ic_launcher, R.mipmap.ic_launcher, "0"));
        beans.add(new ListBean("测试", "内容", R.mipmap.ic_launcher, "1"));
        return beans;
    }
}

到这,数据设置完毕,运行之后可以发现ListView也能实现多种ViewType的

下面来示范一下如何设置HeaderView,非常简单。加载出一个View设置即可

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        listView = (ListView) findViewById(R.id.main_aty_list_view);

        List<ListBean> datas = buildLocalDatas();
        listAdapter = new ListAdapter(this);
        listAdapter.setDatas(datas);
        listView.setAdapter(listAdapter);

        // 设置ListView的头布局
        View view = getLayoutInflater().inflate(R.layout.list_header, null);
        TextView headerTv = (TextView) view.findViewById(R.id.header_view_tv);
        headerTv.setText("这里可设置轮播图");
        listView.addHeaderView(view);

    }

此篇博客到此结束。
资源下载:http://download.csdn.net/detail/wubihang/9526349

  • 7
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 6
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值