Develop Reference

Title in CollapsingToolbarLayout truncates on SearchView open

Whenever I open a SearchView within a CollapsingToolbarLayout, the page title gets squashed and truncated to 1 side for some reason rather than being positioned underneath the SearchView widget. Is there a way to prevent this from happening?
Main layout
<?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:id="#+id/myCoordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/collapsing_toolbar" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/myRecyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:scrollbarStyle="outsideInset"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/myFab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:src="#drawable/ic_search"
android:contentDescription="#string/string_search"
android:layout_margin="16dp" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Collapsing toolbar layout
<?xml version="1.0" encoding="utf-8"?>
<com.google.android.material.appbar.AppBarLayout
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="wrap_content"
android:id="#+id/myAppBarLayout">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/myCollapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="250dp"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|snap|exitUntilCollapsed"
app:maxLines="3">
<androidx.appcompat.widget.Toolbar
android:id="#+id/myToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:contentInsetStartWithNavigation="0dp"
app:layout_collapseMode="pin" />
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>

Your CollapsingToolbarLayout was covered by your RecyclerView, try to change the Main layout

How to hide toolbar when scrolling while also excluding bottom banner adview from this behavior?

My main activity has toolbar and tablayout under it. And the recyclerview content under them is created by a fragment. I want to hide the toolbar and tablayout when scrolling to open up space. So I've added app:layout_scrollFlags="scroll|enterAlways" to their xml. But the problem is I've banner adview at the bottom of the fragment and when I apply this scrolling behaviour, the banner is also showing the same behaviour. It is hidden when fragment is created and appears only when scrolled up and disappears when scrolled down. I want to exclude banner adview from this behaviour and keep it fixed at the bottom. I've looked at other questions but couldn't find an answer.
This is my Main Activity xml:
<androidx.coordinatorlayout.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"
tools:context=".activities.MainActivity">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/AppTheme.AppBarOverlay">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/AppTheme.PopupOverlay" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|enterAlways"
app:tabMode="scrollable"
app:tabIndicatorColor="#android:color/white">
</com.google.android.material.tabs.TabLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior">
</androidx.viewpager.widget.ViewPager>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
This is the fragment's xml
<RelativeLayout
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=".activities.MainActivity">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/bannerAdView">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/rv_tops"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"/>
<ProgressBar
android:id="#+id/pb_top_fragment"
android:layout_height="42dp"
android:layout_width="42dp"
android:layout_gravity="center"
style="#style/Widget.AppCompat.ProgressBar"/>
</FrameLayout>
<com.google.android.gms.ads.AdView
xmlns:ads="http://schemas.android.com/apk/res-auto"
android:id="#+id/bannerAdView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
ads:adSize="SMART_BANNER">
</com.google.android.gms.ads.AdView>
</RelativeLayout>

The fragment getting cut by view pagger layout

First, I want to make a tablayout fragment, and in fragment One i want to add recycler view , but the top of recyclerview getting cut by view pagger or tab layout at the top.
getting cut at the top
The top of the recyclerview getting cut by view pagger. The toolbar is separated in other xml
this is fragmentOne.xml
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
tools:context="com.example.yehezkiel.eclassapp.OneFragment">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<include
layout="#layout/navbar_action"
android:layout_width="match_parent"
android:layout_height="wrap_content"></include>
<ProgressBar
android:id="#+id/progressBar2"
style="?android:attr/progressBarStyle"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_horizontal"
android:visibility="visible"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="304dp" />
<android.support.v7.widget.RecyclerView
android:id="#+id/MainRView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginBottom="2dp"
android:layout_marginEnd="6dp"
android:layout_marginStart="6dp"
android:layout_marginTop="2dp"
android:clipToPadding="false"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="#layout/activity_tablayout"
app:layout_constraintTop_toTopOf="#layout/activity_tablayout">
</android.support.v7.widget.RecyclerView>
</LinearLayout>
</FrameLayout>
and this is the activity_tablayout.xml
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.yehezkiel.eclassapp.tablayoutActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar3"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:tabGravity="fill"
app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</android.support.constraint.ConstraintLayout>
I already tried code below, or change the orientation. But its still going wrong, please someone help me

This is because you are using CoordinatorLayout with ListView. You can change your implementation to RecyclerView to achieve correct scroll.
or If you are tagetting above 5.0, you can use the following piece of code
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
listView.setNestedScrollingEnabled(true);}
I think CoordinatorLayout only works with the children of NestedScrollingChild.

