先放一个效果图（效果图是用平板截图的，看着比例有点大），
这里我设置了ImageView的固定高度，你们写的时候可以换成
android:layout_height="wrap_content"
下面直接放代码：
1.fragment_find_recommend.xml，这里是在fragment布局文件里面添加一个RecycleView
<?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.FindRecommendFragment">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recommend_recycle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:background="@color/white"/>
</LinearLayout>2.recycle.xml，这里是为RecycleView添加内容，包括ImageView和TextView
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginTop="5dp"
android:layout_marginLeft="2.5dp"
android:layout_marginRight="2.5dp"
android:background="#26111111">
<ImageView
android:id="@+id/recommend_item_image"
android:layout_width="wrap_content"
android:layout_height="400dp"
android:scaleType="fitXY"/>
<TextView
android:id="@+id/recommend_item_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="2dp"
android:layout_gravity="left|bottom"
android:padding="12dp"
android:background="#850000"
android:textColor="#ffffff"
android:text="Golden Gate"
android:textStyle="bold"/>
</LinearLayout>
</FrameLayout>3.写一个Recommend类
public class Recommend {
private String name;
private int ImageId;
public Recommend(String name,int ImageId){
this.name = name;
this.ImageId = ImageId;
}
public int getImageId() {
return ImageId;
}
public void setImageId(int imageId) {
ImageId = imageId;
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
}
4.StaggeredGridAdapter.java写一个适配器
public class StaggeredGridAdapter extends RecyclerView.Adapter<StaggeredGridAdapter.RecommendViewHolder> {
private Context mContext;
private List<Recommend> recommendList;
public StaggeredGridAdapter(Context context, List<Recommend> recommendList) {
this.mContext = context;
this.recommendList = recommendList;
}
/**
* 创建列表组件
*
* @param parent
* @param viewType
* @return
*/
@NonNull
@Override
public StaggeredGridAdapter.RecommendViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.recycle, null);
return new StaggeredGridAdapter.RecommendViewHolder(view);
}
/**
* 绑定数据
*
* @param holder
* @param position
*/
@Override
public void onBindViewHolder(@NonNull RecommendViewHolder holder, int position) {
// holder.imageIdTv.setImageResource(recommendList.get(position).getImageId());
// holder.nameTv.setText(recommendList.get(position).getName());
holder.nameTv.setText(recommendList.get(position).getName());
holder.imageIdTv.setImageResource(recommendList.get(position).getImageId());
}
@Override
public int getItemCount() {
return recommendList.size();
}
public class RecommendViewHolder extends RecyclerView.ViewHolder {
TextView nameTv;
ImageView imageIdTv;
public RecommendViewHolder(View view) {
super(view);
this.nameTv = view.findViewById(R.id.recommend_item_text);
this.imageIdTv = view.findViewById(R.id.recommend_item_image);
}
}
}5.FindRecommendFragment.java
public class FindRecommendFragment extends Fragment {
private RecyclerView recyclerView;
private List<Recommend> recommendList=new ArrayList<>();
private static final String ARG_PARAM1 = "param1";
private static final String ARG_PARAM2 = "param2";
private String mParam1;
private String mParam2;
public FindRecommendFragment() {
// Required empty public constructor
}
public static FindRecommendFragment newInstance(String param1, String param2) {
FindRecommendFragment fragment = new FindRecommendFragment();
Bundle args = new Bundle();
args.putString(ARG_PARAM1, param1);
args.putString(ARG_PARAM2, param2);
fragment.setArguments(args);
return fragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
if (getArguments() != null) {
mParam1 = getArguments().getString(ARG_PARAM1);
mParam2 = getArguments().getString(ARG_PARAM2);
}
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// Inflate the layout for this fragment
View root=inflater.inflate(R.layout.fragment_find_recommend, container, false);
recyclerView=root.findViewById(R.id.recommend_recycle);
//设置RecyclerView保持固定大小,这样可以优化RecyclerView的性能
recyclerView.setHasFixedSize(true);
initData();
//设置瀑布流布局为2列，垂直方向滑动
recyclerView.setLayoutManager(new StaggeredGridLayoutManager(2,StaggeredGridLayoutManager.VERTICAL));
StaggeredGridAdapter staggeredGridAdapter=new StaggeredGridAdapter(this.getActivity(),recommendList);
recyclerView.setAdapter(staggeredGridAdapter);
return root;
}
/**
* 数据源
*/
private void initData() {
String[] names=new String[]{"唐诗宋词","京剧文化","传统美食","近代工艺","民间习俗","京剧文化","传统美食","近代工艺","民间习俗"};
int[] ImageId=new int[]{R.drawable.pyx,R.drawable.z,R.drawable.hd1,R.drawable.lr,R.drawable.hd,R.drawable.kq,R.drawable.zz,R.drawable.lr,R.drawable.hd};
for (int i=0;i<names.length;i++){
this.recommendList.add(new Recommend(names[i],ImageId[i]));
}
}6.到这里基本上就结束了，如果有些报错，检查一下是不是没有在drawab文件里面放入图片。
效果图：
RecycleView里面的布局可以根据需要自己设置，这里我设置了ImageView的固定高度，你们写的时候可以换成android:layout_height="wrap_content"，就是左右图片参差不齐（类似于小红书）那种状态了。
以上就是实现Fragment+RecycleView瀑布流的方式，有什么问题可以直接评论区留言，我会尽量及时回复哒！