android - Android NavigationDrawer 和工具栏

Question

请帮我创建Toolbar，哪些内容会结束@+id/left_drawer？可能吗？

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

    <android.support.v7.widget.Toolbar
        android:id="@+id/my_awesome_toolbar"
        style="@style/MainTheme.ToolBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

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

            <com.astuetz.RobottoRegularTextView
                android:id="@+id/toolbar_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:textColor="@android:color/white"
                android:textSize="20sp" />

            <com.astuetz.RobottoLightTextView
                android:id="@+id/toolbar_subtitle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:textColor="@android:color/white"
                android:textSize="@dimen/small_text"
                android:visibility="gone" />
        </LinearLayout>
    </android.support.v7.widget.Toolbar>

    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>

<!--ImageView for test -->
<ImageView
    android:id="@+id/left_drawer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:layout_marginTop="0dp"
    android:layout_marginBottom="0dp"
    android:scaleType="centerCrop"
    android:adjustViewBounds="true"
    android:src="@drawable/background" />

Answer 1

在父 LinearLayout 内部，Toolbar 可以放在第一位，DrawerLayout 可以放在第二位。

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

    <android.support.v7.widget.Toolbar
        android:id="@+id/my_awesome_toolbar"
        style="@style/MainTheme.ToolBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    (...)

    </android.support.v7.widget.Toolbar>

    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <FrameLayout
            android:id="@+id/content_frame"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <fragment
            android:id="@+id/left_drawer"
            android:layout_width="@dimen/navigation_drawer_width"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            tools:layout="@layout/fragment_navigation_drawer" />

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

</LinearLayout>

Answer 2

@hata 非常接近正确答案。你需要在Toolbar之后放置DrawerLayout，使Toolbar背景透明并在之前创建表单@+id/content_frame，DrawerLayout其中高度将?attr/actionBarSize与工具栏一样具有背景颜色。这是我的解决方案

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.kpi.timetable.views.HackyDrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

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

            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/YOUR_ACTIONBAR_COLOR"/>

            <FrameLayout
                android:id="@+id/content_frame"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </LinearLayout>


        <ImageView
            android:id="@+id/left_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:layout_marginBottom="0dp"
            android:layout_marginTop="0dp"
            android:adjustViewBounds="true"
            android:scaleType="centerCrop"
            android:src="@drawable/background" />
    </com.kpi.timetable.views.HackyDrawerLayout>

    <!-- in your MainTheme.ToolBar style set background       -->
    <!-- color to "@android:color/transparent" or set it here -->
    <!-- as android:background="@android:color/transparent"   -->
    <android.support.v7.widget.Toolbar
        android:id="@+id/my_awesome_toolbar"
        style="@style/MainTheme.ToolBar"            
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize">

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

            <com.astuetz.RobottoRegularTextView
                android:id="@+id/toolbar_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Расписание"
                android:textColor="@android:color/white"
                android:textSize="20sp" />

            <com.astuetz.RobottoLightTextView
                android:id="@+id/toolbar_subtitle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:textColor="@android:color/white"
                android:textSize="@dimen/small_text"
                android:visibility="gone" />
        </LinearLayout>
    </android.support.v7.widget.Toolbar>
</RelativeLayout>

Answer 3

您正在寻找的是所谓的导航抽屉。

我建议您访问 Android 文档

http://developer.android.com/training/implementing-navigation/nav-drawer.html

在这种情况下，您的代码将是

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

    <android.support.v7.widget.Toolbar
        android:id="@+id/my_awesome_toolbar"
        style="@style/MainTheme.ToolBar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

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

            <com.astuetz.RobottoRegularTextView
                android:id="@+id/toolbar_title"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:textColor="@android:color/white"
                android:textSize="20sp" />

            <com.astuetz.RobottoLightTextView
                android:id="@+id/toolbar_subtitle"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:singleLine="true"
                android:textColor="@android:color/white"
                android:textSize="@dimen/small_text"
                android:visibility="gone" />
        </LinearLayout>
    </android.support.v7.widget.Toolbar>

    <FrameLayout
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <LinearLayout android:id="@+id/left_drawer"
        android:layout_width="240dp"
        android:layout_height="match_parent"
        android:background="#fff"/>
</android.support.v4.widget.DrawerLayout>