Develop Reference

fitsSystemWindows not working in Custom Layout within NavigationView

I have a custom View within the NavigationView. The problem is no matter in what combination, fitsSystemWindows is not working within the NavigationView. and the top item in the drawer always stays behind the transcludent statusbar.
main_layout
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
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:background="#color/colorPrimaryBottomBar"
android:fitsSystemWindows="true">
<include layout="#layout/navigation_main_drawer" />
</android.support.design.widget.NavigationView>
</android.support.v4.widget.DrawerLayout>
navigation_main_drawer
<?xml version="1.0" encoding="utf-8"?>
<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">
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:fillViewport="true"
android:fitsSystemWindows="true"
android:paddingBottom="#dimen/default_margin">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="#dimen/default_margin"
android:fitsSystemWindows="true"
android:orientation="vertical">
<LinearLayout
...
</LinearLayout>
<View
... />
<LinearLayout
...
</LinearLayout>
<View
... />
<LinearLayout
...
</LinearLayout>
<View
... />
</LinearLayout>
</ScrollView>
</android.support.design.widget.CoordinatorLayout>

So, if I've understood correctly, you want your custom view to get the necessary padding so that its contents are not clipped by the status bar right?
If that's the case then you need to set
android:fitsSystemWindows="true"
in your root DrawerLayout, and then set
android:fitsSystemWindows="false"
in your NavigationView component. Note that's false, not true :)
REASONING:
The new NavigationView component designed by Google uses the 'fitsSystemWindows' property to customize how its content relates to the status bar. Note that "customize" here is the key word, because the hardcoded behaviour for this particular component is that its contents should overlap the status bar and reach the top of the screen, while the status bar itself should be transparent to allow the drawer's content to be seen through it. This is specified as part of the new Material Design, as can be seen in https://material.io/guidelines/patterns/navigation-drawer.html.
So, the only way to disable this behaviour is to tell the NavigationView to not signal the fitsSystemWindow property, and only set this in the root DrawerLayout that contains all other views, which will do what you would expect and pad all its children views appropriately.
Note that this reasoning is confirmed also by this comment from Android developer Ian Lake in a blog post talking about this specific property.
P.S.
I would also remove all mentions to the 'fitsSystemWindows' property in all the child elements in your navigation_main_drawer XML, just in case, although it probably does have no effect whatsoever as it is..

Pressing button through fragment

I'm trying to create an application with fragment on the side as a menu bar.
My main problem is that when I open the fragment I can see the buttons behind it and even press them.
Of course I don't want that. I tried adding the property android:clickable="true" to the layout but it didn't help.
This is my code:
<RelativeLayout 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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context="ibuy.ibuy.AddUpdateItem">
.
.
.
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/search_image"
android:id="#+id/btnBrows"
android:onClick="openItemTable"
android:layout_alignTop="#+id/imageView"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
.
.
.
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="ibuy.ibuy.AddUpdateItem"
android:clickable="true">
<fragment
android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
android:name="Menus.smallMenu"
tools:layout="#layout/fragment_navigation_drawer"
android:alpha="255" />
</android.support.v4.widget.DrawerLayout>
</RelativeLayout>
This is the code of the listView of the fragment on other file:
<ListView
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:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#cccc"
tools:context="Menus.smallMenu"
android:clickable="true"/>
What am I doing wrong?
Thank you in advance!

I don't know what you meant by "I can see the buttons behind it". I assume you meant behind the DrawerLayout UI.
1)
In that case, you can use the attribute like android:layout_below="#id/btnBrows". As far as I know, all the UI elements should be positioned, otherwise they may be displayed one on top of another, like what you are seeing.
2) Also an issue is that both android:layout_width and layout_height of DrawerLayout is match_parent which fills up the whole screen. It competes screen space with the button. If the button is inside DrawerLayout, that would not be an issue but this might be your intentional design.

If you're into Android Studio, create a new Navigation Drawer Activity. Take a look at the main XML layout.
The DrawerLayout should be your root view. Inside it, you have the RelativeLayout with the buttons and the Fragment that is your navigation drawer.
That way, both are separated and the navigation drawer overlaps correctly when opened.

layout_weight not working with LinearLayout inside Drawerlayout

I'm struggling with LinearLayout when using DrawerLayout. This is using the Android Studio template for DrawerLayout:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MyActivity">
<!-- As the main content view, the view below consumes the entire
space available using match_parent in both dimensions. -->
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:background="#00f"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"/>
<LinearLayout
android:background="#f00"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0" />
</LinearLayout>
</LinearLayout>
<!-- android:layout_gravity="start" tells DrawerLayout to treat
this as a sliding drawer on the left side for left-to-right
languages and on the right side for right-to-left languages.
If you're not building against API 17 or higher, use
android:layout_gravity="left" instead. -->
<!-- The drawer is given a fixed width in dp and extends the full height of
the container. -->
<fragment android:id="#+id/navigation_drawer"
android:layout_width="#dimen/navigation_drawer_width"
android:layout_height="match_parent"
android:layout_gravity="start"
android:name="com.test.testdrawerlayout.NavigationDrawerFragment"
tools:layout="#layout/fragment_navigation_drawer" />
</android.support.v4.widget.DrawerLayout>
The preview in Android Studio shows this:
http://imgur.com/UlPGzJS
However, when running on my Nexus 5, the following shows:
http://imgur.com/w4QeGbB
As you can see, the layout_weight="1" part is not showing at all. When I create a blank project with the inner LinearLayout however, the layout works (with the blue layout taking most of the screen with the red layout at the bottom, just like the preview).
Any ideas would be really appreciated, as I'm completely stumped right now. Thanks in advance.

