I have a CoordinatorLayout, inside of it: AppBarLayout, CollapsingToolbarLayout (ImageView and toolbar), and NestedScrollView.
Inside NestedScrollView I have HorizontalScrollView. When I horizontally scroll the HorizontallScrollView my NestedScrollView catches the input as vertical scroll and only once on four times the horizontal scroll works fine. How can I resolve it?
I've got no problems with normal ScrollView.
Here is my XML code:
<?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:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="230dp"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
>
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/main.collapsing"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
>
<ImageView
android:id="#+id/main.backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:scaleType="centerCrop"
android:src="#drawable/test_primi"
app:layout_collapseMode="parallax"
/>
<android.support.v7.widget.Toolbar
android:id="#+id/main.toolbar"
android:layout_width="match_parent"
android:layout_height="120dp"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
/>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed"
>
<LinearLayout
android:id="#+id/linear_layout_titolo_toolbar_primi"
android:layout_width="match_parent"
android:layout_height="56dp"
android:orientation="horizontal"
app:layout_scrollFlags="scroll|enterAlwaysCollapsed"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="center"
android:onClick="backToRicette"
android:padding="8dp"
android:src="#drawable/icona_freccia_back_bianca"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="18dp"
android:fontFamily="#font/roboto_medium"
android:gravity="start|center"
android:text="Primi"
android:textColor="#color/titoliToolbar"
android:textSize="#dimen/dimensioneTitoliToolbar"
/>
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_below="#id/linear_layout_titolo_toolbar_primi"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:background="#drawable/background_layout_bordi_radius"
android:elevation="2dp"
>
<ImageView
android:id="#+id/icona_search_action_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="11dp"
android:src="#drawable/ic_search_black_96"
/>
<EditText
android:id="#+id/edit_text_cerca_ricette"
android:layout_width="wrap_content"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:background="#android:color/transparent"
android:ems="10"
android:fontFamily="#font/roboto_medium"
android:hint="Cerca"
android:inputType="textPersonName"
android:paddingLeft="8dp"
android:textColor="#color/corpoText"
android:textColorHint="#color/hintText"
android:textSize="20dp"
/>
</RelativeLayout>
</RelativeLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nested_scroll_view_ricette_primi"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:addStatesFromChildren="false"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/body"
android:orientation="vertical"
>
<LinearLayout
android:id="#+id/linear_layout_ricette_top_10"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="12dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="8dp"
android:layout_marginTop="8dp"
android:background="#drawable/background_layout_bordi_radius"
android:elevation="2dp"
android:orientation="vertical"
>
<TextView
android:id="#+id/text_view_top_10_ricette"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:layout_marginLeft="8dp"
android:layout_marginTop="8dp"
android:fontFamily="#font/roboto_medium"
android:text="Top 10 Primi"
android:textColor="#color/titoli"
android:textSize="#dimen/dimensioneTitoli"
/>
<HorizontalScrollView
android:id="#+id/horizontal_scroll_view_top_10_ricette"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:nestedScrollingEnabled="false"
android:paddingBottom="8dp"
android:paddingTop="8dp"
android:scrollbarAlwaysDrawVerticalTrack="false"
android:scrollbars="none"
>
<!-- Here is an horizontal linear layout with 10 images. -->
</HorizontalScrollView>
</LinearLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
Related
In my activity XML I have a Collapsing toolbar and, after that, an referring to my other XML where I have a NestedScrollView.
This is an image of the collapsing toolbar when it is NOT collapsed.
When I scroll up, it becomes collapsed and the NestedSrollView appears like this:
I want it to scroll just to some point like this and after that the user cannot scroll more:
How can I achieve this?
This is my main XML:
<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/relLayoutCountryInfo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
app:layout_anchor="#+id/testeparadetail"
app:layout_anchorGravity="bottom">
<android.support.design.widget.AppBarLayout
android:id="#+id/testeparadetail"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="?attr/actionBarDivider"
app:layout_anchor="#+id/testeparadetail"
app:layout_anchorGravity="bottom">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/backgroundcollapsedtoolbardetail"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="exitUntilCollapsed|scroll">
<ImageView
android:id="#+id/imgPhotoDetailFundo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop" />
<ImageView
android:id="#+id/imgPhotoDetailEscuro"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:adjustViewBounds="true"
android:background="#drawable/background_pais_info"
android:scaleType="centerInside" />
<ImageView
android:id="#+id/imgEscuroPhotoDetailTopo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:cropToPadding="false"
android:scaleX="2"
android:scaleY="-1"
app:srcCompat="#drawable/blur_paises_filtro" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbariddetail"
android:layout_width="match_parent"
android:layout_height="200dp"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
</android.support.v7.widget.Toolbar>
<com.github.mmin18.widget.RealtimeBlurView
android:id="#+id/blurViewDetail"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:realtimeBlurRadius="10dp"
app:realtimeOverlayColor="#8000" />
<TextView
android:id="#+id/txtNomePaisDetail"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginStart="30dp"
android:layout_marginTop="520dp"
android:paddingBottom="40dp"
android:text="TextView"
android:textColor="#android:color/background_light"
android:textSize="35sp"
app:layout_anchor="#+id/txtNomeContinente"
app:layout_anchorGravity="left|bottom" />
<TextView
android:id="#+id/txtDefinicao"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:layout_marginStart="30dp"
android:layout_marginTop="520dp"
android:paddingBottom="10dp"
android:text="TextView"
android:textColor="#android:color/background_light"
android:textSize="25sp"
app:layout_anchor="#+id/testeparainfo"
app:layout_anchorGravity="left|bottom" />
<ImageView
android:id="#+id/imgVoltarPhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="20dp"
android:layout_marginTop="20dp"
app:srcCompat="#drawable/arrow_back_branca" />
<ImageView
android:id="#+id/imgApagarPhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="355dp"
android:layout_marginTop="550dp"
android:paddingBottom="40dp"
app:layout_anchor="#+id/txtDefinicao"
app:layout_anchorGravity="right|bottom"
app:srcCompat="#android:drawable/ic_menu_delete" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include
layout="#layout/content_scrolling_photo_detail"
/>
And this is my include
<android.support.v4.widget.NestedScrollView 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="fill_parent"
android:layout_height="wrap_content"
android:paddingTop="30dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
Add this line to NestedScrollView Child... See my below code as an example...
android:nestedScrollingEnabled="true"
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.view.ViewPager
android:id="#+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/tablayout"
android:layout_marginTop="2dp"
android:nestedScrollingEnabled="true"/> // add this line to NestedScrollView child
</android.support.v4.widget.NestedScrollView>
I'm trying to implement the CoordinatorLayout. But when i try to apply the below code to define an XML file it is also overlapping the appbar. What should i do to stop the overlap on appbar?
Here is an XML:
<?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:ignore="RtlHardcoded">
<android.support.design.widget.AppBarLayout
android:id="#+id/main.appbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/main.collapsing"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<ImageView
android:id="#+id/main.imageview.placeholder"
android:layout_width="match_parent"
android:layout_height="300dp"
android:scaleType="centerCrop"
android:src="#drawable/quila2"
android:tint="#11000000"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.9" />
<FrameLayout
android:id="#+id/main.framelayout.title"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="bottom|center_horizontal"
android:background="#00838F"
android:orientation="vertical"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.3">
<LinearLayout
android:id="#+id/main.linearlayout.title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:gravity="bottom|center"
android:text="Subbu kummithi"
android:textColor="#android:color/white"
android:textSize="30sp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:layout_marginTop="4dp"
android:text="#string/role_name"
android:textColor="#android:color/white" />
</LinearLayout>
</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="30dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v7.widget.CardView
android:id="#+id/card_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
app:cardElevation="8dp"
app:contentPadding="16dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lineSpacingExtra="8dp"
android:text="This is for new activity This is for new activity This is for new activity"
android:textSize="18sp" />
</android.support.v7.widget.CardView>
</android.support.v4.widget.NestedScrollView>
<android.support.v7.widget.Toolbar
android:id="#+id/main.toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#00838F"
app:layout_anchor="#id/main.framelayout.title"
app:theme="#style/ThemeOverlay.AppCompat.Dark"
app:title="">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal">
<Space
android:layout_width="#dimen/image_final_width"
android:layout_height="#dimen/image_final_width" />
<TextView
android:id="#+id/main.textview.title"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_marginLeft="8dp"
android:gravity="center_vertical"
android:text="Welcome Mr. Subbu"
android:textColor="#android:color/white"
android:textSize="20sp" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
<de.hdodenhof.circleimageview.CircleImageView
android:layout_width="#dimen/image_width"
android:layout_height="#dimen/image_width"
android:layout_gravity="center_horizontal"
android:src="#drawable/quila"
app:border_color="#android:color/white"
app:border_width="2dp"
app:finalHeight="#dimen/image_final_width"
app:finalYPosition="2dp"
app:layout_behavior="com.realmilk.activities.AvatarImageBehavior"
app:startHeight="2dp"
app:startToolbarPosition="2dp"
app:startXPosition="2dp" />
</android.support.design.widget.CoordinatorLayout>
And Here is the output when i run the above code:
Any ideas?
try add attribute android:fitsSystemWindows="true" in your CoordinatorLayout
<?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:ignore="RtlHardcoded">
.....
Set android:fitsSystemWindows="true" in CoordinatorLayout, AppBarLayout and CollapsingToolbarLayout to reserve space at top.
If you want the background image starting behind the transparent status bar set android:fitsSystemWindows="true" in the main.imageview.placeholder too.
As I explained on the title, if I scroll from the bottom to top fastly with removing my finger immediately after pulling down, scrolling stops at collapsed toolbar. I want it to expand. If I pull smootly the nestedscrollview, there is no problem, toolbar expands properly.
I have recycler view in nestedscrollview.
Here is my layout
<android.support.design.widget.CoordinatorLayout
android:id="#+id/detail_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
>
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_width="match_parent"
android:layout_height="160dp"
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"
android:theme="#style/ThemeOverlay.AppCompat.Dark"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginEnd="#dimen/article_keylines"
app:expandedTitleMarginStart="#dimen/md_keylines"
app:expandedTitleMarginBottom="#dimen/article_keylines"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:expandedTitleTextAppearance="#dimen/tile_padding"
>
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/a"
android:fitsSystemWindows="true"
android:foreground="#drawable/scrim_profile"
android:scaleType="centerCrop"
app:layout_collapseMode="parallax" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
android:elevation="4dp"
app:layout_scrollFlags="scroll|enterAlways|snap"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</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:id="#+id/nestedscrollview"
android:background="#color/background"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<RelativeLayout
android:id="#+id/inner_relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/md_keylines"
android:paddingRight="#dimen/md_keylines"
android:background="#color/white"
android:paddingBottom="#dimen/article_keylines"
android:paddingTop="#dimen/article_keylines"
android:focusableInTouchMode="true"
>
<TextView
android:id="#+id/tw1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text"
android:textSize="16sp"
android:lineSpacingExtra="4sp"
android:text="Text"
android:layout_marginBottom="#dimen/md_keylines"/>
<View
android:id="#+id/divider_1"
android:layout_width="2dp"
android:layout_height="50dp"
android:background="#color/divisor"
android:layout_below="#id/tw1"
/>
<View
android:id="#+id/divider_2"
android:layout_width="2dp"
android:layout_height="50dp"
android:background="#color/divisor"
android:layout_below="#id/tw1"
android:layout_toRightOf="#+id/tw2"
android:layout_toEndOf="#+id/tw2" />
<View
android:id="#+id/divider_3"
android:layout_width="2dp"
android:layout_height="50dp"
android:background="#color/divisor"
android:layout_below="#+id/tw1"
android:layout_toRightOf="#+id/followers"
android:layout_toEndOf="#+id/followers"/>
<TextView
android:id="#+id/count"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColor="#color/text"
android:textSize="20sp"
android:text="14"
android:lineSpacingExtra="-4sp"
android:layout_alignTop="#id/divider_1"
android:layout_marginTop="6dp"
android:layout_alignRight="#+id/experience"
android:layout_alignEnd="#+id/experience"
/>
<TextView
android:id="#+id/tw3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/text"
android:textSize="14sp"
android:text="Text"
android:paddingRight="12dp"
android:paddingEnd="12dp"
android:paddingLeft="12dp"
android:paddingStart="12dp"
android:layout_below="#id/tw2"
android:layout_toRightOf="#id/divider_1"
/>
<TextView
android:id="#+id/count2"
android:layout_toRightOf="#id/divider_2"
android:layout_toLeftOf="#id/divider_3"
android:layout_below="#id/tw1"
android:gravity="center_horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textColor="#color/text"
android:textSize="20sp"
android:layout_alignTop="#id/divider_1"
android:layout_marginTop="6dp"
android:text="200"
/>
<TextView
android:id="#+id/tw4"
android:layout_below="#id/tw3"
android:layout_toRightOf="#id/divider_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:textColor="#color/text"
android:textSize="14sp"
android:text="text"
android:paddingLeft="12dp"
android:paddingRight="12dp"
/>
<Button
android:id="#+id/button"
android:layout_toRightOf="#id/divider_3"
android:layout_below="#id/tw1"
android:layout_marginLeft="12dp"
android:layout_width="match_parent"
android:layout_height="38dp"
android:textColor="#color/orange_button"
android:gravity="center_vertical|start"
android:text="text"
android:textSize="16sp"
android:textAllCaps="false"
android:paddingLeft="18dp"
android:drawableLeft="#drawable/i"
android:drawablePadding="4dp"
android:layout_alignTop="#id/count"
style="?android:attr/borderlessButtonStyle"
android:background="#drawable/button"/>
</RelativeLayout>
<android.support.v7.widget.RecyclerView
android:padding="#dimen/md_keylines"
android:id="#+id/recycler_view"
android:layout_below="#id/inner_relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
<ProgressBar
android:id="#+id/progress_bar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_below="#id/inner_relativeLayout"
android:layout_marginTop="30dp"/>
</RelativeLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
Thanks in advance.
After I tried a lot with overriding AppBarLayout.Behavior in another stackoverflow answer,
I have found a library that resolves my problem. ( smooth-app-bar-layout
)
There are 3 steps in usage. Be careful about the 3rd step. You should put nestedscrollview above the smoothappbarlayout below the coordinatorlayout.
<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.v7.widget.NestedScrollView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<me.henrytao.smoothappbarlayout.SmoothAppBarLayout
android:id="#+id/smooth_app_bar_layout"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
app:layout_collapseMode="pin"
app:navigationIcon="#drawable/ic_toolbar_arrow_back"
style="#style/AppStyle.MdToolbar" />
</android.support.design.widget.CollapsingToolbarLayout>
</me.henrytao.smoothappbarlayout.SmoothAppBarLayout>
</android.support.design.widget.CoordinatorLayout>
I created a collapsing toolbar and placed a recyclerview below it but when I run the app the cardviews inside the recycleview overlaps the image of the collapsing toolbar .How can I fix this
MainActivity.xml
<?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:fitsSystemWindows="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/rv"
android:orientation="vertical"
android:clipToPadding="false"
android:layout_marginTop="?attr/actionBarSize"
android:layout_below="#+id/image"
/>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
app:layout_anchor="#id/app_bar_layout"
style="#style/fab"
app:theme="#style/ThemeOverlay.AppCompat.Light"
app:layout_anchorGravity="bottom|right|end"
/>
</android.support.design.widget.CoordinatorLayout>
Item.xml (layout containing the cardview inside the recyclerview)
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.co nbm/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="6dp"
app:cardElevation="6dp"
android:padding="6dp"
android:id="#+id/cv">
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.co nbm/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="180dp"
android:background="#4682b4"
android:padding="16dp"
>
<ImageView
android:layout_width="100dp"
android:layout_height="100dp"
android:scaleType="centerCrop"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="16dp"
android:src="#drawable/li"
android:id="#+id/imageView" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView"
android:text="Aayush Chaubey"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/imageView"
android:textColor="#ffffff"
android:textSize="30sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textView2"
android:text="app developer"
android:textColor="#ffffff"
android:textSize="25sp"
android:layout_centerVertical="true"
android:layout_alignLeft="#+id/textView"
android:layout_alignStart="#+id/textView" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Show Capsule"
android:textColor="#00bfff"
android:textSize="20sp"
android:layout_marginBottom="10dp"
android:layout_marginRight="10dp"
android:id="#+id/textView3"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true" />
</RelativeLayout>
</android.support.v7.widget.CardView>
Well, I think you need to add this line app:layout_behavior="#string/appbar_scrolling_view_behavior"
in your RecyclerView
Eg:
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
Most importantly you will also need to add
xmlns:app="http://schemas.android.com/apk/res-auto"
in coordinatorLayout tag.
Another point: Make sure you're using com.android.support:recyclerview-v7:22.2.0 with prior version it might not work properly
Hope it helps.
I have a CoordinatorLayout with an AppBarLayout and a CollapsingToolbarLayout. In CollapsingToolbarLayout I'm using a LinearLayout showing user info as a layout_collapseMode=parallax element, below of it, a TabLayout.
The behaviour that I expect is a smooth hiding of the user info while the TabLayout is scrolling up or down.
The problem is that the items positions are reset when I scroll down a bit, hiding entirely the user info 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:id="#+id/coordinator_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/home_green_gradient"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:elevation="2dp">
<!-- user info -->
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll">
<RelativeLayout
android:visibility="visible"
android:layout_width="match_parent"
android:layout_height="244dp"
android:clipChildren="false"
android:clipToPadding="false"
android:orientation="horizontal"
app:layout_collapseMode="parallax">
<LinearLayout
android:id="#+id/profile_store_index_layout"
android:layout_width="50dp"
android:layout_height="50dp"
android:layout_marginRight="40dp"
android:layout_marginTop="44dp"
android:layout_toLeftOf="#+id/profile_imageview"
android:background="#drawable/home_small_circle_background"
android:gravity="center_vertical"
android:orientation="vertical">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:src="#drawable/ic_store_white_18dp"
android:tint="#color/up_green"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|center_vertical"
android:text="100%"
android:textColor="#color/white_color"
android:textStyle="bold"/>
</LinearLayout>
<de.hdodenhof.circleimageview.CircleImageView
android:id="#+id/profile_imageview"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="24dp"
android:src="#drawable/dummy_worker_office"
app:border_color="#color/dark_green"
app:border_width="6dp"/>
<TextView
android:id="#+id/profile_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_imageview"
android:gravity="center_horizontal"
android:text="Juan Rojas Torres"
android:textColor="#color/white_color"
android:textSize="18sp"/>
<TextView
android:id="#+id/profile_company_executions"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_name"
android:gravity="center_horizontal"
android:text="User name"
android:textColor="#color/dark_green_text"
android:textSize="12sp"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/profile_company_executions"
android:src="#drawable/bottom_image"/>
</RelativeLayout>
<!-- Tabs at bottom -->
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.TabLayout
android:id="#+id/fragment_fragment_tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="#color/dark_green"
app:layout_collapseMode="pin"
app:tabGravity="fill"
app:tabIndicatorColor="#color/frogmi_indicator_color"
app:tabMaxWidth="0dp"
app:tabMode="fixed"
app:tabSelectedTextColor="#color/frogmi_white_color"
app:tabTextColor="#color/frogmi_non_selected_green_text"/>
</FrameLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<android.support.v4.view.ViewPager
android:id="#+id/fragment_fragment_pager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
</FrameLayout>
</android.support.design.widget.CoordinatorLayout>
```