gibs
gibs

Reputation: 117

Views overlapping with toolbar

I have a simple app with one Activity. Currently Views are overlapping with my toolbar:

Image of toolbar

I want Views to go under the toolbar, not into it. How do I do this?

activity_main.xml:

<?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="true"
    tools:openDrawer="start">

    <android.support.design.widget.CoordinatorLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true">

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

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

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

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="asdasdasdasd"/>

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

styles.xml: (note the windowDrawsSystemBarBackgrounds)

<resources>

    <style name="AppTheme.NoActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
        <item name="android:windowDrawsSystemBarBackgrounds">true</item>
        <item name="android:statusBarColor">@android:color/transparent</item>
    </style>
</resources>

Upvotes: 2

Views: 605

Answers (2)

Javanshir
Javanshir

Reputation: 792

Not the right way of using DrawerLayout. The first view should contain the content you want to show the user. Later you can add drawers. For your example, you can use the following:

<?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="true"
    tools:openDrawer="start">

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

  <android.support.design.widget.CoordinatorLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:fitsSystemWindows="true">

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

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

  <TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="asdasdasdasd"/>
</LinearLayout>

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

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

Upvotes: 3

OneCricketeer
OneCricketeer

Reputation: 191710

Put the textview inside the CoordinatorLayout after the toolbar. That's where the main content of the Activity goes. If you use the Android Studio template, it creates a content_main.xml file for you, and will include it there.

For example,

     <include layout="@layout/content_main" />

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

Of course, you can do the same without the include tag, or separate XML layouts, but it's cleaner file organization if you do.


Currently, you have the textview as part of the DrawerLayout and it will probably move over as you expand the NavigationView. Obviously, not what you want.

Upvotes: 0

Related Questions