Develop Reference

Android/Java: How to use ConstraintLayout in a ScrollView, in a Fragment that is in a navigation bar?

I have a problem to include a ScrollView with a ConstraintLayout. How Can I mix the two? I would like to get a good resizing of the screen, but with the capability by scrolling the screen if the number of the buttons will increase.
I tried this, but without success. I used that ticket
here is the xml file:
<ScrollView
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:fillViewport="true">
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/homeContainer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/imagealliance"
android:backgroundTint="#80FFFFFF"
android:backgroundTintMode="src_over"
android:gravity="center"
android:theme="#style/AppTheme"
tools:context=".LoginActivity">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:alpha="0.6"
android:scaleType="fitXY"
android:src="#drawable/logoalliance"
app:layout_constraintBottom_toTopOf="#+id/txt_login"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
</ScrollView>
Here is the code for the buttons:
public class HomeFragment extends Fragment {
...
layout.addView(eventBtn);
if (i == 0)
{
test1 = eventBtn.getId();
Log.d("test1", String.valueOf(eventBtn.getId()));
}
if (i == countUser.length() - 1)
{
test2 = eventBtn.getId();
Log.d("test2", String.valueOf(eventBtn.getId()));
}
Here is the code for the layout:
// Create ConstraintSet
ConstraintSet constraintSet = new ConstraintSet();
// Make sure all previous Constraints from ConstraintLayout are not lost
constraintSet.clone(layout2);
// Create Rule that states that the START of btn_contact_us1 will be positioned at the END of btn_contact_us2
constraintSet.connect(imageView1.getId(), ConstraintSet.START, test1, ConstraintSet.END);
constraintSet.applyTo(layout2);
Thanks in advance

Try updating your xml by following code
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivityStack">
<ScrollView
android:layout_width="0dp"
android:layout_height="0dp"
android:fillViewport="true"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:alpha="0.6"
android:scaleType="fitXY"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>

Toolbar and TabLayout don't hide when I scroll the RecyclerView up

I am having trouble getting the Toolbar and TabLayout to hide when I scroll up. I have 3 different xml files: 1) Toolbar, 2) TabLayoutFragment (here I have the TabLayout and ViewPager, and I include the toolbar here, and 3) HomeFragment (contains the RecyclerView). I need for the Toolbar to hide when I scroll up, and I have seen in many other posts that most people use a CoordinatorLayout instead of a Relative Layout or Linear Layout, and then they have to add app:layout_scrollFlags="scroll|enterAlways" which I have done, but I still can't get the Toolbar to hide when scrolling the RecyclerView up.
I've also added this to the RecyclerView, but still nothing... app:layout_behavior="#string/appbar_scrolling_view_behavior"
Could someone point out what is missing here?
Toolbar
<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/toolbar_events"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fff"
android:fitsSystemWindows="true">
<com.google.android.material.appbar.AppBarLayout
android:id="#+id/bar"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<androidx.appcompat.widget.Toolbar
android:id="#+id/toolbar_home_fragment"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fff"
app:contentInsetEnd="0dp"
app:contentInsetLeft="0dp"
app:contentInsetRight="0dp"
app:contentInsetStart="0dp"
app:contentInsetStartWithNavigation="0dp"
app:layout_scrollFlags="scroll|enterAlways"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:fontFamily="#font/scriptbl"
android:text="Events"
android:textColor="#color/colorBlack"
android:textSize="60sp" />
<ImageView
android:id="#+id/search"
style="#style/SelectableIconThemeBackground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:contentDescription="#string/camera"
android:padding="10dp"
android:src="#drawable/icon_search" />
<ImageView
android:id="#+id/filter"
style="#style/SelectableIconThemeBackground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toStartOf="#+id/search"
android:contentDescription="#string/camera"
android:padding="10dp"
android:src="#drawable/icon10_sort" />
<ImageView
android:id="#+id/options"
style="#style/SelectableIconThemeBackground"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:layout_marginStart="10dp"
android:contentDescription="#string/options"
android:padding="10dp"
android:src="#drawable/icon_short_text" />
</RelativeLayout>
</androidx.appcompat.widget.Toolbar>
</com.google.android.material.appbar.AppBarLayout>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
TabLayoutFragment
<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:id="#+id/fragment_home_tab_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:tag="Home"
tools:context=".Fragment.TabLayoutFragment">
<include
android:id="#+id/toolbar_events"
layout="#layout/toolbar_events" />
<com.google.android.material.tabs.TabLayout
android:id="#+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:layout_marginBottom="8dp"
android:background="#fff"
app:layout_scrollFlags="scroll|enterAlways"
app:tabIndicatorColor="#000"
app:tabIndicatorFullWidth="false"
app:tabRippleColor="#android:color/transparent"
app:tabSelectedTextColor="#color/colorBlack"
app:tabTextColor="#color/colorBlack" />
<androidx.viewpager.widget.ViewPager
android:id="#+id/viewpager"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fff"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
HomeFragment
<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:id="#+id/fragment_home"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:orientation="vertical"
android:tag="fragment_home"
tools:context=".Fragment.HomeFragment">
<androidx.swiperefreshlayout.widget.SwipeRefreshLayout
android:id="#+id/refresh"
android:layout_width="match_parent"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/toolbar">
<TextView
android:id="#+id/welcome"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_marginTop="100dp"
android:gravity="center"
android:text="Welcome to Events!"
android:textColor="#d9d9d9"
android:textSize="36sp"
android:visibility="gone" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/location"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawablePadding="5dp"
android:gravity="center_horizontal"
android:padding="8dp"
app:drawableStartCompat="#drawable/icon_loc" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/location"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</RelativeLayout>
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/recycler_view_following"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:visibility="gone"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</RelativeLayout>
</androidx.swiperefreshlayout.widget.SwipeRefreshLayout>
</RelativeLayout>

