I'm trying to use Collapsing Toolbar with Home/Up button. After toolbar collapses, there is an extra space between arrow and title text, which I'd like to get rid of. I attached two images, with and without layoutboundaries, to illustrate my point.
I searched StackOverflow and everywhere and tried
android:contentInsetStart="0dp"
in vain.
Here is my layout XML file.
<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:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="?colorPrimary"
app:elevation="4dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/colorPrimary"
app:collapsedTitleTextAppearance=
"#style/TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleTextAppearance=
"#style/TextAppearance.ExpandedTitle"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:title="Toolbar Title">
<ImageView
android:id="#+id/collapsing_toolbar_background"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="88dp"
android:contentDescription="#string/app_name"
android:scaleType="centerCrop"
android:src="#drawable/glider"
app:layout_collapseMode="parallax"
/>
<View
android:id="#+id/toolbar_title_scrim"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignBottom="#+id/collapsing_toolbar_background"
android:layout_gravity="bottom"
android:background="#android:color/holo_green_light"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="test text"
android:textColor="#android:color/white"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:contentInsetStart="0dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:layout_collapseMode="pin"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.SwipeRefreshLayout
android:id="#+id/swipe_refresh_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipToPadding="false"
android:paddingBottom="16dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:scrollbarStyle="outsideOverlay"/>
</android.support.v4.widget.SwipeRefreshLayout>
</android.support.design.widget.CoordinatorLayout>
It turned out that this is part of a new Material Design Specification introduced in version 24 of Design library.
https://material.google.com/patterns/navigation.html
However, it is possible to remove the extra space by adding the following property to Toolbar widget.
app:contentInsetStartWithNavigation="0dp"
Related
I have the following layout that has a collapsing toolbar with a LinearLayout inside -
<?xml version="1.0" encoding="utf-8"?>
<layout 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">
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".application_flow.group.GroupOverviewFragment">
<com.google.android.material.appbar.AppBarLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:elevation="10dp"
android:fitsSystemWindows="true"
android:stateListAnimator="#animator/show_toolbar">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:collapsedTitleGravity="center"
app:contentScrim="#color/colorPrimary"
app:expandedTitleGravity="top"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:title="Lohamei Galipoly 38"
app:titleEnabled="false"
app:toolbarId="#id/group_tasks_toolbar">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginStart="14dp"
android:layout_marginEnd="14dp"
android:orientation="vertical"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.6">
<androidx.appcompat.widget.Toolbar
android:id="#+id/group_tasks_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:contentInsetStartWithNavigation="0dp"
app:layout_collapseMode="pin"
app:navigationIcon="#drawable/left_arrow_white"
app:titleTextColor="#color/white" />
<Space
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="30dp"
android:textColor="#color/white"
android:textSize="18sp"
tools:text="Total group tasks: 8" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/group_tasks_tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabIndicatorColor="#color/white"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/white" />
</LinearLayout>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</com.google.android.material.appbar.AppBarLayout>
<androidx.viewpager2.widget.ViewPager2
android:id="#+id/group_tasks_viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="com.google.android.material.appbar.AppBarLayout$ScrollingViewBehavior" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</layout>
For some reason it does not collapse the entire content of the LinearLayout like it should and it is being left fixed in place.
This error seemed to start happening after I switched to work with the LinearLayout inside my CollapsingToolbarLayout
What is it that I am missing?
I think you are missing an actual toolbar inside the collapsing toolbar.
try adding a toolbar after the linear layout's closing tag.
example:
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/colorPrimaryLight"
android:theme="#style/ThemeOverlay.MaterialComponents.Dark.ActionBar"
app:layout_collapseMode="pin"
app:title="Toolbar title" />
and another thing I noticed, you AppBarLayout has android:fitsSystemWindows="true" so check that as well.
I want to implement the function shown below.
Before scrolling, there is an EditText at the bottom, a logo ImageView in the center, and a right Menu at the top.
During scrolling, the ImageView and the EditText disappear and the Menu remains.
After scrolling, the EditText is reduced to the appropriate size and the Menu is on the right.
However, in my current code, scrollFlag to scroll in CollapsingToolbarLayout does not clicked, nor does it shrink to the proper size.
Here is my Code.
<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=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:layout_height="260dp"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingStart="16dp"
android:paddingEnd="16dp"
android:fitsSystemWindows="true"
app:layout_collapseMode="pin">
<ImageView
android:id="#+id/logoImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="center"
android:src="#drawable/app_logo_150x30"
android:layout_centerInParent="true"/>
<EditText
android:id="#+id/searchButton"
android:layout_width="match_parent"
android:layout_height="40dp"
android:background="#FFFFFF"
android:hint="#string/menu_search"
android:textColorHint="#color/colorTextSecondary"
android:textColor="#color/colorText"
android:textSize="16sp"
android:inputType="text"
android:drawableEnd="#drawable/ic_search_24dp"
android:paddingEnd="12dp"
android:paddingStart="12dp"
android:layout_marginBottom="16dp"
android:layout_alignParentBottom="true"
android:focusable="false"
android:focusableInTouchMode="false"/>
</RelativeLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#android:color/transparent"
app:layout_collapseMode="pin"
app:contentInsetLeft="0dp"
app:contentInsetStart="0dp"
app:contentInsetRight="0dp"
app:contentInsetEnd="0dp"
android:paddingLeft="16dp"
android:paddingStart="16dp"
android:paddingRight="16dp"
android:paddingEnd="16dp">
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_main"/>
How do I make it work as an attached image?
Old post. But still if people looking for answers, just add app:layout_collapseMode="parallax" in imageview.
<ImageView
android:id="#+id/logoImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="center"
android:src="#drawable/app_logo_150x30"
app:layout_collapseMode="parallax"
android:layout_centerInParent="true"/>
Import the required settings. Hope it helps.
Background
The support/design library allows to have a nice resize-as-you-scroll effect, using AppBarLayout and CollapsingToolbarLayout :
http://material-design.storage.googleapis.com/publish/material_v_3/material_ext_publish/0B0NGgBg38lWWcFhaV1hiSlB4aFU/patterns-scrollingtech-scrolling-070801_Flexible_Space_xhdpi_003.webm
The problem
All examples I've seen are of Toolbar being the one pinned as you scroll.
What I'm trying to achieve is that a custom view will be pinned, in a size of a toolbar, while the content above it (some other views) will shrink as you scroll.
Something like that:
Thing is, no matter what I try, something doesn't work this way. Sometimes the content of the toolbar-replacement gets truncated, sometimes it doesn't get pinned, etc...
What I've tried
Since for some reason the Toolbar is the only thing that seems to work well with the app:layout_collapseMode="pin" attribute, I tried to either put views in it, or put views with it.
Here's the current XML layout of what I've tried:
<?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=".ScrollingActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
android:background="#fff"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:padding="0px"
app:contentScrim="#eeeeee"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/AppTheme.PopupOverlay"
app:title="">
</android.support.v7.widget.Toolbar>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom"
android:layout_marginBottom="0px"
android:background="#33ff0000"
android:gravity="center"
android:orientation="horizontal">
<TextView
android:id="#+id/titleTextView"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_gravity="bottom"
android:background="#33ffff00"
android:gravity="center"
android:text="someText"
android:textColor="#000"/>
</LinearLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_scrolling"/>
</android.support.design.widget.CoordinatorLayout>
Sadly, even though the layout editor shows that it looks ok, what I actually see is this truncated text for the toolbar-replacement view:
I also tried using layout_anchor, as shown on a sample of how to use it (here), but even then, the view that is supposed to replace the toolbar seems to overlap the content that's supposed to be below it and the one above it, and even the view that's above it have some space below it that isn't supposed to be there:
And here's the XML layout of this try:
<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.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#3300ff00"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="200dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<FrameLayout
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:orientation="vertical"
android:paddingBottom="?attr/actionBarSize"
app:layout_collapseMode="none">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:text="need to be right above 'someText'"
android:textColor="#ff000000"/>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scrollbars="none"
app:behavior_overlapTop="0dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lorem"/>
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#33ff0000"
app:layout_anchor="#id/title"
app:layout_anchorGravity="bottom"
app:theme="#style/ThemeOverlay.AppCompat.Dark"
app:title="">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:text="someText"
android:textColor="#android:color/white"
android:textSize="20sp"/>
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CoordinatorLayout>
The questions
How can I put custom views so that the toolbar content will stay between the bottom and upper areas, not overlapping any of them, and have the area above the toolbar to shrink as you scroll ?
For now, I'm using a workaround for this issue, by using padding that will prevent the overlapping of the views. I still don't get why the views overlap, but this helps against it.
The problem with this, is that now the toolbar doesn't have a shadow when I scroll enough so that it's the only thing that appears at the top.
Here's a sample XML layout, in case anyone wants to try:
<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.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#3300ff00"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:layout_width="match_parent"
android:layout_height="200dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<FrameLayout
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="bottom|center_horizontal"
android:orientation="vertical"
android:paddingBottom="24dp"
app:layout_collapseMode="none">
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_gravity="bottom"
android:background="#f00"/>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="24dp"
android:scrollbars="none"
app:behavior_overlapTop="0dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/lorem"/>
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="48dp"
android:background="#33ff0000"
app:layout_anchor="#id/title"
app:layout_anchorGravity="bottom"
app:theme="#style/ThemeOverlay.AppCompat.Dark"
app:title="">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:text="someText"
android:textColor="#android:color/white"
android:textSize="20sp"/>
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CoordinatorLayout>
i have created a activity with collapsing toolbar, but now i have added a bottom navigation view with 3 menu items in it.
but i noticed that, the content displayed in activity is hiding behind the bottom navigation view.
anyone having idea?
in short, the last some lines of my content layout are hiding behind bottom navigation view.
here is my xml 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"
xmlns:design="http://schemas.android.com/tools"
android:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginBottom="32dp"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="250dp"
android:src="#drawable/p1"
android:background="#color/colorPrimary"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/anim_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<TextView
android:id="#+id/toolbar_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:gravity="center"
android:singleLine="true"
android:textColor="#android:color/white"
android:textSize="18sp" />
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:clipToPadding="false"
android:id="#+id/scroll"
android:padding="16dp"
android:layout_gravity="fill_vertical"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
</android.support.v4.widget.NestedScrollView>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.design.widget.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:menu="#menu/bottom_menu"
android:id="#+id/bottomMenu"
android:layout_alignParentBottom="true"/>
</RelativeLayout>
</android.support.design.widget.CoordinatorLayout>
android:layout_above="#+id/navigationbottom"
Insert this line at your view
How can I make toolbar like at this photos:
This is first state
And this is second state
I use Collapse Toolbar with CalendarView. I use this library for CalendarView com.prolificinteractive:material-calendarview:1.0.1 And this is my xml code:
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/rootLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:id="#+id/appbar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="#dimen/expanded_toolbar_title_margin_start"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<com.prolificinteractive.materialcalendarview.MaterialCalendarView
android:id="#+id/calendarView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:mcv_showOtherDates="all"
app:mcv_selectionColor="#00F">
</com.prolificinteractive.materialcalendarview.MaterialCalendarView>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
android:background="#color/primary_color"
android:titleTextColor="#color/text_color"
android:minHeight="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/nickname_profile"
android:text="#string/nickname"
android:textColor="#color/text_color"
android:textSize="24sp"
android:layout_gravity="bottom|center"
android:layout_marginBottom="20dp"
android:layout_marginRight="40dp"
/>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/general_fragment"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
And second question: How can I open toolbar only on click without scroll?
Using CompactCalendarView Library This Guy made something Awsome. HopeFully, this helps you.