CollapsingToolbarLayout arrow color

I use CollapsingToolbarLayout in my work, but I need to change the color of the back arrow when it expands, is there any way to do this? What I have:

enter image description here enter image description here

What I want to do:

enter image description here enter image description here

Here is my layout where I put the "..." in it there is a layout with NestedScrollView.

<?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.primebitstudio.swiper.AboutCouponActivity"
    android:layout_marginTop="-1px">

    <android.support.design.widget.AppBarLayout android:id="@+id/app_bar"
        android:fitsSystemWindows="true"
        android:layout_height="wrap_content"
        android:layout_width="match_parent"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.design.widget.CollapsingToolbarLayout android:id="@+id/toolbar_layout"
            android:fitsSystemWindows="true"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:contentScrim="?attr/colorPrimary"
            app:expandedTitleTextAppearance="@style/CollapsingToolbarLayoutExpandedTextStyle"
            app:theme="@style/ThemeOverlay.AppCompat.Light"
            app:popupTheme="@style/ToolBarStyle">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="-24dp">
                <ImageView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:adjustViewBounds="true"
                    android:scaleType="fitCenter"
                    android:src="@drawable/test_image"
                    android:id="@+id/image"/>
            </RelativeLayout>

            <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/ToolBarStyle" />

        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>
...
...
</android.support.design.widget.CoordinatorLayout>
+4
source share
2 answers

Here is an example of how I change the color of the drawer and parameter icons when the layout expands and collapses:

protected void onCreate(Bundle savedInstanceState) {
            AppBarLayout appBarLayout = (AppBarLayout) findViewById(R.id.app_bar_layout);
            appBarLayout.addOnOffsetChangedListener(new AppBarLayout.OnOffsetChangedListener() {
                @Override
                public void onOffsetChanged(AppBarLayout appBarLayout, int offset)
                {
                    Drawable upArrow = ResourcesCompat.getDrawable(getResources(), R.drawable.drawer_icon, null);
                    if (offset < -200)
                    {
                        upArrow.setColorFilter(Color.parseColor("#000000"), PorterDuff.Mode.SRC_ATOP);
                        getSupportActionBar().setHomeAsUpIndicator(upArrow);

                        Drawable drawable = ContextCompat.getDrawable(getApplicationContext(),R.drawable.option_menu_icon);
                        drawable.setColorFilter(Color.parseColor("#000000"), PorterDuff.Mode.SRC_ATOP);
                        toolbar.setOverflowIcon(drawable);
                    }
                    else
                    {

                        upArrow.setColorFilter(Color.parseColor("#ffffff"), PorterDuff.Mode.SRC_ATOP);
                        getSupportActionBar().setHomeAsUpIndicator(upArrow);
                        getSupportActionBar().setDisplayHomeAsUpEnabled(true);

                        Drawable drawable = ContextCompat.getDrawable(getApplicationContext(),R.drawable.option_menu_icon);
                        drawable.setColorFilter(Color.parseColor("#ffffff"), PorterDuff.Mode.SRC_ATOP);
                        toolbar.setOverflowIcon(drawable);
                    }
        }
});
+2
source

From the documentation forActionBarDrawerToggle :

You can customize the animated switch by specifying an drawerArrowStyleActionBar in your theme.

drawerArrowStyle , :

  • android.support.v7.appcompat:arrowHeadLength
  • android.support.v7.appcompat:arrowShaftLength
  • android.support.v7.appcompat:barLength
    ,
  • android.support.v7.appcompat:color
  • android.support.v7.appcompat:drawableSize
  • android.support.v7.appcompat:gapBetweenBars
    ,
  • android.support.v7.appcompat:spinBars
    .
  • android.support.v7.appcompat:thickness
    ( )

, android.support.v7.appcompat:color - , .


, .

1
Toolbar . , , - :

Drawable navIcon = mToolbar.getNavigationIcon();
navIcon.setColorFilter(Color.RED, PorterDuff.Mode.SRC_IN);

, PorterDuff.Mode . ( ), ( - ).

2
, , DrawerArrowDrawable, setColor():

DrawerArrowDrawable navIcon = (DrawerArrowDrawable) mToolbar.getNavigationIcon();
navIcon.setColor(Color.RED);

, , , ObjectAnimator.ofArgb(...) ValueAnimator.ofArgb(...) ( ).

0

Source: https://habr.com/ru/post/1629527/


All Articles