Develop Reference

how to hide bottomnavigation and app bar on scroll when app bar inside FragmentContainerView

I know we can hide bottomnavigation and app bar on scroll when both are the direct children of coordinate layout, But my issue is different, I have one home fragment and bottom view is a part of this fragment with FragmentContainerView, now my app bar inside the fragment which i am setting in container view, when i am scrolling, app bar getting scroll properly but i am not sure how to scroll bottom navigation as well,
home_fragment:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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">
<androidx.fragment.app.FragmentContainerView
android:id="#+id/rootFragmentContainer"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/bottomNavigationView"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottomNavigationView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:itemIconTint="#drawable/nav_bar_tab_color"
android:background="?android:attr/windowBackground"
app:itemTextAppearanceActive="#style/navText"
app:itemTextAppearanceInactive="#style/navText"
app:itemTextColor="#drawable/nav_bar_tab_color"
app:labelVisibilityMode="unlabeled"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:menu="#menu/navigation_items" />
</androidx.constraintlayout.widget.ConstraintLayout>
another fragment:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
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:fitsSystemWindows="true">
<ProgressBar
android:id="#+id/progressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
/>
<androidx.constraintlayout.widget.ConstraintLayout
android:id="#+id/layout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/appbar"
app:layout_behavior="#string/appbar_scrolling_view_behavior" >
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rvLay"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#+id/rvProgressBar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<ProgressBar
android:id="#+id/rvProgressBar"
android:visibility="gone"
android:layout_width="0dp"
android:layout_height="50dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toTopOf="parent"
android:background="#color/colorWhite"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat" >
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="#dimen/twentyfour_24dp"
android:paddingBottom="#dimen/eighteen_18dp"
android:text="#string/t2"
android:gravity="center"
android:textAllCaps="true"
style="#style/text_16px_franklin_gothic_normal_" />
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Can some one please explain me, how to achieve it?

Have you tried to add app:layout_behavior="#string/hide_bottom_view_on_scroll_behavior" inside your BottomNavigationView? In my case, it works just fine :)
I also suggest you to use CoordinatorLayout instead of ConstraintLayout in your home_fragment.xml

BottomNavigationView is visible even if view is top of it

I have screen with 3 main parts
toolbar
homeContaner(will host fragments of BottomNavigationView)
mainContainer (host splash screen or any screen that take full of screen)
when replace mainContainer with splash BottomNavigationView is also shown
I tried to add background color to mainContainer and found that BottomNavigationView is on Top of mainContainer
also tried to add elevation to mainContainer but got no new results
Screen shots
full code
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".feature.home_Activity.HomeActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:titleTextColor="#android:color/white"/>
<FrameLayout
android:id="#+id/homeContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#id/dummy"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<View
android:id="#+id/dummy"
android:layout_width="match_parent"
android:layout_height="#dimen/_10sdp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/navigation" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:elevation="1dp"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/navigation" />
<FrameLayout
android:id="#+id/mainContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:elevation="10dp"
android:background="#ffaaff"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Wrap BottomNavigationView with LinearLayout solved the problem
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
tools:context=".feature.home_Activity.HomeActivity">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:layout_constraintTop_toTopOf="parent"
app:titleTextColor="#android:color/white" />
<FrameLayout
android:id="#+id/homeContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="#id/dummy"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<View
android:id="#+id/dummy"
android:layout_width="match_parent"
android:layout_height="#dimen/_10sdp"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="#id/navigationContainer" />
<androidx.appcompat.widget.LinearLayoutCompat
android:id="#+id/navigationContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/bn_bg"
app:elevation="1dp"
app:itemBackground="#drawable/bn_item__bg"
app:itemIconTint="#color/secondaryTextColor"
app:itemTextColor="#color/primaryTextColor"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/navigation" />
</androidx.appcompat.widget.LinearLayoutCompat>
<FrameLayout
android:id="#+id/mainContainer"
android:layout_width="0dp"
android:layout_height="0dp"
app:elevation="10dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Cannot see the end part of post in my recyclerview completely

This is the feed where I used recyclerview in home fragment to show posts but in it, I can't see the last post completely and if I add any textview below that still can't view it.
As shown in the image I can't see the like comment and share button of the last post
I tried putting the textview inside the swiperefreshlayout and out of it but still not working here is the code for fragment and activity:
Fragment :
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/light_grey">
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/pullToRefresh"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="?attr/actionBarSize"
/>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
<Space
android:layout_width="match_parent"
android:layout_height="30dp"
android:id="#+id/spppp"
android:layout_below="#+id/pullToRefresh"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/homeend"
android:layout_below="#id/spppp"
android:fontFamily="#font/nunito"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
Activity :
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/add_post_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:clickable="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.954"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.88"
app:srcCompat="#android:drawable/ic_input_add" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginStart="0dp"
android:layout_marginEnd="0dp"
android:background="?android:attr/windowBackground"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:menu="#menu/bottom_nav_menu" />
<fragment
android:id="#+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:defaultNavHost="true"
app:layout_constraintBottom_toTopOf="#id/nav_view"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:navGraph="#navigation/mobile_navigation" />
</androidx.constraintlayout.widget.ConstraintLayout>