You can make it programmatically by adding the addOnScrollListener method.
On the RecyclerView.SCROLL_STATE_DRAGGING method hide the toolbar and TabLayout and on RecyclerView.SCROLL_STATE_IDLE method you can show it again if you want to show them again.
You can try it in such way:
recyclerview.addOnScrollListener(new RecyclerView.OnScrollListener() {
#Override
public void onScrollStateChanged(RecyclerView recyclerView, int newState) {
if (newState == RecyclerView.SCROLL_STATE_IDLE) {
// Show your view again.. If you want to show them..
} else if (newState == RecyclerView.SCROLL_STATE_DRAGGING) {
// Hide your view..
}
super.onScrollStateChanged(recyclerView, newState);
}});
Or You can use recycler view's addOnScrollListener method:
Refer: addOnScrollListener
recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
#Override
public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
if (dy > 0) {
//Scrolling down
// Show your controllers from here
} else if (dy < 0) {
//Scrolling up
// Hide your controllers from here
}
}});
Also, you can add some animations there to show and hide your toolbar and tab layouts.

Place the toolbar and the tablayout within the ScrollView group to get the scrolling part.
<ScrollView>
<Toolbar></Toolbar>
<Tablayout></Tablayout>
</ScrollView>

Nested Scroll View Not Scroll to Bottom of Activity

I am having an issue with nested scroll view when reach bottom.
Inside nestedScrollView I have a button, in bottom of page I have a input field to enter phone number. When press button, if phone number filed not filled, I want to scroll to Bottom of Activity to highlight input field.
But in my activity it scrolling only half, not scrolling till end.
I tried all beloved java codes to fix this issue, but all works same (Not reaching bottom, stops on middle).
Java Codes
CoordinatorLayout mainCoordinate = findViewById(R.id.mainCoordinate);
NestedScrollView nestedScrollView = findViewById(R.id.nestedScroll);
1.
//Scroll to bottom of view
nestedScrollView.post(new Runnable() {
#Override
public void run() {
nestedScrollView.smoothScrollTo(0, mainCoordinate.getBottom());
}
});
2.
//Scroll to bottom of view
nestedScrollView.post(new Runnable() {
#Override
public void run() {
nestedScrollView.fullScroll(View.FOCUS_DOWN);
}
});
3.
nestedScrollView.getViewTreeObserver().addOnGlobalLayoutListener(new ViewTreeObserver.OnGlobalLayoutListener() {
#Override
public void onGlobalLayout() {
final int scrollViewHeight = nestedScrollView.getHeight();
if (scrollViewHeight > 0) {
nestedScrollView.getViewTreeObserver().removeOnGlobalLayoutListener(this);
final View lastView = nestedScrollView.getChildAt(nestedScrollView.getChildCount() - 1);
final int lastViewBottom = lastView.getBottom() + nestedScrollView.getPaddingBottom();
final int deltaScrollY = lastViewBottom - scrollViewHeight - nestedScrollView.getScrollY();
/* If you want to see the scroll animation, call this. */
nestedScrollView.smoothScrollBy(0, deltaScrollY);
/* If you don't want, call this. */
nestedScrollView.scrollBy(0, deltaScrollY);
}
}
});
XML Codes
<?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/mainCoordinate"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorPrimary"
tools:ignore="RtlHardcoded">
<android.support.design.widget.AppBarLayout
android:id="#+id/flexibleAppbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:visibility="invisible">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/flexible.example.collapsing"
android:layout_width="match_parent"
android:layout_height="258dp"
app:contentScrim="?colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<ImageView
android:id="#+id/imageMain"
android:layout_width="match_parent"
android:layout_height="258dp"
android:foreground="#drawable/ripple_effect_circle_card"
android:src="#drawable/back_button_white" />
</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"
android:visibility="visible"
app:behavior_overlapTop="48dp"
app:layout_behavior="#string/appbar_scrolling_view_behavior">
<LinearLayout
android:id="#+id/main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:fitsSystemWindows="true"
android:focusable="true"
android:focusableInTouchMode="true"
android:orientation="vertical">
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/price.card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_anchorGravity="bottom"
card_view:cardBackgroundColor="#color/card_back"
card_view:cardCornerRadius="4dp"
card_view:contentPadding="8dp">
.........................
.........................
.........................
//My Other All Views
.........................
.........................
.........................
</android.support.v7.widget.CardView>
<android.support.v7.widget.CardView xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/profile.card"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_anchorGravity="bottom"
card_view:cardBackgroundColor="#color/card_back"
card_view:cardCornerRadius="4dp"
card_view:contentPadding="8dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="start"
android:padding="5dp"
android:text="Phone No." />
<EditText
android:id="#+id/etPhone"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:gravity="end"
android:hint="Enter your phone"
android:inputType="phone"
android:text=""/>
</RelativeLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<Button
android:id="#+id/btnBookNow"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Button"/>
</android.support.design.widget.CoordinatorLayout>
I attached a video that explains my exact problem link
Please, Does anyone having a better way or other suggestion to fix this issue?
Thanks in Advance

