Android 抽屉侧滑效果

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

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

public class MainActivity extends 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"?>

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的话私我！

更多相关文章

随机推荐