Fullscreen SwipeRefreshLayout with CollapsingToolbar - android

What I need is that SwipeRefresh animation has to start at the top of the screen inside of CoordinatorLayout with CollapsingToolbar.
If I wrap the RecyclerView inside SwipeRefreshLayout then the animation will start below CollapsingToolbarLayout.
If I wrap the whole CoordinatorLayout inside SwipeRefreshLayout then the behavior won't be very precise and it won't work out of the first swipe.
Here is the layout where SwipeRefresh animation is shown below the CollapsingToolbar:
<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/coordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:fitsSystemWindows="true">
<net.telekom.smartcity.custom.OscaAppBarLayout
android:id="#+id/appBarLayout"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:layout_height="#dimen/services_toolbar_height"
android:theme="#style/ThemeOverlay.AppCompat.Light"
android:windowDrawsSystemBarBackgrounds="true"
android:fitsSystemWindows="true">
<com.google.android.material.appbar.CollapsingToolbarLayout
android:id="#+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:contentScrim="#android:color/white"
android:minHeight="?attr/actionBarSize"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:toolbarId="#id/marketplaceToolbar"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/zoomableImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="matrix"
android:layout_gravity="center"
app:layout_collapseMode="parallax"
android:fitsSystemWindows="true"/>
<View
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/black35a"
android:fitsSystemWindows="true"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/services_toolbar_title_top_margin"
android:layout_marginStart="#dimen/services_toolbar_infobox_margin_start"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/marketplace_toolbar_message1"
android:textSize="#dimen/services_toolbar_title_size"
android:paddingBottom="#dimen/services_toolbar_title_padding_bottom"
android:textColor="#color/white"
style="#style/RobotoBold"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/services_toolbar_title_description_top_margin"
android:text="#string/services_toolbar_message2"
android:textColor="#color/white"
android:textSize="#dimen/services_toolbar_description_size"
style="#style/RobotoLight"/>
</LinearLayout>
<androidx.appcompat.widget.Toolbar
android:id="#+id/marketplaceToolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
android:fitsSystemWindows="false">
<LinearLayout
android:id="#+id/toolbarCityBox"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_gravity="start">
<ImageView
android:id="#+id/toolbarCoat"
android:layout_width="#dimen/toolbar_coa_size"
android:layout_height="#dimen/toolbar_coa_size"
android:layout_gravity="center_vertical"/>
<TextView
android:id="#+id/toolbarTitle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="#dimen/toolbar_title_size"
android:layout_marginStart="16dp"
android:layout_gravity="center_vertical"
android:textColor="#color/black"
style="#style/RobotoMedium"
/>
</LinearLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.CollapsingToolbarLayout>
</net.telekom.smartcity.custom.OscaAppBarLayout>
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/swipeRefreshLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>

Related

How to use RecyclerView with CollapsingToolbarLayout. RecyclerView need load more data when bottom reached

My problem is, i want use RecyclerView with CollapsingToolbarLayout. But the issue is CollapsingToolbarLayout not scrolling when RecyclerView scrolling. I cant use Nested Scroll to put RecyclerView, because i want load more data to RecyclerView
<android.support.design.widget.AppBarLayout
android:id="#+id/collapsing_toolbar_appbarlayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?themeColorBack">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:contentScrim="?themeColorBack"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:id="#+id/image_contain_relative"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="invisible">
<android.support.constraint.ConstraintLayout
android:id="#+id/first_image_container"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/first_post"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="10dp"
android:adjustViewBounds="true"
android:contentDescription="#string/latest_post"
android:scaleType="fitXY"
app:layout_constraintDimensionRatio="H,16:9"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/first_image_container"
android:background="#bb000000"
android:orientation="vertical">
<TextView
android:id="#+id/first_image_category"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:paddingLeft="8dp"
android:paddingStart="8dp"
android:textColor="#color/white"
android:textSize="14sp"
tools:ignore="RtlSymmetry" />
<TextView
android:id="#+id/first_image_date"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="4dp"
android:paddingLeft="8dp"
android:paddingStart="8dp"
android:textColor="#color/white"
android:textSize="14sp"
tools:ignore="RtlSymmetry" />
</LinearLayout>
</RelativeLayout>
<TextView
android:id="#+id/first_post_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
android:textColor="?themeHeadColorText"
android:textSize="16sp"
android:textStyle="bold" />
</LinearLayout>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- app:layout_behavior attribute value settings make app tool bar appear while RecyclerView scroll. -->
<android.support.v7.widget.RecyclerView
android:id="#+id/post_recycle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="60dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
Try like this I hope this will be full fill your requirements.
<?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/main_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="250dp"
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="#android:color/transparent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:statusBarScrim="#android:color/transparent">
<ImageView
android:id="#+id/ivFeature"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
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"
android:background="#android:color/transparent"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:overScrollMode="never"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/card_recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:nestedScrollingEnabled="false" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
You can use like this.
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/myCoordinatorLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<include layout="#layout/layout_toolbar" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="4dp" />
</LinearLayout>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="18dp"
android:src="#drawable/ic_add" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

