Навигационный Ящик Под Панелью Инструментов

Question

Навигационный Ящик Под Панелью Инструментов

Я пытаюсь открыть навигационный ящик под панелью инструментов.

<android.support.v4.widget.DrawerLayout
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:id="@+id/drawer_layout"
tools:context=".MainActivity">
<RelativeLayout
    android:layout_width = "match_parent"
    android:layout_height = "wrap_content">
    <include layout="@layout/toolbar"
        android:id="@+id/toolbar"/>
    <FrameLayout
        android:layout_below="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/background_color"/>
</RelativeLayout>
<ListView
    android:id="@+id/drawer"
    android:layout_width="260dp"
    android:layout_height="match_parent"
    android:layout_below="@+id/toolbar"
    android:layout_marginTop="56dp"
    android:layout_gravity="start">
</ListView>
</android.support.v4.widget.DrawerLayout>

как переформатировать xml, чтобы панель навигации открылась под панелью инструментов?

7 52

android navigation-drawer android-toolbar

7 ответов:

вы должны просто добавить
android:layout_marginTop="@dimen/abc_action_bar_default_height_material"
для вашего макета,который вы используете в качестве ящика.

это автоматически отрегулирует навигационный ящик под панелью инструментов, а также поддерживает различные размеры экрана.

22

вы можете добавить layout_marginTop как это
<android.support.design.widget.NavigationView
        android:layout_marginTop="@dimen/abc_action_bar_default_height_material"
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />
но ящик появится в качестве верхнего слоя на панели инструментов.

вот еще один изменчивый способ добавить его ниже на панель инструментов!!!

может быть, не самый лучший, но он работает!

конечный результат будет выглядеть так

если вы создаете проект в качестве проекта навигационного ящика (Navigation Drawer Activity) будет дайте вам четыре XML-файла при создании в вашем layout папку

app_bar_main

content_main

navigatin_main

activity_main

как эти xmls связаны? в основном я вижу include tag используется

ваша деятельность связана с activity_main

activity_main имеет app_bar_main и navigation_view(векселедатель)

app_bar_main имеет toolbar и content_main по умолчанию

теперь позволяет удалить activity_main и установить его содержимое непосредственно в app bar main и использовать его в качестве основного макета для деятельности.

чтобы добавить ящик под панель инструментов добавьте его под android.support.design.widget.AppBarLayout потому что это содержит панель инструментов и его должно быть на вершине.

вот пример app_bar_main.XML
      <?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context="none.navhead.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

    </android.support.design.widget.AppBarLayout>



    //------ taken from activity_main
    // content main
    <include layout="@layout/content_main" />

    // you need this padding
    <android.support.v4.widget.DrawerLayout
        android:paddingTop="?attr/actionBarSize"
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:openDrawer="start">

        <android.support.design.widget.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:fitsSystemWindows="true"
            app:headerLayout="@layout/nav_header_main"
            app:menu="@menu/activity_main_drawer" />

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


</android.support.design.widget.CoordinatorLayout>
p.s Вы можете установить app_bar_main.XML to setContentView вашей деятельности просто поиграйте есть много способов ;)

20

это мои макеты и работать идеально: activity_main:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!-- AppBarLayout should be here -->
    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:popupTheme="@style/AppTheme.PopupOverlay" />
    </android.support.design.widget.AppBarLayout>

    <!-- add app:layout_behavior="@string/appbar_scrolling_view_behavior" -->

    <android.support.v4.widget.DrawerLayout
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:openDrawer="start">

        <include
            layout="@layout/app_bar_main"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

        <android.support.design.widget.NavigationView
            android:id="@+id/nav_view"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_gravity="start"
            android:fitsSystemWindows="true"
            app:headerLayout="@layout/nav_header_main"
            app:menu="@menu/activity_main_drawer" />
    </android.support.v4.widget.DrawerLayout>
</android.support.design.widget.CoordinatorLayout>

app_bar_main.XML-код:

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:fitsSystemWindows="true"
  tools:context=".activty.MainActivity">
<include layout="@layout/content_main"/>
</FrameLayout>

результат: Ниже панель инструментов

6

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="false"
    tools:openDrawer="start">
    <include
        layout="@layout/app_bar_main"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    <android.support.design.widget.NavigationView
        android:layout_marginTop="?attr/actionBarSize"
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="false"
        app:menu="@menu/activity_main_drawer" />
</android.support.v4.widget.DrawerLayout>

3

Если вы используете пользовательскую панель инструментов, то используйте макет ящика таким образом..

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

    <!-- The toolbar -->
    <android.support.v7.widget.Toolbar  
        android:id="@+id/my_awesome_toolbar"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:minHeight="?attr/actionBarSize"
        android:background="?attr/colorPrimary" />

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

        <!-- drawer view -->
        <LinearLayout
            android:layout_width="304dp"
            android:layout_height="match_parent"
            android:layout_gravity="left|start">
            ....
        </LinearLayout>

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

</LinearLayout>

и если вы не используете пользовательскую панель инструментов, то вам нужно установить верхнюю часть поля в макет ящика..

android:layout_marginTop ="?android:attr/actionBarSize"

2

устанавливается простое и хорошее решение fitsSystemWindows=false на
android.support.v4.widget.DrawerLayout
, который имеет ID, как
android:id="@+id/drawer_layout"
и navigationView set layout_marginTop как ?attr/actionBarSize что бы получить размер панели действий и установить его как margin

здесь код на activity_main.xml это имеет оба изменения, перечисленные выше.

0

Nikola Despotoski · Accepted Answer · 2016-12-09 15:43:45

вы должны двигаться DrawerLayout как верхний родитель и двигаться Toolbar из DrawerLayout контейнер контента. Короче это выглядит так:

RelativeLayout
 ----Toolbar
 ----DrawerLayout
     ---ContentView
     ---DrawerList

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/top_parent"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:context=".MainActivity">

    <include
        android:id="@+id/toolbar"
        layout="@layout/toolbar" />

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

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

        <ListView
            android:id="@+id/drawer"
            android:layout_width="260dp"
            android:layout_height="match_parent"
            android:layout_below="@+id/toolbar"
            android:layout_gravity="start"
            android:layout_marginTop="56dp" />

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

однако в руководстве по проектированию материалов указано, что навигационный ящик должен быть выше Toolbar.