droidupnp采用的主布局,是一个采用了DrawerLayout的ActionbarActivity,

直接包含了两个fragment的方式。包括两个fragment,id叫做content的fragment是正面战场,id为navigation_drawer的fragment是辅助战场。

原来这是著名的 DrawerLayout 控件,支持创建  Navigation Drawer模式。可以设置从左边划出菜单或者右边,也可以左右菜单同时存在。

主布局要在drawer布局的上面,要不然会被挡住,参考,而且Drawer view的宽度不能超过320dp,以免滑出drawer后在主视图完全消失不见。

 

 

<android.support.v4.widget.DrawerLayout
	xmlns:android="http://schemas.android.com/apk/res/android"
	xmlns:tools="http://schemas.android.com/tools"
	android:id="@+id/drawer_layout"
	android:layout_width="match_parent"
	android:layout_height="match_parent"
	tools:context="org.droidupnp.Main">

	<fragment android:id="@+id/content"
		android:name="org.droidupnp.view.Content"
		android:layout_width="match_parent"
		android:layout_height="match_parent"
		tools:layout="@layout/content"/>

	<fragment android:id="@+id/navigation_drawer"
		android:layout_width="@dimen/navigation_drawer_width"
		android:layout_height="match_parent"
		android:layout_gravity="start"
		android:name="org.droidupnp.DrawerFragment"
		tools:layout="@layout/device_fragment"/>

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

 

注1  :

tools:layout仅仅是告诉编辑器,Fragment在程序预览的时候该显示成什么样,并不会对apk产生实际作用,是为开发者设计的。

This is a namespace used by the IDE tools. This is not needed to run the application on a device (or emulator). On the other hand, if you leave them, Android will ignore them when the application is running on a device.

 

注2:

<!-- android:layout_gravity="start" tells DrawerLayout to treat
this as a sliding drawer on the left side for left-to-right
languages and on the right side for right-to-left languages.
The drawer is given a fixed width in dp and extends the full height of
the container. A solid background is used for contrast
with the content view. -->

<ListView
android:id="@+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="@android:color/transparent"
android:dividerHeight="0dp"
android:background="#111"/>

===========================

 

还有一个带了viewpager的抽屉布局的例子:

主布局是一个垂直的线性布局

(1)最上面是一个toobar,

(2)然后是一个drawerlayout布局。

DrawerLayout抽屉布局里头,首先是垂直的线性内容布局,然后是线性的侧滑菜单的布局。

1)线性的内容布局:首先是一个PagerSlidingTabStrip,然后是一个RelativeLayout(包括一个ViewPager 和一个EditText))

2)垂直的线性布局,作为一个抽屉布局,里头仅有一个TextView

 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".MainActivity">


    <!--  <include layout="@layout/toolbar" /> -->
    <include layout="@layout/toolbar" />
    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <!-- 内容界面 -->

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

            <sc.music.ui.widget.PagerSlidingTabStrip
                android:id="@+id/tabs"
                android:layout_width="match_parent"
                android:layout_height="48dip"></sc.music.ui.widget.PagerSlidingTabStrip>

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <android.support.v4.view.ViewPager
                    android:id="@+id/pager"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"></android.support.v4.view.ViewPager>

                <EditText
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content" />
            </RelativeLayout>

        </LinearLayout>

        <!-- 侧滑菜单内容 -->

        <LinearLayout
            android:id="@+id/drawer_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="start" 这是侧滑的抽屉
            android:background="@color/material_pink_A200"
            android:orientation="vertical"
            android:padding="8dp">

            <TextView
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </LinearLayout>
    </android.support.v4.widget.DrawerLayout>

</LinearLayout>

 

发表评论

电子邮件地址不会被公开。 必填项已用*标注