使用DrawerLayout实现侧滑菜单

之前看到网上实现这种效果的案例，感觉市面上还是比较常见的，今天稍微闲了一点，写篇文章，记录一下，方便以后使用。

首先是效果图

• 首先是MainActivity.java

/**
 * 侧滑菜单效果实现
 * @author SHI
 * @time 2016/7/19 17:22
 */
public class MainActivity extends AppCompatActivity {

    private DrawerLayout mDrawerLayout;
    private TextView tv_left;
    private TextView tv_right;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout_background);
        tv_left = (TextView) findViewById(R.id.tv_left);
        tv_right = (TextView) findViewById(R.id.tv_right);

        tv_left.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mDrawerLayout.openDrawer(Gravity.LEFT);
                mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED,
                        Gravity.LEFT);
            }
        });
        tv_right.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                mDrawerLayout.openDrawer(Gravity.RIGHT);
                mDrawerLayout.setDrawerLockMode(DrawerLayout.LOCK_MODE_UNLOCKED,
                        Gravity.RIGHT);
            }
        });

        initEvents();
    }

    private void initEvents()
    {
        mDrawerLayout.setDrawerListener(new DrawerLayout.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;

                if (drawerView.getTag().equals("LEFT"))
                {

                    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);
                }

                if(drawerView.getTag().equals("RIGHT"))
                {
                    ViewHelper.setTranslationX(mContent,
                            -mMenu.getMeasuredWidth() * slideOffset);
                    ViewHelper.setPivotX(mContent, mContent.getMeasuredWidth());
                    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)
            {
                mDrawerLayout.setDrawerLockMode(
                        DrawerLayout.LOCK_MODE_LOCKED_CLOSED, Gravity.RIGHT);
            }
        });
    }
}

• 对应的activity_main.xml

"1.0" encoding="utf-8"?>
"http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="androidstudio.shi.com.drawerlayout.MainActivity"
    android:id="@+id/drawerLayout_background"
    android:background="@mipmap/background">

    "match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">

        "@+id/tv_left"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="50dp"
            android:gravity="center"
            android:textColor="#FFFF00FF"
            android:text="左侧弹窗" />

        "@+id/tv_right"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:layout_height="50dp"
            android:gravity="center"
            android:textColor="#FFFF0000"
            android:text="右侧弹窗" />

    


    "@+id/id_left_menu"
        android:name="androidstudio.shi.com.drawerlayout.MenuLeftFragment"
        android:layout_width="200dp"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:tag="LEFT" />

    "@+id/id_right_menu"
        android:name="androidstudio.shi.com.drawerlayout.MenuRightFragment"
        android:layout_width="100dp"
        android:layout_height="match_parent"
        android:layout_gravity="right"
        android:tag="RIGHT" />

这其中用到了两个Fragment，分别是：

• 左侧侧滑菜单MenuLeftFragment

/**
 * 左侧菜单
 * @author SHI
 * @time 2016/7/19 17:23
 */
public class MenuLeftFragment extends Fragment
{

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState)
    {
        return inflater.inflate(R.layout.menu_layout_left, container, false);
    }
}

• 右侧侧滑菜单MenuRightFragment

/**
 * 右侧菜单
 * @author SHI
 * @time 2016/7/19 17:23
 */
public class MenuRightFragment extends Fragment
{

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState)
    {
        return inflater.inflate(R.layout.menu_layout_right, container, false);
    }
}

这其中用到了两个jar包：nineoldandroids-2.4.0.jar包和support.v4包，主要是为了使用其中提供的的属性动画和drawerLayout控件。其中用到的一些资源文件我就不在这里依依说明了。
最后附上项目下载地址：点击进入下载页面