Pls try Android layout inspector to check height of your NestedScroll.
Try to add
android:layout_gravity="bottom|center" to Button.
In NestedScrollView set layout heigh to android:layout_height="wrap_content"

how to smoothly set layout height

I have an ImageView inside a CollapsingToolbarLayout and the ImageView takes up the whole screen with some info at the bottom. When user clicks on the ImageView i'd like the height of the CollapsingToolBarLayout to become 150dp. How do I set the height of the CollapsingToolBarLayout to have a smooth animation to be set to height of 150dp. I'd like the height to smoothly and slowly get to 150dp not quick, to have a nice animation.
How can i achieve this?
activity_scrolling.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"
android:fitsSystemWindows="true"
tools:context="com.myapplication.foodapp.ScrollingActivity"
android:id="#+id/coordinator_layout"
android:animateLayoutChanges="true">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
android:theme="#style/AppTheme.PopupOverlay"
android:animateLayoutChanges="true">
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_tool_bar_layout"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:fitsSystemWindows="true"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:animateLayoutChanges="true">
<ImageView
android:id="#+id/chipotle_image"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_alignParentTop="true"
android:layout_gravity="fill_vertical"
android:src="#mipmap/food1"
android:adjustViewBounds="true"
android:scaleType="fitXY"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Chipotle Chicken Fajitas"
android:textSize="27sp"
android:layout_gravity="bottom"
android:layout_marginBottom="40dp"
android:layout_marginLeft="5dp"
android:textColor="#fff"
android:id="#+id/first_food_title"/>
<me.grantland.widget.AutofitTextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="16 ingredients | 284 Calories | 1 hour"
android:singleLine="true"
android:textAlignment="center"
android:textColor="#fff"
android:layout_gravity="bottom"
android:textSize="20sp"
android:id="#+id/spec_text"/>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="150dp"
app:layout_collapseMode="pin"
android:animateLayoutChanges="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_width="25dp"
android:layout_height="25dp"
android:src="#mipmap/arrow"
android:id="#id/back_Arrow"
android:layout_marginTop="5dp"
/>
</LinearLayout>
</android.support.v7.widget.Toolbar>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<!-- ** CONTENT SCROLLING LAYOUT ** -->
<include layout="#layout/content_scrolling">
</include>
</android.support.design.widget.CoordinatorLayout>

You can achieve this with ValueAnimator.
ValueAnimator anim = ValueAnimator.ofInt(viewToIncreaseHeight.getMeasuredHeight(), finalValue);
anim.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
#Override
public void onAnimationUpdate(ValueAnimator valueAnimator) {
int val = (Integer) valueAnimator.getAnimatedValue();
ViewGroup.LayoutParams layoutParams = viewGroup.getLayoutParams();
layoutParams.height = val;
viewGroup.setLayoutParams(layoutParams);
}
});
anim.start();

