效果图
代码示例
ShopFragment.java（显示RecyclerView的Fragment）
pacpackage com.gjc.ihelp.fragment; import android.app.Fragment; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; import androidx.recyclerview.widget.RecyclerView; import androidx.recyclerview.widget.StaggeredGridLayoutManager; import com.gjc.ihelp.R; import com.gjc.ihelp.adapter.GoodsAdapter; import com.gjc.ihelp.data.GoodsData; import java.util.ArrayList; import java.util.List; public class ShopFragment extends Fragment { private View view; private TextView tvTitle; private RecyclerView rvList; //页面数据 private List<GoodsData> goodsDataList; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { view = inflater.inflate(R.layout.fragment_shop, container, false); initData(); initView(); return view; } private void initData() { goodsDataList = new ArrayList<>(); // 初始化用户数据 for (int i = 0; i < 100; i++) { GoodsData goodsData = new GoodsData(); if (Math.random() * 100 < 10) { goodsData.goodsImg = R.drawable.goods; } else if (Math.random() * 100 >= 10 && Math.random() * 100 < 20) { goodsData.goodsImg = R.drawable.goods_1; } else if (Math.random() * 100 >= 20 && Math.random() * 100 < 30) { goodsData.goodsImg = R.drawable.goods_2; } else if (Math.random() * 100 >= 30 && Math.random() * 100 < 40) { goodsData.goodsImg = R.drawable.goods_3; } else if (Math.random() * 100 >= 40 && Math.random() * 100 < 50) { goodsData.goodsImg = R.drawable.goods_4; } else if (Math.random() * 100 >= 50 && Math.random() * 100 < 60) { goodsData.goodsImg = R.drawable.goods_5; } else if (Math.random() * 100 >= 60 && Math.random() * 100 < 70) { goodsData.goodsImg = R.drawable.goods_6; } else if (Math.random() * 100 >= 70 && Math.random() * 100 < 80) { goodsData.goodsImg = R.drawable.goods_7; } else if (Math.random() * 100 >= 80 && Math.random() * 100 < 90) { goodsData.goodsImg = R.drawable.goods_8; } else { goodsData.goodsImg = R.drawable.goods_9; } goodsData.integral = (int) (Math.random() * 100 + 100); goodsDataList.add(goodsData); } } private void initView() { tvTitle = view.findViewById(R.id.tv_title); rvList = view.findViewById(R.id.rv_list); tvTitle.setText("商品列表"); /** * StaggeredGridLayoutManager 方法参数 * setSpanCount：设置网格的列数 * setOrientation：设置瀑布流布局的方向，取值说明同LinearLayoutManager * setReverseLayout：设置是否为相反方向开始布局，默认false。如果设置为true，那么垂直方向将从下往上开始布局，水平方向将从右往左开始布局 */ // 2:设置网格列数 StaggeredGridLayoutManager.VERTICAL:设置瀑布流布局的方向 StaggeredGridLayoutManager manager = new StaggeredGridLayoutManager(2, StaggeredGridLayoutManager.VERTICAL); GoodsAdapter myAdapter = new GoodsAdapter(getActivity(), goodsDataList); //添加 adapter rvList.setAdapter(myAdapter); //添加 manager rvList.setLayoutManager(manager); } }
fragment_shop.xml（相对应的xml文件）
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".fragment.ShopFragment"> <TextView android:id="@+id/tv_title" android:layout_width="match_parent" android:layout_height="80dp" android:text="@string/user_list" android:textSize="30sp" android:textStyle="bold" android:gravity="center" android:textColor="#ffffff"/> <androidx.recyclerview.widget.RecyclerView android:id="@+id/rv_list" android:background="#f0f0f0" android:layout_width="match_parent" android:layout_height="match_parent"/> </LinearLayout>
GoodsData.java（数据源）
package com.gjc.ihelp.data; public class GoodsData { public int goodsImg;//商品图片 public int integral;//所需积分 public GoodsData() { } }
GoodsAdapter.java（适配器类）
package com.sjm.ihelp.adapter; import android.app.Activity; import android.content.Context; import android.view.View; import android.view.ViewGroup; import android.widget.Button; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TextView; import androidx.annotation.NonNull; import androidx.recyclerview.widget.RecyclerView; import com.sjm.ihelp.R; import com.sjm.ihelp.Utils.ToastUtil; import com.sjm.ihelp.data.GoodsData; import java.util.List; public class GoodsAdapter extends RecyclerView.Adapter<GoodsAdapter.MyViewHolder> { private Context context; private List<GoodsData> goodsDataList; private ImageView ivGoodsImg; private TextView tvNeedIntegral; private Button btExchange; public GoodsAdapter(Context context, List<GoodsData> goodsDataList) { this.context = context; this.goodsDataList = goodsDataList; } @NonNull @Override public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) { View view = View.inflate(context, R.layout.adapter_goods, null); return new MyViewHolder(view); } @Override public void onBindViewHolder(@NonNull MyViewHolder holder, int position) { ivGoodsImg.setBackgroundResource(goodsDataList.get(position).goodsImg); tvNeedIntegral.setText(goodsDataList.get(position).integral + ""); btExchange.setOnClickListener(v -> { ToastUtil.show((Activity) context, "兑换成功"); }); } @Override public int getItemCount() { return 50; } public class MyViewHolder extends RecyclerView.ViewHolder { public MyViewHolder(@NonNull View itemView) { super(itemView); //获取文本节点 ivGoodsImg = itemView.findViewById(R.id.iv_goods_img); btExchange = itemView.findViewById(R.id.bt_exchange); tvNeedIntegral = itemView.findViewById(R.id.tv_need_integral); } } }
adapter_goods.xml（item）
<?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="wrap_content" android:paddingTop="5dp" android:paddingLeft="5dp" android:paddingRight="5dp" android:orientation="vertical"> <ImageView android:id="@+id/iv_goods_img" android:layout_width="match_parent" android:layout_height="200dp" android:background="@drawable/goods_2"/> <FrameLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginTop="5dp" android:layout_marginBottom="5dp"> <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_vertical" android:orientation="horizontal"> <TextView android:layout_width="match_parent" android:layout_height="wrap_content" android:text="所需积分：" android:textSize="18sp" android:textColor="#000000"/> <TextView android:id="@+id/tv_need_integral" android:layout_width="match_parent" android:layout_height="wrap_content" android:text="999" android:textSize="18sp" android:textColor="#ff0000"/> </LinearLayout> <Button android:id="@+id/bt_exchange" android:layout_width="70dp" android:layout_height="30dp" android:text="@string/exchange" android:layout_marginRight="10dp" android:layout_gravity="right|center" android:background="@drawable/button_style_orange"/> </FrameLayout> </LinearLayout> <?xml
