DrawerLayout实现Android仿多闪主页面滑动效果

最近公司产品定了新需求，是按照多闪主页面左右两侧滑动效果以及伴随动画。看了多闪主页面效果，感觉用自定义控件比较合适，但是就怕自己做的不太完善，就想着用Android原生的DrawerLayout（抽屉布局）来实现。忙完这一阵想再用自定义的方法试一下，顺便回顾下自定义控件。

大家可以看一下多闪的主页面效果，是由中间的底层，加左右两边抽屉组成，另外在最上层有三个button随着页面变化而变化，来显示现在呈现给用户的具体是哪个界面。

使用DrawerLayout实现遇到几个小问题，一一来说。
第一，就是DrawerLayout可以实现左右抽屉，但是默认不能滑到底不能覆盖全屏，查了一下资料发现抽屉滑动之后距离屏幕边缘是65dp，所以将左右布局的margin设置为-65dp

第二 代码设置全屏可以滑动的时候会有问题，因为我的主页面也有滑动效果，和主页面效果冲突，所以我就禁用了滑动抽屉，改为按钮式抽屉，下面介绍一下双侧抽屉出现的问题：

//左侧抽屉支持全屏滑动
//setDrawerLeftEdgeSize(this , mDrawerLayout , 1 , "mLeftDragger");
//右侧抽屉全屏滑动
//setDrawerLeftEdgeSize(this , mDrawerLayout , 1 , "mRightDragger");

//左边开关
    public void toggleLeftLayout(){
        if(mDrawerLayout.isDrawerOpen(mLeftRl)){
            mDrawerLayout.closeDrawer(mLeftRl);
        }else{
            mDrawerLayout.openDrawer(mLeftRl);
        }
    }

    //右边开关
    public void toggleRightLayout(){
        if(mDrawerLayout.isDrawerOpen(mRightRl)){
            mDrawerLayout.closeDrawer(mRightRl);
        }else{
            mDrawerLayout.openDrawer(mRightRl);
        }
    }

    /**
     * 设置抽屉全屏滑动
     */
    private void setDrawerLeftEdgeSize (Activity activity, DrawerLayout drawerLayout, float displayWidthPercentage , String value) {
        if (activity == null || drawerLayout == null) return;
        try {
            // 找到 ViewDragHelper 并设置 Accessible 为true
            Field leftDraggerField = drawerLayout.getClass().getDeclaredField(value);//Right
            leftDraggerField.setAccessible(true);
            ViewDragHelper leftDragger = (ViewDragHelper) leftDraggerField.get(drawerLayout);

            // 找到 edgeSizeField 并设置 Accessible 为true
            Field edgeSizeField = leftDragger.getClass().getDeclaredField("mEdgeSize");
            edgeSizeField.setAccessible(true);

            int edgeSize = edgeSizeField.getInt(leftDragger);
            // 设置新的边缘大小
            Point displaySize = new Point();
            activity.getWindowManager().getDefaultDisplay().getSize(displaySize);
            edgeSizeField.setInt(leftDragger, Math.max(edgeSize, (int) (displaySize.x * displayWidthPercentage)));
        } catch (NoSuchFieldException e) {
            Log.i(TAG , "NoSuchFieldException ==== " + e.toString());
        } catch (IllegalArgumentException e) {
            Log.i(TAG , "IllegalArgumentException ==== " + e.toString());
        } catch (IllegalAccessException e) {
            Log.i(TAG , "IllegalAccessException ==== " + e.toString());
        }
    }

setDrawerLeftEdgeSize方法是设置全屏滑动的，但是问题就在于我们是双侧抽屉，我就调用了两次，于是第二次，也就是右侧的滑动效果覆盖了左侧的，我怎么滑动都只是右侧弹出来。做Demo的时候我还以为是出bug了，多试了几次，想了下应该是两个滑动冲突了。后来注释了一个，只测试左侧抽屉的时候效果也不是很好。因为我底层页面也有滑动事件，所以就先停掉了滑动切换抽屉，另外 toggleLeftLayout 和 toggleRightLayout 两个方法是按钮打开关闭抽屉。

另外开关抽屉和按钮联动的动画我就不贴代码了，注意一点不要用简单的平移动画，因为点击事件不会跟着

总结：最后整合到app上的效果还是非常好的，产品很满意，就是缺少了滑动切换页面，整体效果没有那么好，有时间还是自定义研究一下吧