Avoid scrolling in bottom view inside ViewPager inside CoordinatorLayout

I have this structure in my main layout
<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="wrap_content"
android:fitsSystemWindows="true"
tools:context="com.pingvalue.example.MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
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="wrap_content"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<include
android:id="#+id/linear_header"
layout="#layout/product_detail_header" />
<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" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
and this is my layout that I'm using in a fragment inside ViewPager
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="6dp">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:drawableRight="#drawable/ic_insert_emoticon_black_24px"
android:gravity="center_vertical"
android:hint="#string/what_do_you_want_to_say"
android:textSize="16sp" />
<Button
android:layout_width="40dp"
android:layout_height="30dp"
android:layout_marginLeft="6dp"
android:background="#drawable/ic_send_selector"
android:enabled="false" />
</LinearLayout>
</LinearLayout>
I want to achieve the following behaviour. This is a screenshot when AppBarLayout is collapsed:
As you can see the layout with the EditText and Button is visible, but when I scroll up it disappears. I've try with a custom CoordinatorLayout behaviour but it doesn't work because it is not a direct child from my CoordinatorLayout. I've try also changing match_parent to wrap_content but it put empty space below the LinearLayout.
Put the LinearLayout with your EditText in it outside of the CoordinatorLayout and wrap everything in a LinearLayout.
<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.pingvalue.example.MainActivity">
<android.support.design.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=1>
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
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="wrap_content"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<include
android:id="#+id/linear_header"
layout="#layout/product_detail_header" />
<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" />
</android.support.design.widget.CollapsingToolbarLayout>
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</android.support.design.widget.AppBarLayout>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"/>
</android.support.design.widget.CoordinatorLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="6dp">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:drawableRight="#drawable/ic_insert_emoticon_black_24px"
android:gravity="center_vertical"
android:hint="#string/what_do_you_want_to_say"
android:textSize="16sp" />
<Button
android:layout_width="40dp"
android:layout_height="30dp"
android:layout_marginLeft="6dp"
android:background="#drawable/ic_send_selector"
android:enabled="false" />
</LinearLayout>
</LinearLayout>
This should allow you to have your composer area always visible no matter how far you have scrolled the header.
Try with following layout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.RecyclerView
android:id="#+id/recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:padding="6dp"
android:layout_weight="0">
<EditText
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:drawableRight="#drawable/ic_insert_emoticon_black_24px"
android:gravity="center_vertical"
android:hint="#string/what_do_you_want_to_say"
android:textSize="16sp" />
<Button
android:layout_width="40dp"
android:layout_height="30dp"
android:layout_marginLeft="6dp"
android:background="#drawable/ic_send_selector"
android:enabled="false" />
</LinearLayout>
</LinearLayout>
I've tried also adding a NestedScrollView with no result

CoordinatorLayout with NestedScroll and CollapsingToolbarLayout doesn't scroll to bottom

I am having an issue with CoordinatorLayout and CollapsingToolbarLayout, the toolbar is working fin, but when I scroll the activity to bottom, it does never get to the bottom it only gets until the 2nd row before the last one.
Is there any problem in my xml? (I am loading the text from strings.xml programmatically)
This is my Layout
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/rootLayout"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsingToolbarLayout"
android:layout_width="match_parent"
android:layout_height="256dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
app:contentScrim="?attr/colorPrimary"
android:fitsSystemWindows="true">
<ImageView
android:id="#+id/img"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:src="#drawable/img_1"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/par_toolbar"
android:minHeight="?attr/actionBarSize"
app:layout_collapseMode="pin"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
>
<TextView
android:id="#+id/title"
android:textSize="17sp"
android:text="#string/app_toolbar_title"
android:textColor="#color/Blanco"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</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:layout_gravity="fill_vertical"
android:background="#color/background"
android:paddingBottom="32dp"
android:paddingRight="32dp"
android:paddingLeft="32dp"
android:fillViewport="true"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:paddingTop="32dp"
android:layout_height="match_parent"
android:background="#color/background"
android:orientation="vertical">
<TextView
android:id="#+id/txt_paragraph_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/app_name"
android:textColor="#color/black"
android:layout_marginBottom="5dp"
android:textStyle="bold"
android:textSize="18sp" />
<TextView
android:id="#+id/txt_paragraph"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="#string/history1"
android:textColor="#color/black"/>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
Seems that behavior you have described is caused by layout_gravity attribute of your NestedScrollView. Try to remove it.

Scroll not responding to NestedScrollView in android

