Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to hide the ImageView at the end of collapsing of CollapsingToolbarLayout?

I use ImageView inside CollapsingToolbarLayout and need to have control,over ImageView,hide it at the end of collapsing of CollapsingToolbarLayout and do some over ImageView,Please any ideas could help me. There are such options

app:layout_scrollFlags="scroll|exitUntilCollapsed"

but not any options like "exitEndCollapsed".

like image 281
I.S Avatar asked Oct 12 '15 23:10

I.S


People also ask

How do I know if my collapsing toolbar is collapsed?

AppBarLayout appBarLayout = (AppBarLayout) view. findViewById(R. id. app_bar_layout); appBarLayout.

What is Collapsing Toolbar in Android?

CollapsingToolbarLayout is a wrapper for Toolbar which implements a collapsing app bar. It is designed to be used as a direct child of a AppBarLayout .

What is contentScrim in Android?

app:contentScrim: Specifies drawable or Color value when scrolled sufficiently off screen. app:layout_collapseMode: Specifies how child views of collapsing toolbar layout move when layout is moving. Parallax- moves in parallax fashion, Pin-view placed in fixed position.


1 Answers

I spent nearly two days trying to get exactly this working. I've read a lot of guides and others. now I finally resolved that! Those are steps I did:
First of all you need to move your ImageView in front of your Toolbar (still inside of CollapsingToolbarLayout. Next, you have to add app:contentScrim="?attr/colorPrimary" into tour CollapsingToolbarLayout (It does that nice scrim effect at the end of scrolling.
At the end, you have to add android:background="@android:color/transparent" into your Toolbar.
And that's all... This way it worked for me. Hope it will help you.

Here is part of my activity_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/sceneRoot"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:animateLayoutChanges="true">

<android.support.design.widget.AppBarLayout
    android:id="@+id/appBar"
    android:layout_width="match_parent"
    android:layout_height="168dp">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsingToolbarLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:contentScrim="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            android:id="@+id/backdrop"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            android:scaleType="centerCrop"
            android:src="@mipmap/ic_launcher"
            app:layout_collapseMode="parallax" />

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="56dp"
            android:background="@android:color/transparent"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
            app:layout_collapseMode="pin"
            app:layout_scrollFlags="scroll|exitUntilCollapsed|snap" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom"
            android:paddingBottom="16dp"
            android:paddingStart="16dp"
            android:text="AppBar Title"
            android:textSize="25dp" />

    </android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>

<android.support.v4.widget.NestedScrollView
    android:id="@+id/scrollView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">
like image 145
Sheler Avatar answered Oct 31 '22 22:10

Sheler