Develop Reference

How to make the whole page scrollable that contains a GridView?

I have a Page that contains a navigationDrawer, imageView, two flipperView and a gridView. Earlier only the gridView was scrollable so to make the whole page scrollable I put all the views in a nestedScrollView but now even the gridView is unscrollable. And also the first flipperView doesn't show any flippers, just the plain blue background view is displayed.
<?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:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/drawerLayout"
android:nestedScrollingEnabled="true"
tools:context="com.example.xxx.xxx.MainActivity"
app:layout_behavior="android.support.design.widget.AppBarLayout.ScrollingViewBehaviour">
<android.support.design.widget.NavigationView
android:id="#+id/navView"
android:layout_width="200dp"
android:layout_height="match_parent"
app:menu="#menu/navigation_menu"
android:layout_gravity="start"
app:layout_behavior="android.support.design.widget.AppBarLayout.ScrollingViewBehaviour"
android:alpha="0.4"/>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:overScrollMode="never"
android:clipToPadding="false">
<LinearLayout
android:orientation="vertical"
android:background="#0F0F0F"
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:fitsSystemWindows="true"
android:layout_height="match_parent"
tools:context="com.example.xxxx.myapplication.MainActivity"
android:isScrollContainer="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="75dp"
android:background="#ff77"
android:layout_marginTop="5dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/banner1"
android:src="#drawable/b1"
android:scaleType="fitXY"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="75dp"
android:background="#2252FF"
android:id="#+id/rel1"
android:layout_marginTop="5dp">
<technolifestyle.com.imageslider.FlipperLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/flipper1">
</technolifestyle.com.imageslider.FlipperLayout>
</RelativeLayout>
<RelativeLayout
android:layout_marginTop="5dp"
android:id="#+id/rel2"
android:layout_width="match_parent"
android:layout_height="75dp"
android:background="#2252FF">
<technolifestyle.com.imageslider.FlipperLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/Flipper2">
</technolifestyle.com.imageslider.FlipperLayout>
</RelativeLayout>
<RelativeLayout
android:background="#fff090"
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">
<GridView
android:id="#+id/grid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#0f0f0f"
android:numColumns="3"
android:padding="2dp"
android:gravity="center"
android:horizontalSpacing="2dp"
android:stretchMode="columnWidth"
android:verticalSpacing="2dp">
</GridView>
</RelativeLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.v4.widget.DrawerLayout>

ListViews have its own scrollable behaviour. You need to cancel to add this to the GridView and maybe to de FliperLayouts as well.
android:nestedScrollingEnabled="false"
Or by code:
gridView.setNestedScrollingEnabled(false);
Hope it helps!

How to implement ScrollView in XML with ViewPager and ListView?

When I open the app only the ListView scroll but the sliding image I made didn't scroll up together.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
</android.support.v4.view.ViewPager>
<ListView
android:id="#+id/oneListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:layout_marginTop="261dp" />
</RelativeLayout>
If put the ScrollView within the upper part of ViewPager my app crashed.
screenshot

Using NestedScrollView might work for you. You can use the following code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/test">
<android.support.v4.view.ViewPager
android:id="#+id/view_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true">
</android.support.v4.view.ViewPager>
<android.support.v7.widget.RecyclerView
android:id="#+id/oneListView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/view_pager">
</android.support.v7.widget.RecyclerView>
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>

How to place navigation drawers header below statusbar?

