20

我已经实现了CollapsingToolbarLayout来自 Chris Banes 的新示例代码。

但是,背景图像视图的图像都具有白色背景。工具栏主题也是ThemeOverlay.AppCompat.Dark.ActionBar白色的,因此当 CollapsingToolbarLayout 完全展开时我看不到主页按钮。

app:expandedTitleTextAppearance可以设置标题字段的颜色。是否也可以设置主页按钮和菜单图标的颜色?

4

5 回答 5

5

这是我在展开和折叠布局时如何更改抽屉和选项图标颜色的示例:

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);
                    }
        }
});
于 2016-10-22T20:45:02.557 回答
1

最好在工具栏中使用2 个不同的图像。其他可能会导致一些不必要的问题:

  1. 尝试设置 2 个不同的 Toolbar 主题将永远无法工作,因为主题仅在 Activity 创建时设置,设置另一个主题没有效果,您需要重新创建 Activity。
  2. 使用滤色器可能不会得到您想要的结果。您可以使用带阴影的箭头,并且颜色过滤器也会绘制该阴影,变得更像外部发光。

因此,您的工具栏将如下所示:

<android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:contentInsetStart="0dp"
            app:layout_collapseMode="pin"
            app:layout_scrollFlags="scroll|enterAlways|snap">

            <ImageView
                android:id="@+id/imageViewBack"
                android:layout_width="?attr/actionBarSize"
                android:layout_height="?attr/actionBarSize"
                android:scaleType="center"
                android:src="@drawable/button_back_white" />

</android.support.v7.widget.Toolbar>

您将imageViewBack在工具栏折叠时设置可绘制:

appBarLayout.addOnOffsetChangedListener((appBarLayout, offset) -> {
        final boolean isCollapsed = (offset == (-1 * appBarLayout.getTotalScrollRange()));

        imageViewBack.setImageDrawable(ContextCompat.getDrawable(context,
        isCollapsed ? 
        R.drawable.button_back_red : 
        R.drawable.button_back_white));
});
于 2018-09-05T07:27:11.173 回答
1

使用 ColorFilter 使用以下方法滚动时,您可以获得漂亮的颜色过渡。希望你喜欢Kotlin

app_bar.addOnOffsetChangedListener(AppBarLayout.OnOffsetChangedListener { appBarLayout: AppBarLayout, offset: Int ->
    val colorComponent = Math.max(0.3f,offset.toFloat() / -appBarLayout.totalScrollRange)
    toolbar.navigationIcon?.colorFilter = 
    PorterDuffColorFilter(Color.rgb(colorComponent, colorComponent, colorComponent), PorterDuff.Mode.SRC_ATOP)
})

这将在 CollapsingToolbarLayout 展开时为您提供一个深色导航图标,并在折叠状态下为您提供一个白色图标。

于 2019-04-15T14:13:18.180 回答
0

在我看来,这只有在您更改主页按钮、菜单图标和溢出按钮的可绘制对象时才有可能。幸运的是,Google 为我们提供了一个名为Tinted Drawables的新 API ,它允许我们设置可绘制或九个补丁图像的颜色。下面是它的工作原理:

<?xml version="1.0" encoding="utf-8"?>
<bitmap
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:src="@android:drawable/ic_menu_camera"
    android:tint="@color/menu_icon_color"/>

现在,您可以Drawable像在布局中使用任何其他定义一样使用这个新定义。对于主页按钮和溢出按钮,您还必须像这样覆盖样式定义:

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="android:homeAsUpIndicator">@drawable/tinted_home_button</item>
    <item name="android:actionOverflowButtonStyle">@style/OverFlowButton</item>
</style>

<style name="OverFlowButton" parent="AppTheme">
    <item name="android:src">@drawable/tinted_overflow_button</item>
</style>

不幸的是,所有这些东西(样式定义除外)仅在 API 级别 21+ 上可用,并且不包含在支持库中。如果您必须支持低于 Lollipop 的设备,我认为最好的方法是使用Android Assets Studio,您可以在其中自行着色图标并将它们下载为 png 文件。

于 2015-07-20T16:49:29.107 回答
0

sdk 中的主页按钮、溢出按钮和一些精选股票图标受以下因素影响colorControlNormal

<style name="ActionBar" parent="ThemeOverlay.AppCompat.Dark.ActionBar">
    <item name="colorControlNormal">@color/accent</item>
</style>

如果您有其他图标,则需要循环并手动过滤它们:

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.sample_actions, menu);

    for(int i = 0; i < menu.size(); i++){
        Drawable drawable = menu.getItem(i).getIcon();
        if(drawable != null) {
            drawable.mutate();
            drawable.setColorFilter(getResources().getColor(R.color.accent), PorterDuff.Mode.SRC_ATOP);
        }
    }

    return true;
}
于 2015-07-25T03:14:03.690 回答