使用CoordinatorLayout+TabLayout+Vi

直接上代码

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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:background="@color/c_f2f2f2"
    android:orientation="vertical"
    tools:context=".ui.activity.MainActivity">

    <View
        android:id="@+id/root_status_view"
        android:layout_width="match_parent"
        android:layout_height="0dp" />

    <TextView
        android:id="@+id/tv_home_title"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_below="@+id/root_status_view"
        android:background="@color/white"
        android:gravity="center"
        android:text="叮当，为人类健康服务"
        android:textColor="@color/c_e77c81" />

    <View
        android:id="@+id/view_line1"
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:layout_below="@+id/tv_home_title"
        android:background="@color/c_f2f2f2" />

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/rl_to_commit"
        android:layout_below="@+id/view_line1"
        android:layout_marginBottom="10dp">

        <com.google.android.material.appbar.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/c_f2f2f2">

            <com.google.android.material.appbar.CollapsingToolbarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:fitsSystemWindows="false"
                app:contentScrim="@color/c_f2f2f2"
                app:layout_scrollFlags="scroll|exitUntilCollapsed">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">

                    <include layout="@layout/item_home_top_view" />

                </RelativeLayout>

            </com.google.android.material.appbar.CollapsingToolbarLayout>

            <com.androidkun.xtablayout.XTabLayout
                android:id="@+id/xl_Tablayout"
                android:layout_width="match_parent"
                android:layout_height="48dp"
                android:layout_marginTop="10dp"
                android:background="@color/white"
                app:xTabBackgroundColor="@color/transparent"
                app:xTabDisplayNum="4"
                app:xTabDividerWidthWidthText="true"
                app:xTabIndicatorColor="@color/c_e94544"
                app:xTabIndicatorHeight="4dp"
                app:xTabIndicatorRoundX="2dp"
                app:xTabIndicatorRoundY="2dp"
                app:xTabMode="scrollable"
                app:xTabSelectedTextColor="@color/c_e94544"
                app:xTabSelectedTextSize="13sp"
                app:xTabTextColor="@color/c_333333"
                app:xTabTextSelectedBold="true"
                app:xTabTextSize="13sp" />

        </com.google.android.material.appbar.AppBarLayout>

        <androidx.viewpager.widget.ViewPager
            android:id="@+id/vp_home"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="10dp"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />


    </androidx.coordinatorlayout.widget.CoordinatorLayout>

    <RelativeLayout
        android:id="@+id/rl_to_commit"
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="30dp"
        android:layout_marginRight="30dp"
        android:layout_marginBottom="20dp"
        android:background="@drawable/shape_home_price_bg">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:orientation="vertical">


            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal">

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="10dp"
                    android:text="合计：￥"
                    android:textColor="@color/white"
                    android:textSize="11sp" />

                <TextView
                    android:id="@+id/tv_shop_price"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="2dp"
                    android:text="0.00"
                    android:textColor="@color/white"
                    android:textSize="14sp"
                    android:textStyle="bold" />

                <TextView
                    android:id="@+id/tv_shop_num"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerVertical="true"
                    android:layout_marginLeft="7dp"
                    android:text="共0件"
                    android:textColor="@color/white"
                    android:textSize="11sp" />
            </LinearLayout>

            <TextView
                android:id="@+id/tv_shop_event"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="4dp"
                android:text="*活动物品请在店员处领取"
                android:textColor="@color/c_858a9e"
                android:textSize="9sp" />
        </LinearLayout>


        <TextView
            android:id="@+id/tv_commit_order"
            android:layout_width="80dp"
            android:layout_height="40dp"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_marginRight="15dp"
            android:background="@drawable/shape_commit_bg"
            android:gravity="center"
            android:text="去结算"
            android:textColor="@color/white" />


    </RelativeLayout>

</RelativeLayout>