Android之RecyclerView实现层叠布局

时间：2024-03-19 13:38:15

关于层叠布局可能我描述的有点问题，实际上是前段时间有个小伙伴突然需求显示一种层叠效果并且数据的条数是不确定的，当时第一反应就想到了适配器，所以这里利用RecyclerView实现层叠布局效果如下图
Android之RecyclerView实现层叠布局
废话不多说直接上代码
主Activity代码

public class Main7Activity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main7);
        RecyclerView recyclerView = findViewById(R.id.my_recy_view);
        //这里需要划重点，上图中是第一项在最下方，如果需要在最上方只能倒叙并翻转RecyclerView若需要的话
        //请将LinearLayoutManager第三个参数改为true并且setStackFromEnd也为true
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this,LinearLayoutManager.HORIZONTAL,false);
        linearLayoutManager.setStackFromEnd(false);
        
        recyclerView.setLayoutManager(linearLayoutManager);
        recyclerView.setAdapter(new MyRecyViewAdapter());

    }

    class MyRecyViewAdapter extends RecyclerView.Adapter<MyRecyViewAdapter.ViewHolder>{

        @NonNull
        @Override
        public MyRecyViewAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
            return new ViewHolder(LayoutInflater.from(Main7Activity.this).inflate(R.layout.rv_item,parent,false));
        }

        @Override
        public void onBindViewHolder(@NonNull MyRecyViewAdapter.ViewHolder holder, int position) {
            Drawable[] drawables = new Drawable[]{
                    getResources().getDrawable(R.drawable.bg_share_loan),getResources().getDrawable(R.drawable.bg_share_loan1),
                    getResources().getDrawable(R.drawable.bg_share_loan2),getResources().getDrawable(R.drawable.bg_share_loan3),
                    getResources().getDrawable(R.drawable.bg_share_loan4),getResources().getDrawable(R.drawable.bg_share_loan),
                    getResources().getDrawable(R.drawable.bg_share_loan1),getResources().getDrawable(R.drawable.bg_share_loan2),
                    getResources().getDrawable(R.drawable.bg_share_loan3),getResources().getDrawable(R.drawable.bg_share_loan4)};

            holder.linearLayout.setBackground(drawables[position]);
            if(position==0){
                setMargins(holder.linearLayout,0,0,0,0);
            }
        }


        public void setMargins (View v, int l, int t, int r, int b) {
            if (v.getLayoutParams() instanceof ViewGroup.MarginLayoutParams) {
                ViewGroup.MarginLayoutParams p = (ViewGroup.MarginLayoutParams) v.getLayoutParams();
                p.setMargins(l, t, r, b);
                v.requestLayout();
            }
        }

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

        public class ViewHolder extends RecyclerView.ViewHolder {
            LinearLayout linearLayout;
            public ViewHolder(View itemView) {
                super(itemView);
                linearLayout = itemView.findViewById(R.id.item);
            }
        }
    }
}

需要记住一个重点 上图中是第一项在最下方，如果需要在最上方只能倒叙并翻转RecyclerView若需要的话
请将LinearLayoutManager第三个参数改为true并且setStackFromEnd也为true
接下来我们看一下布局文件
Activity的

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:layout_gravity="center"
    android:gravity="center"
    tools:context=".Main7Activity">
    <android.support.v7.widget.RecyclerView
        android:id="@+id/my_recy_view"
        android:layout_gravity="center"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"/>

</LinearLayout>

Adapter的

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/item"
    android:layout_marginLeft="-30dp"
    android:orientation="vertical" android:layout_width="100dp"
    android:layout_height="100dp"
    android:gravity="center"
    android:background="@drawable/bg_share_loan">

</LinearLayout>

在这里有一点提一下marginLeft-30是实现层叠的关键，如果你是上下这种请改为marginTop具体设置负多少看你的需求
最后提供一下代码中圆的xml，其他的都是复制的只改了个颜色希望大家能举一反三欢迎各位评论转载
提供一个drawable文件其他改个颜色就行

<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="oval" xmlns:android="http://schemas.android.com/apk/res/android">
    <solid android:color="#FF0000" />
    <stroke android:width="3dp" android:color="#FF0000"/>
</shape>

相关文章