DrawerLayout使用(实现SlidingMenuUI效果)

以前做侧边栏功能，使用的是开源库SlidingMenu,最近在做透明状态栏的时候出现menu跟content没办法上移到状态栏的问题，想起以前创建的带侧边栏的Activity是能够使用状态栏的，不过他的侧边栏是用的系统自带的DrawerLaout,准确说应该叫做抽屉，命名跟他的效果也很贴切。

下面记录一些在使用DrawerLaout的时候遇到的一些问题及跟SlidingMenu在滑动风格上的区别，以及使用DrawerLaout做出像SlidingMenuUI效果的处理。

我们先往下看：

找了张美女图片做为背景图，下面是主界面



划出抽屉菜单



1. 划出菜单后，我们的内容区域多了一层阴影，如果菜单是黑色的，像我这个demo中的一样，多了阴影就很难看了，那怎么去掉这个阴影呢，

设置以下代码即可实现

mDrawerLayout.setScrimColor(Color.TRANSPARENT);

用过SlidingMenu的同学都知道，划出菜单的时候我们的内容区域会跟着移动的，但是上面的效果图是菜单是浮在内容区域上面的，这样如果想从SlidingMenu切换到DrawerLayout然后又不能说服我们得UI妹子，那这里有个方法可以实现将content也同步进行移动。

先看效果图：



从图中可以看出问题1也解决了-没有了阴影。主要一点是美女也跟着菜单像右边移动了。效果是不是跟SlidingMenu一样，别急，我们来看代码

不，看代码前先说下nineoldandroids.jar这个库，这个是一个兼容的动画库，相信很多同学都用过，没用过的自行脑补，这里就不多说了。为什么提到这个库呢，因为我们的效果是使用这个库实现的。看代码咯：

mDrawerLayout.addDrawerListener(new DrawerListener() {
@Override
public void onDrawerStateChanged(int newState) {
}

@Override
public void onDrawerSlide(View drawerView, float slideOffset) {
View mContent = mDrawerLayout.getChildAt(0);
ViewHelper.setTranslationX(mContent,
mMenu.getMeasuredWidth() * slideOffset);

}

@Override
public void onDrawerOpened(View drawerView) {
}

@Override
public void onDrawerClosed(View drawerView) {
}
});

通过给DrawerLayout增加addDrawerListener监听器，在滑动的过程中去改变我们的content的位置。

下面我们用DrawerLayout做出酷狗音乐的菜单效果

原文来自鸿洋的

http://blog.csdn.net/lmj623565791/article/details/41531475/



是不是很像。

下面看代码吧：

mDrawerLayout.addDrawerListener(new DrawerListener()
{
@Override
public void onDrawerStateChanged(int newState)
{
}

@Override
public void onDrawerSlide(View drawerView, float slideOffset)
{
View mContent = mDrawerLayout.getChildAt(0);
View mMenu = drawerView;
float scale = 1 - slideOffset;
float rightScale = 0.8f + scale * 0.2f;
float leftScale = 1 - 0.3f * scale;
ViewHelper.setScaleX(mMenu, leftScale);
ViewHelper.setScaleY(mMenu, leftScale);
ViewHelper.setAlpha(mMenu, 0.6f + 0.4f * (1 - scale));
ViewHelper.setTranslationX(mContent,
mMenu.getMeasuredWidth() * (1 - scale));
ViewHelper.setPivotX(mContent, 0);
ViewHelper.setPivotY(mContent,
mContent.getMeasuredHeight() / 2);
mContent.invalidate();
ViewHelper.setScaleX(mContent, rightScale);
ViewHelper.setScaleY(mContent, rightScale);

}

@Override
public void onDrawerOpened(View drawerView)
{
}

@Override
public void onDrawerClosed(View drawerView)
{
}
});

通过使用DrawerLayout我们实现了很不错的UI效果，同时也发现了一些不足

4.DrawerLayout的滑动只能从页面边缘滑动出来，没有SlidingMenu的效果好，这个我也找到了解决的办法，这里就不贴上代码了，大家直接看到原文 Android——DrawerLayout滑动范围的设置

但是作者也说了，提供的两种方式都有一定的缺陷，我尝试了方法一，用反射去修改滑动范围，跟viewPage一起使用的时候得再处理下事件的分发。如果大家有更好的方法，请告诉我一下。

5.下面看下我们的 DrawerLayout的沉浸式状态栏（透明状态栏是怎么出来的吧）。

很简单，就几句代码

不过只能兼容4.4.4以上系统

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
}

在我们的Activity中设置上面这段代码即可实现透明状态栏。