CardView is not Collapsing in scrolling activity

I have Scrolling activity and I have a CardView in it which behave like this floating action button as shown in this animation.
As you can see fab is fading (in and out), but the card view is not behaving like that.
My layout.xml is as follows:
<?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="com.rhcloud.arshadali.task.ScrollingActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
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"
app:contentScrim="?attr/colorPrimary"
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" />
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<include layout="#layout/content_scrolling" />
<android.support.v7.widget.CardView
android:id="#+id/id_card"
android:layout_width="match_parent"
android:layout_height="46dp"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|end"
android:foreground="#android:color/white"
android:layout_margin="5dp">
<ImageView
android:id="#+id/app_googleplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:maxWidth="30dp"
android:maxHeight="30dp"
android:layout_gravity="center_vertical"/>
<TextView
android:id="#+id/app_apk"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="com.javiersantos"
android:fontFamily="sans-serif-thin"
android:textColor="#android:color/black"
android:gravity="center"/>
</android.support.v7.widget.CardView>
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|end"
app:srcCompat="#android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
Any way to achieve this?

I think the Card View should be a child of your collapsing toolbar for the effects to take place (Place it above the Toolbar).
<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="com.rhcloud.arshadali.task.ScrollingActivity">
<android.support.design.widget.AppBarLayout
android:id="#+id/app_bar"
android:layout_width="match_parent"
android:layout_height="#dimen/app_bar_height"
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"
app:contentScrim="?attr/colorPrimary"
app:layout_scrollFlags="scroll|exitUntilCollapsed">
<android.support.v7.widget.CardView
android:id="#+id/id_card"
android:layout_width="match_parent"
android:layout_height="46dp"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|end"
android:foreground="#android:color/white"
android:layout_margin="5dp">
<ImageView
android:id="#+id/app_googleplay"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:maxWidth="30dp"
android:maxHeight="30dp"
android:layout_gravity="center_vertical"/>
<TextView
android:id="#+id/app_apk"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="com.javiersantos"
android:fontFamily="sans-serif-thin"
android:textColor="#android:color/black"
android:gravity="center"/>
</android.support.v7.widget.CardView>
<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.AppBarLayout>
<include layout="#layout/content_scrolling" />
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="#dimen/fab_margin"
app:layout_anchor="#id/app_bar"
app:layout_anchorGravity="bottom|end"
app:srcCompat="#android:drawable/ic_dialog_email" />

Put CardView inside a LinearLayout and move it to the top of Toolbar.
It works.
Like this:
<android.support.design.widget.CollapsingToolbarLayout
android:id="#+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:contentScrim="?attr/colorPrimary"
app:titleEnabled="false"
app:layout_scrollFlags="scroll|exitUntilCollapsed|snap">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_collapseMode="parallax"
app:layout_collapseParallaxMultiplier="0.5"
android:layout_marginTop="60dp"
android:orientation="vertical">
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="5dp"
android:padding="10dp">
</android.support.v7.widget.CardView>
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.Overlay.Light"
app:layout_collapseMode="pin" />
</android.support.design.widget.CollapsingToolbarLayout>

Perhaps my answer is too late, but you can try this simplest way. Put the card view in the "Content Activity" which is usually automatically generated when you choose Scrolling Activity template in android studio. Remember, if you want to have multiple card view, you should put those card views under one Linear/Relative Layout in the Content Activity.

This work:
if you are using Databinding this is the perfect solution:
In same Class:
#BindingAdapter("hideWithAppBarLayout")
public static void hideWithAppBarLayout(View view, AppBarLayout appBarLayout) {
if (appBarLayout == null) return;
if (view.getParent() instanceof CoordinatorLayout) {
CoordinatorLayout.LayoutParams lp = (CoordinatorLayout.LayoutParams) view.getLayoutParams();
lp.setAnchorId(appBarLayout.getId());
appBarLayout.addOnOffsetChangedListener((AppBarLayout.BaseOnOffsetChangedListener) (appBar, verticalOffset) -> {
float percentage = ((float) Math.abs(verticalOffset) / appBar.getTotalScrollRange());
//on collapsing
if (percentage == 1) view.setVisibility(View.GONE);
//on expending
if (percentage == 0) view.setVisibility(View.VISIBLE);
});
}
}
In xml layout do this:
<androidx.cardview.widget.CardView
app:layout_anchor="#id/appbar"
app:hideWithAppBarLayout="#{appbar}"
app:layout_anchorGravity="bottom|center_horizontal">
//todo
</androidx.cardview.widget.CardView>