CollapsingToolBarLayout - status bar scrim color doesn't change
Solution 1
Change the app:statusBarScrim="?attr/colorAccent"
of the CollapsingToolbar to app:statusBarScrim="@android:color/transparent"
Then you can set the color of the CollapsingToolbar to ctl.setStatusBarScrimColor(Color.BLUE);
in your code
And also make sure you add android:fitsSystemWindows="true"
to the AppBarLayout
Solution 2
Try adding android:fitsSystemWindows="true"
to AppBarLayout. It worked for me.
Solution 3
For the point #3: In the Toolbar add a transparent background
android:background="@android:color/transparent"
<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:popupTheme="@style/AppTheme.PopupOverlay"
app:layout_collapseMode="pin"
android:background="@android:color/transparent" />
Solution 4
for 2) there is a known issue
for now I'm setting the color of the toolbar background programmatically
mAppBarLayout.addOnOffsetChangedListener(new AppBarStateChangeListener() {
@Override
public void onStateChanged(AppBarLayout appBarLayout, State state) {
Toolbar toolbar = (Toolbar) mAppBarLayout.findViewById(R.id.toolbar_top);
int toolbarBackground = (state == AppBarStateChangeListener.State.COLLAPSED) ? R.color.color_collapsed : R.color.color_non_collapsed;
toolbar.setBackgroundColor(ContextCompat.getColor(DealsOptionsActivity.this, toolbarBackground));
}
});
this is of course a simple implementation. You can optimize it.
Roee
Started studying Mobile App Development at mid 2014 (Android, iOS, Web - JS, CSS). Picked up some PHP along the way but focused on android mostly. Jul. 2016 - Full Stack Developer Developer at HomiSmart. Nov. 2016 - Android Developer at Nested. In my free time Coaching and training martial arts (mostly BJJ and MMA). I actually liked The quote in the About Me Example so I'll just add it: “When I was a boy and I would see scary things in the news, my mother would say to me, 'Look for the helpers. You will always find people who are helping.'" ― Fred Rogers
Updated on July 11, 2022Comments
-
Roee almost 2 years
I updated my android studio few days ago and started working with the CoordinatorLayout and CollapsingToolbarLayout just trying stuff.
It seems that the Toolbar scrim colour override the status bar initial colour and the status bar scrim colour (tried both from xml and code)
initial state:
started scrolling:
scrolled until collapsing:
So the questions are:
How can I prevent the toolbar to override the status bar when collapsing (not even letting the image I'm collapsing to go above it).
How can I change status bar colour after collapsing
Another issue I had is that I gave the toolbar initial colour and not just scrim colour because I wanted the Toolbar above the picture but instead it will go on top of the picture and will cover some of it as well as will cover anything that going to collapse behind it
added colour/style to the toolbar in the xml:
- Is there any way to put the toolbar above the picture from the beginning and just collapse the image? (thought about maybe keep the tool bar pinned and and frame layout before the image but its still gonna collapse on the status bar area which is the main question.)
main activity xml:
<android.support.design.widget.AppBarLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:theme="@style/AppTheme.AppBarOverlay"> <android.support.design.widget.CollapsingToolbarLayout android:layout_width="match_parent" android:layout_height="match_parent" app:layout_scrollFlags="scroll|exitUntilCollapsed" app:contentScrim = "?attr/colorPrimary" app:statusBarScrim="?attr/colorAccent" --------> not changing android:id="@+id/my_ctl"> <ImageView android:id="@+id/image" android:src="@drawable/flights" android:layout_width="match_parent" android:layout_height="250dp" 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/AppTheme.PopupOverlay" app:layout_collapseMode="pin" /> </android.support.design.widget.CollapsingToolbarLayout> </android.support.design.widget.AppBarLayout> <android.support.v4.widget.NestedScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:clipToPadding="false" app:layout_behavior="@string/appbar_scrolling_view_behavior" > <include layout="@layout/content_main" /> </android.support.v4.widget.NestedScrollView> <android.support.design.widget.FloatingActionButton android:id="@+id/fab" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="bottom|end" android:layout_margin="@dimen/fab_margin" android:src="@android:drawable/ic_dialog_email" /> </android.support.design.widget.CoordinatorLayout>
MainActivity.java:
CollapsingToolbarLayout ctl = (CollapsingToolbarLayout) findViewById(R.id.my_ctl); //ctl.setContentScrimColor(Color.RED); ctl.setStatusBarScrimColor(Color.BLUE); --------> not working ctl.setTitle("blabla");