1. 程式人生 > >側邊欄 DrawerLayout佈局使用教程

側邊欄 DrawerLayout佈局使用教程

首先我們使用DrawerLayout佈局: <android.support.v4.widget.DrawerLayout xmlns:android=“http://schemas.android.com/apk/res/android” android:id="@+id/draw_layout" android:layout_width=“match_parent” android:layout_height=“match_parent”> </android.support.v4.widget.DrawerLayout> DrawerLayout佈局內用兩個大布局即可實現側邊欄的效果.

我們可以看到以下程式碼中,首先使用了RelativeLayout佈局,這是主頁面的佈局,接下來LinearLayout為側邊欄的佈局.注意LinearLayout佈局內需要設定android:layout_gravity=“start” 也可以設定為end.即可實現

    <FrameLayout
        android:id="@+id/frag_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</RelativeLayout>
<LinearLayout
    android:layout_width="200dp"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/zuo_lin"
    android:layout_gravity="start"
    android:background="@color/colorPrimary"
    >
    <ImageView
        android:layout_width="60dp"
        android:layout_height="60dp"
        android:id="@+id/img_left"
        android:layout_marginTop="20dp"
        android:layout_gravity="center_horizontal"
        android:src="@mipmap/ic_launcher_round"
        />
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:gravity="center"
        android:layout_marginTop="20dp"
        android:text="這是側欄" />

    <TextView
        android:id="@+id/xList_left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:gravity="center"
        android:text="xListView" />

    <TextView
        android:id="@+id/tab_left"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:gravity="center"
        android:text="TabLayout" />
</LinearLayout>

DrawerLayout實現側邊欄效果比較簡單,看到這裡,您應該已經明白了