Android之 利用DrawerLayout打造一個側滑菜單

1。沒有什麼太難的技術含量，完全是使用v4包裏面的東西即可，沒有v4包的童鞋們，隨便copy一個到項目中即可，哈哈。

2。從DrawerLayout佈局動手，因爲使用DrawerLayout，佈局纔是重要的，個人理解。

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:imagecontrol="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawerlayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:id="@+id/fragment_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="#8A2BE2">

            <ImageView
                android:id="@+id/openDrawer"
                android:layout_width="45dp"
                android:layout_height="match_parent"
                android:layout_centerVertical="true"
                android:paddingLeft="10dp"
                android:paddingRight="10dp"
                android:src="@mipmap/caidan" />
        </RelativeLayout>

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

            <TextView
                android:id="@+id/tv_show"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center_horizontal"
                android:text="你好世界" />


        </LinearLayout>


    </LinearLayout>

    <RelativeLayout
        android:id="@+id/DrawerLeft"
        android:layout_width="250dp"
        android:layout_height="match_parent"
        android:layout_gravity="left"
        android:background="#8A2BE2">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginLeft="20dp"
            android:layout_marginRight="20dp"
            android:orientation="vertical">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="180dp"
                android:background="#8A2BE2"
                android:gravity="center_horizontal">

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

                    <com.example.ekikousei.drawerlayoutdemo.RoundImageView
                        android:id="@+id/iv_user_icon"
                        android:layout_width="70dp"
                        android:layout_height="70dp"
                        android:layout_marginTop="40dp"
                        android:src="@mipmap/icon_receive_apicture"
                        imagecontrol:border_inside_color="#bc0978"
                        imagecontrol:border_outside_color="#ba3456"
                        imagecontrol:border_thickness="1dp" />

                    <TextView
                        android:id="@+id/tv_user_name"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginTop="10dp"
                        android:gravity="center_horizontal"
                        android:text="易皇星"
                        android:textColor="@color/text_color_write"
                        android:textStyle="bold" />
                </LinearLayout>
            </RelativeLayout>

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


                <LinearLayout
                    android:id="@+id/ll_phone"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:orientation="vertical">

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"

                        android:gravity="center_vertical"
                        android:orientation="horizontal">

                        <ImageView
                            android:layout_width="28dp"
                            android:layout_height="28dp"
                            android:src="@mipmap/icon_receive_apicture" />

                        <TextView
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_marginLeft="20dp"
                            android:text="電 話"
                            android:textColor="@color/text_color_write" />
                    </LinearLayout>


                    <View
                        android:layout_width="match_parent"
                        android:layout_height="0.5dp"
                        android:layout_marginTop="10dp"
                        android:background="@color/text_color_write" />

                </LinearLayout>


                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginTop="10dp"
                    android:gravity="center_vertical"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_width="28dp"
                        android:layout_height="28dp"
                        android:src="@mipmap/icon_receive_apicture" />

                    <TextView
                        android:id="@+id/tv_user_email"
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:text="郵 箱"
                        android:textColor="@color/text_color_write" />
                </LinearLayout>


                <View
                    android:layout_width="match_parent"
                    android:layout_height="0.5dp"
                    android:layout_marginTop="10dp"
                    android:background="@color/text_color_write" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="10dp"
                android:orientation="vertical">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"

                    android:gravity="center_vertical"
                    android:orientation="horizontal">

                    <ImageView
                        android:layout_width="28dp"
                        android:layout_height="28dp"
                        android:src="@mipmap/icon_receive_apicture" />

                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:layout_marginLeft="20dp"
                        android:text="地 址"
                        android:textColor="@color/text_color_write" />
                </LinearLayout>


                <View
                    android:layout_width="match_parent"
                    android:layout_height="0.5dp"
                    android:layout_marginTop="10dp"
                    android:background="@color/text_color_write" />

            </LinearLayout>


        </LinearLayout>
    </RelativeLayout>

</android.support.v4.widget.DrawerLayout>

3。使用：那就簡單了噻

import android.app.Activity;
import android.os.Bundle;
import android.support.v4.widget.DrawerLayout;
import android.view.Gravity;
import android.view.View;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;
import android.widget.Toast;

public class MainActivity extends Activity implements  View.OnClickListener {
    private DrawerLayout drawerlayout;
    private ImageView openDrawer;
     private RelativeLayout DrawerLeft;
    private LinearLayout ll_phone;
    private TextView tv_show;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        drawerlayout= (DrawerLayout) findViewById(R.id.drawerlayout);
        openDrawer= (ImageView) findViewById(R.id.openDrawer);
        DrawerLeft= (RelativeLayout) findViewById(R.id.DrawerLeft);
        ll_phone= (LinearLayout) DrawerLeft.findViewById(R.id.ll_phone);

        tv_show= (TextView) findViewById(R.id.tv_show);
        tv_show.setOnClickListener(this);
        ll_phone.setOnClickListener(this);

        openDrawer.setOnClickListener(this);
    }




    @Override
    public void onClick(View v) {

        switch (v.getId()){

            case R.id.openDrawer:


                drawerlayout.openDrawer(Gravity.LEFT);

                break;


            case R.id.ll_phone:

                Toast.makeText(MainActivity.this, "15095887072", Toast.LENGTH_SHORT).show();

                break;


            case R.id.tv_show:

                Toast.makeText(MainActivity.this, "你好 世界", Toast.LENGTH_SHORT).show();

                break;



            default:
        }

    }
}

效果圖：

猛戳這裏：studio點擊下載