I think the issue is in the activity layout. Your fragment takes up the width and height of the activity, but you're also displaying a bottom navigation view at the bottom, it might be hiding part of the fragment.
Try setting your fragment to fill up the activity, but also be on top of the bottom navigation bar. You're currently setting the fragment's height to match_parent, which is making its layout_constraintBottom_toTopOf="#id/nav_view" useless.
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.floatingactionbutton.FloatingActionButton />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/nav_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent" />
<fragment
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#id/nav_view"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

ConstraintLayout does not get constrained to bottom when lower subviwe gets hidden

I tried to make the title as descriptive as possible.
I have a ConstraintLayout with two LinearLayout children that have ScrollViews inside as there are a lot of stuff inside. Each child has a weight of 1. The layout has constraints to top of toolbar, bottom, left and right to parent and a margin to top. So basically, this layout acts as a bottom sheet that slides up and down.
Both sub-views (LinearLayouts-s) can be "expanded", in which case, the other sub-view changes its visibility to gone.
So what happens is when I expand one layout and hide another, for some reason, the whole layout's alignment stays to top of the parent, preserving the margin, but gets cut to the bottom, leaving an empty space. I want it to move to the bottom of the screen is such case. I have also added app:layout_constraintVertical_bias="1.0", which I thought would take care of it. But it does not work. I will attach pictures.
So what I am trying to achieve is to make the sheet to get aligned bottom all the time. Here is my code:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<include layout="#layout/merge_screen_container" />
</FrameLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/dim_56x"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar"
app:layout_constraintVertical_bias="1.0" />
</android.support.constraint.ConstraintLayout>

This should work. Please try.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<include layout="#layout/merge_screen_container" />
</FrameLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<android.support.constraint.ConstraintLayout
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar"
app:layout_constraintVertical_bias="1.0" >
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/dim_56x"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
/>
</android.support.constraint.ConstraintLayout>
</android.support.constraint.ConstraintLayout>

Try this
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<FrameLayout
android:id="#+id/content"
android:layout_width="0dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar">
<include layout="#layout/merge_screen_container" />
</FrameLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="0dp"
android:layout_height="0dp"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/dim_56x"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/toolbar" />
</android.support.constraint.ConstraintLayout>

So, the answer from #Arti Patel kinda worked, but the filter view would still go beyond toolbar. I ended up using LinearLayout and FrameLayout.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?ord_canvas_secondary_color"
android:orientation="vertical">
<include
android:id="#+id/toolbar"
layout="#layout/toolbar" />
<include layout="#layout/merge_screen_container" />
</LinearLayout>
<View
android:id="#+id/dim_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0.5"
android:background="#color/ord_black"
android:clickable="true"
android:focusable="true"
android:visibility="gone" />
<FilterSheet
android:id="#+id/subscriptions_filter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginStart="#dimen/dim_8x"
android:layout_marginTop="#dimen/filter_margin_top"
android:layout_marginEnd="#dimen/dim_8x"
android:layout_marginBottom="#dimen/dim_8x"
android:visibility="invisible" />
</FrameLayout>

Add constraints to <include> inside ConstraintLayout

Please take a look at my xml:
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize">
<RelativeLayout
android:id="#+id/layout_info"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/colorPrimaryDark"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<include
layout="#layout/page"
android:layout_width="match_parent"
android:layout_height="0dp"/>
</android.support.constraint.ConstraintLayout>
I'm not able to add constraint to the <include>. The app namespace doesn't work (it works for the RelativeLayout) and auto fill doesn't show the constraint attributes. I want the included layout's height to be the remaining space in the ConstraintLayout, but how do I do it without constraints! Please help.

Try this
<android.support.constraint.ConstraintLayout
android:id="#+id/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize">
<RelativeLayout
android:id="#+id/layout_info"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/colorPrimaryDark"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<include
layout="#layout/page"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
</android.support.constraint.ConstraintLayout>

<include layout="#layout/layout_no_friends_avalable"
android:id="#+id/inc_no_friend"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintTop_toBottomOf="#+id/toolbar_main"
/>
When adding constraints in <include> tag we must use android:layout_width and android:layout_height both attributes.

try this:
<android.support.constraint.ConstraintLayout
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/constraintLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="?attr/actionBarSize">
<RelativeLayout
android:id="#+id/layout_info"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/colorPrimaryDark"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
/>
<include
layout="#layout/page"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>