码迷,mamicode.com
首页 > 移动开发 > 详细

android RecyclerView的瀑布流布局案例

时间:2019-08-25 15:39:43      阅读:1075      评论:0      收藏:0      [点我收藏+]

标签:toe   protected   瀑布流   layout   odi   mat   width   XML   null   

1、先创建 activity_water_fall.xml 和 activity_water_fall_item.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".WaterFallActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/rv3"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:layout_editor_absoluteX="207dp"
        tools:layout_editor_absoluteY="62dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    tools:context=".WaterFallItemActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/ivdesc"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:srcCompat="@drawable/p1" />
</androidx.constraintlayout.widget.ConstraintLayout>

2、创建Adapter

package com.example.myapplication;

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;

import androidx.annotation.NonNull;
import androidx.annotation.WorkerThread;
import androidx.recyclerview.widget.RecyclerView;

public class WaterFallAdapter extends RecyclerView.Adapter<WaterFallAdapter.WaterFallViewHolder> {
    private Context context;

    public WaterFallAdapter(Context context) {
        this.context = context;
    }
    @NonNull
    @Override
    public WaterFallAdapter.WaterFallViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        return new WaterFallViewHolder(LayoutInflater.from(context).inflate(R.layout.activity_water_fall_item,parent,false));
    }

    @Override
    public void onBindViewHolder(@NonNull WaterFallAdapter.WaterFallViewHolder holder, int position) {
        if(position %2==0) {
            holder.iv.setImageResource(R.drawable.p1);
        }else{
            holder.iv.setImageResource(R.drawable.p2);
        }
    }

    @Override
    public int getItemCount() {
        return 60;
    }

    class WaterFallViewHolder extends RecyclerView.ViewHolder{

        private ImageView iv;
        public WaterFallViewHolder(@NonNull View itemView) {
            super(itemView);

            iv = itemView.findViewById(R.id.imageView);
        }
    }
}

3、WaterFallActivity.java

package com.example.myapplication;

import androidx.appcompat.app.AppCompatActivity;
import androidx.recyclerview.widget.RecyclerView;
import androidx.recyclerview.widget.StaggeredGridLayoutManager;

import android.os.Bundle;

public class WaterFallActivity extends AppCompatActivity {
    private RecyclerView rv;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_water_fall);

        rv = findViewById(R.id.rv3);
        rv.setLayoutManager(new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL));
        rv.setAdapter(new WaterFallAdapter(WaterFallActivity.this));
    }
}

ps:图片路径,直接复制到drawable目录里面:

技术图片

 

4、效果:

技术图片

 

android RecyclerView的瀑布流布局案例

标签:toe   protected   瀑布流   layout   odi   mat   width   XML   null   

原文地址:https://www.cnblogs.com/zoro-zero/p/11407884.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!