I want my header of my Navigation drawer to be below the statusbar. When searching for solutions, every result is about how to place it under the status bar. I have of course tried to "reverse" theese solutions to place the header below. But it hasn't worked and I'm testing it on a Samsung Galaxy S7 API 23
Right now it looks like this:
This is my layout containing DrawerLayout, NavigationView:
<?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:background="#00ffff"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
android:id="#+id/toolbar_drawer_layout"
layout="#layout/navdrawer_toolbar"
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/arion_darkgray"
android:fitsSystemWindows="true"
app:headerLayout="#layout/navdrawer_header"
app:itemBackground="#drawable/nav_drawer_selector"
app:itemIconTint="#fff"
app:itemTextColor="#fff"
app:menu="#menu/navdrawer_menu"
app:theme="#style/custom_navDrawer_style" />
</android.support.v4.widget.DrawerLayout>
Toolbar layout:
<?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=".MyHorseActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/myhorse_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/arion_darkblue">
<RelativeLayout
android:id="#+id/myhorse_toolbar_innerlayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:paddingRight="70dp"
android:text="My Horse"
android:textColor="#fff"
android:textSize="24sp" />
<ImageView
android:backgroundTint="#ff0000"
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:layout_marginRight="10dp"
android:background="#drawable/circle_shape" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<include
layout="#layout/divider_lightblue"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_alignParentBottom="true">
</include>
</android.support.design.widget.AppBarLayout>
<include
android:id="#+id/activity"
layout="#layout/myhorse_activity_" />
Much of this is auto generated by Android Studio after I created my NavigationDrawer Class from the wizard

You have not put your xml fully so I don't know whats wrong with your xml but if you want your navigation drawer below action bar then put your drawerlayout below your toolbar as follows
<?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="match_parent"
android:orientation="vertical">
<!--Start of the Toolbar and its items -->
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center" />
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"></LinearLayout>
<!--Used for displaying Navigation Drawer slide-->
<LinearLayout
android:id="#+id/navigation_drawer"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:orientation="vertical">
<FrameLayout
android:id="#+id/navigation_container"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
According to your edited question drawerlayout xml would be like
<?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="match_parent"
android:orientation="vertical">
<include
android:id="#+id/toolbar_drawer_layout"
layout="#layout/navdrawer_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<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:background="#00ffff"
android:fitsSystemWindows="true"
tools:openDrawer="start">
<include
android:id="#+id/activity"
layout="#layout/myhorse_activity_" />
<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/arion_darkgray"
android:fitsSystemWindows="true"
app:headerLayout="#layout/navdrawer_header"
app:itemBackground="#drawable/nav_drawer_selector"
app:itemIconTint="#fff"
app:itemTextColor="#fff"
app:menu="#menu/navdrawer_menu"
app:theme="#style/custom_navDrawer_style" />
</android.support.v4.widget.DrawerLayout>
</LinearLayout>
and toolbar layout will be like
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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:fitsSystemWindows="true"
tools:context=".MyHorseActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/myhorse_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/arion_darkblue">
<RelativeLayout
android:id="#+id/myhorse_toolbar_innerlayout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:paddingRight="70dp"
android:text="My Horse"
android:textColor="#fff"
android:textSize="24sp" />
<ImageView
android:layout_width="15dp"
android:layout_height="15dp"
android:layout_alignParentRight="true"
android:layout_centerInParent="true"
android:layout_marginRight="10dp"
android:background="#drawable/circle_shape"
android:backgroundTint="#ff0000" />
</RelativeLayout>
</android.support.v7.widget.Toolbar>
<include
layout="#layout/divider_lightblue"
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_alignParentBottom="true" />
</android.support.design.widget.AppBarLayout>
</android.support.design.widget.CoordinatorLayout>

I used the xml file below to achieve what you asked. But this way, the drawer opens below both the "status bar" and the "toolbar"
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:orientation="vertical"
android:layout_height="match_parent"
tools:context=".MainActivity">
<include xmlns:android="http://schemas.android.com/apk/res/android" layout="#layout/toolbar" />
<android.support.v4.widget.DrawerLayout
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/drawerLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity"
android:elevation="5dp">
<FrameLayout
android:id = "#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
</FrameLayout>
<ListView
android:background="#ffffff"
android:id = "#+id/drawerList"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="left"
android:elevation="5dp"></ListView>
</android.support.v4.widget.DrawerLayout>
</LinearLayout>

CoordinatorLayout adds space between AppBarLayout and RecyclerView

