Android 抽屉侧滑效果

最近公司让我又新写一个项目，然后里面有个侧换抽屉效果，我进行了编写优化感觉效果比Android原生的流畅很多，交互也很好，因此在此记录一下，效果图如下：

废话少说上源码：主页面Activity: 

public class MainActivity exte
nds BaseActivity implements DrawerLayout.DrawerListener {
    @BindView(R.id.iv_title_back)
    ImageView ivTitleBack;
    @BindView(R.id.card_view)
    CardView cardView;
    @BindView(R.id.drawer_layout)
    DrawerLayout mDrawerLayout;

    @Override
    protected int getLayout() {
        return R.layout.activity_main;
    }

    @Override
    protected void initView(Bundle var1) {
        mDrawerLayout.setScrimColor(Color.TRANSPARENT);
        ivTitleBack.setOnClickListener(v -> mDrawerLayout.openDrawer(GravityCompat.START));
        mDrawerLayout.addDrawerListener(this);
    }

    @Override
    public void onDrawerSlide(@NonNull View drawerView, float slideOffset) {
        View mContent = mDrawerLayout.getChildAt(0);
        float scale = 1 - slideOffset;
        float rightScale = 0.8f + scale * 0.2f;
        float leftScale = 0.5f + slideOffset * 0.5f;
        drawerView.setAlpha(leftScale);
        drawerView.setScaleX(leftScale);
        drawerView.setScaleY(leftScale);
        mContent.setPivotX(0);
        mContent.setPivotY(mContent.getHeight() * 1 / 2);
        mContent.setScaleX(rightScale);
        mContent.setScaleY(rightScale);
        mContent.setTranslationX(drawerView.getWidth() * slideOffset);
    }

    @Override
    public void onDrawerOpened(@NonNull View drawerView) {
        cardView.setRadius(20);
    }

    @Override
    public void onDrawerClosed(@NonNull View drawerView) {
        cardView.setRadius(0);
    }

    @Override
    public void onDrawerStateChanged(int newState) {
        cardView.setRadius(20);
    }
}

DrawerLayout 就是侧滑布局，通过监听侧滑来动态设置cardview的透明偏移等。

这是main_xml:

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:src="@drawable/iv_menu_bg"
        android:scaleType="centerCrop" />

    <androidx.drawerlayout.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <androidx.cardview.widget.CardView
            android:id="@+id/card_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:cardCornerRadius="0dp"
            app:cardElevation="20dp">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:orientation="vertical">

                <include layout="@layout/app_title" />
            </LinearLayout>

        </androidx.cardview.widget.CardView>

        <fragment
            android:id="@+id/nav_view"
            android:name="com.android.gps.ui.fragment.MenuFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="start" />
    </androidx.drawerlayout.widget.DrawerLayout>
</RelativeLayout>

ImageView作为里面的黑色妹子图片 固定背景，CardView的作用是为了有那种阴影效果，看上去有立体感，删掉也不影响。 这个就是侧滑fragment：

public class MenuFragment extends BaseFragment {
    @BindView(R.id.iv_head)
    ImageView ivHead;

    @Override
    protected int getLayout() {
        return R.layout.fragment_menu;
    }

    @Override
    protected void initView() {
        GlideUtil.loadCircleHeadImage(getContext(),R.drawable.head,ivHead);
    }

    @Override
    protected void lazyLoad() {

    }
}

MainActivity和MenuFragment都是进行高度抽离的Base，所以看上去也很简洁，以上就是这个效果实现的全部代码，有需要BaseActivity和BaseFragment的话私我！