I am trying to make a CollapsingToolbarLayout. I have successfully implemented that. I have a parallax image in the CollapsingToolbarLayout. Outside the CollapsingToolbarLayout I have a NestedScrollView with 3 cards. When I scroll the cards, the CollapsingToolbarLayout collapses to show the toolbar and the cards move to the top below the action bar. But they are not scrolling beyond the action bar. Result of which is, that I am not being able to view the contents of the third card.
Am I missing something ? Here is my code
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/coordinatorLayout"
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="325dp"
android:fitsSystemWindows="true"
android:theme="#style/Base.ThemeOverlay.AppCompat.Dark">
<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:expandedTitleMarginEnd="64dp"
app:expandedTitleMarginStart="48dp"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/artist_image_profile_page"
android:layout_width="match_parent"
android:layout_height="300dp"
android:src="#mipmap/ic_default_artist"
app:layout_collapseMode="parallax"
app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed"
android:clickable="true"
android:transitionName="selectedArtistImage"
android:scaleType="centerCrop" />
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/scroll_card_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:id="#+id/card_video"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
app:cardBackgroundColor="#color/background_light_color">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/video"
android:textSize="18sp"
android:textColor="#color/primary_text_dark_color"
android:textAppearance="#style/TextAppearance.AppCompat.Title" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="300dp"
android:layout_marginTop="10dp"
android:background="#color/background_dark_color"></RelativeLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/card_releases"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="5dp"
app:cardBackgroundColor="#color/background_light_color">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/releases"
android:textSize="18sp"
android:textColor="#color/primary_text_dark_color"
android:textAppearance="#style/TextAppearance.AppCompat.Title" />
</LinearLayout>
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView
android:id="#+id/card_biography"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="5dp"
app:cardBackgroundColor="#color/background_light_color">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/biography"
android:textSize="18sp"
android:textColor="#color/primary_text_dark_color"
android:textAppearance="#style/TextAppearance.AppCompat.Title" />
<TextView
android:id="#+id/artist_biography"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="16sp"
android:text="#string/test"
android:layout_marginTop="5dp"
android:textColor="#color/secondary_text_color"/>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
## Heading ##</android.support.design.widget.CoordinatorLayout>
The problem is you have specified layout_height to the last two cardview (android:layout_height="100dp"). Replace it with "wrap_content" and it should work smoothly.

Clickable CardView inside NestedScroll doesn't trigger scrolling

I have a layout with a CoordinatorLayout, and AppBarLayout and a NestedScrollView, inside the NestedScrollView I have multiple CardViews, everything works ok until I set the CardViews to be clickable, then if I start a scroll within a CardView, scroll doesn't work.
This is my layout:
<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/main_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_height="256dp"
android:layout_width="match_parent"
app:contentScrim="?attr/colorPrimary"
android:fitsSystemWindows="true"
app: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"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary">
<ImageView
android:id="#+id/backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_gravity="fill_vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="0dp"
app:cardUseCompatPadding="true">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="80dp"
android:layout_height="80dp"
android:background="#color/primary" />
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="4dp"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:paddingBottom="7dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lines="1"
android:includeFontPadding="false"
android:text="Title1"
style="#android:style/TextAppearance.Medium" />
<TextView
android:lines="2"
android:text="Description 1"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
...
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
The issue comes to daylight when the ScrollView isn't filled with content. I think it's a very weird bug in Android.
The 'solution'..
<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/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".MainActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/appbar"
android:layout_height="256dp"
android:layout_width="match_parent"
app:contentScrim="?attr/colorPrimary"
android:fitsSystemWindows="true"
app: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"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary">
<ImageView
android:id="#+id/backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_height="?attr/actionBarSize"
android:layout_width="match_parent"
app:layout_collapseMode="pin"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="#+id/nestedScroll"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
android:layout_gravity="fill_vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="0dp"
app:cardUseCompatPadding="true"
android:foreground="?android:attr/selectableItemBackground"
android:clickable="true">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<View
android:layout_width="80dp"
android:layout_height="80dp"
android:background="#cdcdcd"
android:clickable="true"/>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="4dp"
android:paddingLeft="7dp"
android:paddingRight="7dp"
android:paddingBottom="7dp">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:lines="1"
android:includeFontPadding="false"
android:text="Title1"
style="#android:style/TextAppearance.Medium"/>
<TextView
android:lines="2"
android:text="Description 1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
</LinearLayout>
</android.support.v7.widget.CardView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="1000dp"
android:orientation="vertical"
android:layout_margin="4dp"
android:background="#c1c1c1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20pt"
android:text="some content..."/>
</LinearLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>
It seems like the same problem as here: Scroll doesn't work in NestedScrollView when try to scroll from views with click events
This is the kind of workaround for your problem
https://stackoverflow.com/a/32887429/2165810
But you shuld also use setPreventCornerOverlap(false) for your CardView to avoid problems with CardView
As people have noted, the problem is when the CardView sits fully within the screen it won't trigger scrolling from the card. Scrolling still works from views within the CollapsingToolbarLayout.
My solution was to add android:layout_marginBottom="100dp" to the CardView so that the bottom edge is offscreen thus allowing scrolling.

Categories

Resources