CoordinatorLayout adds space between AppBarLayout and RecyclerView. Not sure whether its the Toolbar or AppBarLayout.
Screenshot of the rendered layout on phone:
The design rendering on Studio doesn't how this space.
Any idea on what's going on?
The Code Itself.
<?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:id="#+id/activity_home_framelayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
>
<android.support.v4.widget.DrawerLayout
android:id="#+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true"
>
<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:id="#+id/activity_home_coordinator"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".ActivitySignIn">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay"
app:elevation="0dp"
>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimary"
android:theme="#style/OTGToolbarTheme"
>
<TextView
android:id="#+id/toolbar_title"
style="#style/textTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="You are logged in"
android:textColor="#color/colorAccent"/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/activity_home_articlecontainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="start"
android:layout_marginTop="0dp"
android:background="#color/colorPrimary"
android:clipToPadding="false"
android:paddingTop="0dp"
app:behavior_overlapTop="?attr/actionBarSize"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
/>
</android.support.design.widget.CoordinatorLayout>
<android.support.v7.widget.RecyclerView
android:id="#+id/NavigationDrawer"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#color/colorPrimary"
android:scrollbars="vertical"
/>
</android.support.v4.widget.DrawerLayout>
<FrameLayout
android:id="#+id/activity_home_overlay"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clickable="true"
android:visibility="gone">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/tlgray0"
android:orientation="vertical"/>
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:indeterminate="true"/>
</FrameLayout>
</FrameLayout>

Remove below line from your first Recycler View which id is activity_home_articlecontainer
android:layout_gravity="start"

Unintentionally Overlapping Android Views

My xml file uses the android DrawerLayout. It shows the Toolbar and RecyclerView upon opening the app which is what I want, but when I open the drawer and click an option, the RecyclerView and fragment that was clicked are overlapping.
My code
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:id="#+id/profileDrawer"
android:layout_height="match_parent" >
<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.support.v7.widget.Toolbar
android:id="#+id/robot_chooser_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/content_frame2">
<android.support.v7.widget.RecyclerView
android:id="#+id/robot_recycler_view"
android:paddingTop="5dp"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<TextView
android:id="#+id/robot_empty_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:textSize="20sp"
android:text="#string/no_robots"
android:elevation="3dp"
android:layout_gravity="center"
android:visibility="gone"
android:gravity="center" />
</FrameLayout>
</LinearLayout>
<ListView
android:id="#+id/left_drawer2"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#eee"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:listSelector="#android:color/darker_gray" />
</android.support.v4.widget.DrawerLayout>
[IMG]http://i63.tinypic.com/157fbps.png[/IMG]
I'm bringing the fragment to the front using this line in my main activity
fragmentManager.beginTransaction().replace(R.id.content_frame2, fragment).commit();

Your problem is that the activity has multiple containers:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/content_frame2">
<android.support.v7.widget.RecyclerView
android:id="#+id/robot_recycler_view"
android:paddingTop="5dp"
android:scrollbars="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<TextView
android:id="#+id/robot_empty_view"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:textSize="20sp"
android:text="#string/no_robots"
android:elevation="3dp"
android:layout_gravity="center"
android:visibility="gone"
android:gravity="center" />
</FrameLayout>
You are loading your fragment in the FrameLayout, but you still have the RecyclerView. You should only have a FrameLayout in the activity XML, and your fragment will load the RecyclerView, TextView or whatever you want in there. As it is now, you seem to be loading your fragment in the FrameLayout, while leaving the RecyclerView in place, which causes the overlap.
Your layout should be like this:
<?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/profileDrawer"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.Toolbar
android:id="#+id/robot_chooser_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="#style/ThemeOverlay.AppCompat.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<FrameLayout
android:id="#+id/content_frame2"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
<ListView
android:id="#+id/left_drawer2"
android:layout_width="240dp"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#eee"
android:choiceMode="singleChoice"
android:divider="#android:color/transparent"
android:dividerHeight="0dp"
android:listSelector="#android:color/darker_gray" />
</android.support.v4.widget.DrawerLayout>