Навигационный ящик Ниже панели инструментов

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 так, чтобы панель навигации открывалась под панелью инструментов?

Answer 1

Вы должны переместить 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.

Answer 2

Вы должны просто добавить

android:layout_marginTop="@dimen/abc_action_bar_default_height_material" 

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

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

Answer 3

Вы можете добавить 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" /> 

но ящик будет отображаться как верхний слой на панели инструментов.

---

Здесь еще один Choppy способ добавить его ниже на панель инструментов !!!

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

конечный результат будет выглядеть следующим образом

Если создать проект как проект навигации 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 и установить его содержимое непосредственно на панели приложения main и используйте его в качестве основного макета для Activity.

Чтобы добавить ящик под панель инструментов , добавьте его под станцию ​​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> 

пс вы можете установить app_bar_main.XML к setContentView вашей деятельности просто играть вокруг есть много способов;)

Answer 4

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

<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" 

Answer 5

это мои макеты и отработаны: 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> 

результат: Панель пыльник

Answer 6

Легкий и хорошее решение устанавливается fitsSystemWindows=false для

android.support.v4.widget.DrawerLayout 

, который имеет идентификатор как

android:id="@+id/drawer_layout" 

И navigationView установить layout_marginTop как ?attr/actionBarSize что бы получить размер ActionBar и установить его в качестве маржи

Here is complete code of activity_main.xml, который имеет как перечисленные выше изменения.

Answer 7

<?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>