it-swarm.com.de

Navigationsleiste unterhalb der Symbolleiste

Ich versuche, die Navigationsleiste unterhalb der Symbolleiste zu öffnen.

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

Wie formatiere ich die XML-Datei so, dass die Navigationsleiste unterhalb der Symbolleiste geöffnet wird?

56
safaiyeh

Sie sollten DrawerLayout als übergeordnetes übergeordnetes Element verschieben und Toolbar aus dem DrawerLayout-Inhaltscontainer entfernen .

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>

In den Material Design-Richtlinien heißt es jedoch, dass sich die Navigationsleiste oberhalb der Toolbar befinden sollte.

111

Sie sollten einfach hinzufügen 

Android:layout_marginTop="@dimen/abc_action_bar_default_height_material"

zu Ihrem Layout, das Sie als Schublade verwenden.

Dadurch wird die Navigationsleiste unterhalb der Symbolleiste automatisch angepasst und es werden auch verschiedene Bildschirmgrößen unterstützt.

22
Muhammad Qasim

Sie können layout_marginTop so hinzufügen,

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

die Schublade wird jedoch als oberste Ebene der Werkzeugleiste angezeigt.


Hier ist eine weitere abgehackte Möglichkeit, es unten in die Symbolleiste einzufügen !!! 

vielleicht nicht das Beste, aber es funktioniert!

Endergebnis wird so aussehen 

 enter image description here

Wenn Sie ein Projekt als ein Navigation Drawer-Projekt (Navigation Drawer Activity) erstellen, erhalten Sie bei der Erstellung vier XML-Dateien in Ihrem layout-Ordner

  • app_bar_main
  • content_main
  • navigatin_main
  • activity_main

     enter image description here

wie sind diese xmls verknüpft? Meistens sehe ich, dass include tag verwendet wird

Ihre Aktivität ist mit activity_main verknüpft

  • activity_main hat den app_bar_main und navigation_view (Schublade) 
  • app_bar_main hat standardmäßig die toolbar und content_main

jetzt können Sie activity_main entfernen und den Inhalt direkt auf App-Leiste main setzen und als Hauptlayout für Activity verwenden.

Um die Schublade unter der Symbolleiste hinzuzufügen, fügen Sie sie unter dem Android.support.design.widget.AppBarLayout hinzu, da is die Symbolleiste enthält und die Symbolleiste oben angezeigt werden sollte.

hier ist ein Beispiel für 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 Sie können app_bar_main.XML auf setContentView Ihrer Aktivität einstellen einfach rumspielen gibt es viele möglichkeiten;)

20
Charuක

dies ist meine Layouts und Arbeit perfekt: 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>

ergebnis: Balg-Symbolleiste

 enter image description here

6
smaznet
<?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
Tarun Umath

Wenn Sie eine benutzerdefinierte Symbolleiste verwenden, verwenden Sie das Schubladenlayout auf diese Weise.

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

wenn Sie keine benutzerdefinierte Symbolleiste verwenden, müssen Sie den oberen Rand des Schubladenlayouts festlegen.

Android:layout_marginTop ="?android:attr/actionBarSize"
2
Avijit Karmakar

Eine einfache und gute Lösung ist fitsSystemWindows=false für festgelegt 

Android.support.v4.widget.DrawerLayout

das hat id als

Android:id="@+id/drawer_layout"

Und für navigationView setzen Sie layout_marginTop als ?attr/actionBarSize, um die Größe der Aktionsleiste zu erhalten und als Rand festzulegen

Hier ist vollständiger Code von activity_main.xml, der beide oben aufgeführten Änderungen enthält.

0