Try replacing the ContraintLayout with the CoordinatorLayout in your activity_tablayout.xml
Check this out for the source code with an example.
Also check out this video
https://www.youtube.com/watch?v=DyyNxJtYTBc
Hope this helps.

You convert your CoordinatorLayout to LinearLayout and set orientation "vertical", like this. I think this will solve your issue.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context="com.example.yehezkiel.eclassapp.tablayoutActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar3"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:tabGravity="fill"
app:tabMode="fixed" />
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>

CoordinatorLayout with Framelayout is no working

I use tabLayout with three tabs in viewPager , i want to use CoordinatorLayout to hide and show my toolbar when scrolling. It's no working when i try it.
MainActivity layout: I had add app:layout_behavior="#string/appbar_scrolling_view_behavior" in my Framelayout , it's no working.
<?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"
tools:context="tw.idv.morton.mydailysugar.MainActivity">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#+id/toolBar"
app:contentInsetStart="0dp"
android:layout_width="match_parent"
android:layout_height="35dp"></android.support.v7.widget.Toolbar>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:id="#+id/frameLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"></FrameLayout>
</android.support.design.widget.CoordinatorLayout>
My tab one layout: I try to change ScrollView to android.support.v4.widget.NestedScrollView , it's still no working.
<LinearLayout 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:card_view="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:paddingLeft="#dimen/appPadding"
android:paddingRight="#dimen/appPadding"
android:paddingTop="#dimen/appPadding"
android:background="#ffffff"
tools:context=".MyTabs.MyDailyInput">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
// here is lots of button and text and layout...
</ScrollView>
</LinearLayout>
Here is my tab layout setting:
<LinearLayout 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:orientation="vertical"
tools:context=".MyTabs.HomeTabs">
<tw.idv.morton.mydailysugar.MyTabs.NoSwipingViewPager
android:id="#+id/viewPagerDataReport"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<View
android:background="#android:color/darker_gray"
android:layout_width="match_parent"
android:layout_height="1dp"/>
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="55dp"
android:clickable="true"
style="#style/AppTabLayout"
app:tabTextAppearance="#style/AppTabTextAppearance"
android:background="#color/appColor"
app:tabTextColor="#android:color/white"
app:tabGravity="fill"/>
</LinearLayout>
I had add like app:layout_behavior="#string/appbar_scrolling_view_behavior" and android.support.v4.widget.NestedScrollView why its still no working ?
Any help would be appreciated . Thanks in advance.

That's because you haven't set the scroll flags in toolbar. Use the following code for your toolbar
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"/>
Further read more about scroll techniques here
https://github.com/codepath/android_guides/wiki/Handling-Scrolls-with-CoordinatorLayout

How to use Custom Toolbar in entire app

I have made Toolbar using coordinate toolbar in my app so that i can hide toolbar while scrolling . I also have ViewPager inside it . So when user scroll only Toolbar hides and tabs stick to the top . But in other activity i just want to display toolbar what is the better way to that ?
I am sharing my coordinator layout below
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.AppBarLayout
android:id="#+id/AppBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/orange"
app:layout_scrollFlags="scroll|enterAlways"
app:titleTextColor="#color/white">
</android.support.v7.widget.Toolbar>
<android.support.design.widget.TabLayout
android:id="#+id/MyTabLayout"
style="#style/TabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
app:tabTextAppearance="#style/AppTabTextAppearance">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/MyViewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/MyTabLayout"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
></android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>

Create a separate layout for toolbar only.
toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="70dp"
android:background="#color/white"
app:layout_scrollFlags="scroll|enterAlways"
app:titleTextColor="#color/white">
</android.support.v7.widget.Toolbar>
Then now its in anywhere in your 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"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/AppBarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include
layout="#layout/toolbar"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
<android.support.design.widget.TabLayout
android:id="#+id/MyTabLayout"
style="#style/TabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
app:tabTextAppearance="#style/AppTabTextAppearance">
</android.support.design.widget.TabLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:id="#+id/MyViewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/MyTabLayout"
app:layout_behavior="#string/appbar_scrolling_view_behavior"></android.support.v4.view.ViewPager>
</android.support.design.widget.CoordinatorLayout>

If you just want to display Toolbar inside other Activities, you can add the Toolbar to any root layout of the respective Activity like LinearLayout or RelativeLayout (which ever suits your app's needs).