It appears I was using an older Android SDK platform. Once I went into SDK manager and installed API 19, it worked (with a new project).
Maybe it was a bug in an older implementation?

This is definitely an Android issue (or at least appcompat/design library issue). I've tested with different layouts inside the DrawerLayout, and concluded that the problem was "content_layout" file - the one that is displayed below the drawer.
Only using a clean, plain FrameLayout worked. No CoordinatorLayout, no fragments, no custom layouts nor 3rd-party layouts, just a good old FrameLayout with "match_parent" as width and height.

Inside the drawerlayout you should have a FrameLayout which contains the main content for your screen and you should also have a ListView in most cases to hold the contents of the navigation drawer.
It should be as such:
<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">
<!-- The main content view -->
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<!-- The navigation drawer -->
<ListView android:id="#+id/left_drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:background="#111"/>
</android.support.v4.widget.DrawerLayout>
Now place your LinearLayout within the FrameLayout. Think of the FrameLayout as the "container" that holds your main screen.
Note that the official Android documentations state that
The main content view (the FrameLayout above) must be the first
child in the DrawerLayout because the XML order implies
z-ordering and the drawer must be on top of the content.
For more reference and information, I would advise you check this link by clicking here.
Please mark this as the answer if it solved your problem. Thank you.
UPDATE:
Okay first, remove "xmlns:android="http://schemas.android.com/apk/res/android"" from your linearlayout. That should only appear once and in the main root xml, in this cause the DrawerLayout.
Next, fix how you are using your weights. Declare a android:weightSum attribute. Think of weightSum as a pie. In this case we set it too 5, so we have 5 pieces of the pie. Anything inside this layout using the android:layout_weight attribute. This first one is set to 4, which will take 4/5ths of the screen. The last one is 1/5th of the screen at the bottom.
Make sure this LinearLayout is still wrapped within the FrameLayout. Your LinearLayout should appear as such:
<LinearLayout
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:weightSum="5">
<LinearLayout
android:background="#00f"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="4"/>
<LinearLayout
android:background="#f00"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="0" />
</LinearLayout>
</LinearLayout>

Setting up layout with multiple fragments

I am currently working on an android project and I am trying to make use of fragments. I've got it mostly working, however, I can't get the layout right.
In the layout there should be a slide in navigation drawer from the left and a slide in navigation drawer from the right.
At the top of the activity there should be a fragment and underneath that another fragment. The top fragment being smaller than the below fragment.
Even though I have set the height for the fragment it is taking up the whole screen and both fragments are overlapping below. Below is an image which should hopefully highlight what I am trying to achieve.
Below is the XML for the FragmentActivity
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<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">
<fragment android:name="com.BoardiesITSolutions.MysqlManager.QueryEditor"
android:id="#+id/fragment_query_editor"
android:layout_width="match_parent"
android:layout_height="10dp"/>
<fragment android:name="com.BoardiesITSolutions.MysqlManager.MainContentFragment"
android:layout_width="fill_parent"
android:layout_height="100dp" />
<ListView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/left_drawer"
android:layout_width="280dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:paddingLeft="#dimen/list_padding"
android:paddingRight="#dimen/list_padding"
android:choiceMode="singleChoice"
android:divider="#4e4e4e"
android:dividerHeight="1dp"
android:background="#111" />
</android.support.v4.widget.DrawerLayout>
</RelativeLayout>
I've taken out the slide in nav menu from the right for the time being just while I get the basic layout correct
Below is the XML for the query editor fragment
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp"
android:orientation="vertical"
android:background="#c1c1c1c1" >
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="QUERY EDITOR"/>
</LinearLayout>
Thanks for any help you can provide

Your drawer layout should be the outermost parent. You should then have a layout with matchparent height and width that you can use to contain your inner UI fragments. The 2nd and 3rd layouts should be your slide in drawers with the relevant left and right layout_gravity set.
In summary, an outer drawer that contains 3 inner layouts.
Sorry I am on a tablet so can't show this for you but it is all explained here.
http://developer.android.com/reference/android/support/v4/widget/DrawerLayout.html

ScrollView in content of DrawerLayout prevents the drawer to be opened by swiping

When I put ScrollView into the content of a DrawerLayout, I am nolonger able to open the drawer by swiping from the side.
Activity layout:
<android.support.v4.widget.DrawerLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- The menu_main content view -->
<FrameLayout
android:id="#android:id/content"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<!-- The navigation drawer -->
<ListView
android:name="com.gumtree.androidapp.DrawerFragment"
android:id="#+id/drawer"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start" />
</android.support.v4.widget.DrawerLayout>
In Activity's onCreate I add a fragment which has following layout:
<ScrollView
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">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_height="160dp"
android:layout_width="match_parent"/>
<TextView
android:id="#+id/headline"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="#dimen/headline_text_size"
android:padding="#dimen/detail_text_padding"
android:textIsSelectable="false"/>
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="#dimen/description_text_size"
android:padding="#dimen/detail_text_padding"
android:textIsSelectable="false"/>
</LinearLayout>
</ScrollView>
Without the ScrollView everything works fine and I am able to open the drawer by swiping from the side. However when I add the ScrollView, it stops working.

The problem here was silly named ID of FrameLayout used as content container of DrawerLayout. I used system ID (android.R.id.content) which caused that the content fragment was put on the top of all other views - even the drawer.
It also caused fragment's layout to overlap the drawer and - related to this question - blocked the drawer from receiving touch events. The touch events were taken by fragment's ScrollView.
Conclusion: DO NOT USE SYSTEM IDs (android.R.*) WHERE IT IS NOT NEEDED.
I just wanted it to look nice and clean.. Silly me :)