卡片式布局

CardView

CardView其实也是一个FrameLayout,但是它额外提供了圆角和阴影等效果，所以看起来会有立体的感觉。

在RecyclerView填充CardView

子布局设置为CardView

<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    app:cardCornerRadius="5dp"
    android:layout_margin="5dp"
    android:layout_height="wrap_content">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ImageView
            android:id="@+id/image_view"
            android:layout_width="wrap_content"
            android:layout_height="100dp"
            android:layout_gravity="center_horizontal"
            android:scaleType="centerCrop"
            />
        <TextView
            android:id="@+id/image_name"
            android:layout_width="wrap_content"
            android:layout_gravity="left"
            android:layout_height="wrap_content"
            android:layout_marginTop="10dp"
            />
    </LinearLayout>

</androidx.cardview.widget.CardView>

在activity_main.xml中添加RecyclerView

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/drawer_layout"
    >
    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
            <androidx.recyclerview.widget.RecyclerView
                android:id="@+id/recyclerView"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>/
        </LinearLayout>
        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:id="@+id/fab"
            android:layout_gravity="bottom|end"
            android:src="@drawable/ic_done"/>
    </androidx.coordinatorlayout.widget.CoordinatorLayout>
    <com.google.android.material.navigation.NavigationView
        android:id="@+id/navigation"
        android:layout_gravity="start"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:headerLayout="@layout/nav_header"
        android:elevation="8dp"
        app:menu="@menu/nav_menu"/>

</androidx.drawerlayout.widget.DrawerLayout>

在MainActivity中自定义适配器（FruitAdapter）

class FruitAdapter extends RecyclerView.Adapter<FruitAdapter.ViewHolder>{
    List<Fruit> FruitList;
    ViewHolder viewHolder;
    Context context;
    FruitAdapter(List<Fruit> fruits){
        FruitList=fruits;
    }
    class ViewHolder extends RecyclerView.ViewHolder{
        CardView cardView;
        ImageView imageView;
        TextView textView;
        public ViewHolder(@NonNull View itemView) {
            super(itemView);
            cardView=(CardView)itemView;
            imageView=itemView.findViewById(R.id.image_view);
            textView=itemView.findViewById(R.id.image_name);
        }
    }
    @NonNull
    @Override
    public FruitAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType){
        if(context==null){
            context=parent.getContext();
        }
        View view=LayoutInflater.from(context).inflate(R.layout.fruit_item,parent,false);
        return new ViewHolder(view);
    }
    @Override
    public void onBindViewHolder(@NonNull FruitAdapter.ViewHolder holder, int position) {
        Fruit fruit=FruitList.get(position);
        Glide.with(context).load(fruit.getId()).into(holder.imageView);
        holder.textView.setText(fruit.getName());
    }
    @Override
    public int getItemCount() {
        return FruitList.size();
    }
}

为ReclyclerView设置适配器和布局。

布局采用网格布局（更能体现网格布局）。

FruitAdapter  fruitAdapter=new FruitAdapter(fruitList);
        recyclerView.setAdapter(fruitAdapter);
        GridLayoutManager gridLayoutManager=new GridLayoutManager(this,2);
        recyclerView.setLayoutManager(gridLayoutManager);

AppBarLayout

在之前的布局中，为了让Toolbar和RecyclerView不重合在一起，用了一个垂直方向线性布局将他们做了布局，其实用AppBarLayout就可以实现这个效果，这实际是一个垂直方向的LinearLayout,在内部做了很多滚动事件的封装。
这里修改xml,将Toolbar放在AppBarLayout中，同时为RecyclerView添加一个布局行为。

     <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <androidx.appcompat.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
        </com.google.android.material.appbar.AppBarLayout>
        <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/recyclerView"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

这里其实还没有体现出具体的效果，可以在AppBarLayout中的子控件（这里是Toolbar）指定具体的行为。

            <androidx.appcompat.widget.Toolbar
                app:layout_scrollFlags="scroll|enterAlways"
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>

这里scroll会让Toolbar跟随ReclyclerView一起向上，enterAlways会跟随ReclyclerView一起向下。