CollapsingToolbarLayout: изменение цвета кнопки дома при расширении
Я внедрил новый CollapsingToolbarLayout
из примера кода Chris Banes.
Однако изображения для изображения в фоновом режиме имеют весь белый фон. Тема панели инструментов ThemeOverlay.AppCompat.Dark.ActionBar
, поэтому значки тоже белые, поэтому я не вижу кнопку дома, когда CollapsingToolbarLayout полностью расширяется.
С app:expandedTitleTextAppearance
я могу установить цвет для поля заголовка. Есть ли возможность установить цвет кнопок дома и значков меню?
Ответы
Ответ 1
Вот пример того, как я меняю цвет ящика и значков параметров, когда макет расширяется и сворачивается:
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
В моих глазах это возможно только в том случае, если вы измените чертежи домашней кнопки, значков меню и кнопки переполнения. К счастью, Google предоставил нам новый API под названием Tinted Drawables, который позволяет нам устанавливать цветное изображение с возможностью рисования или девяти патчей. Вот как это работает:
<?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.
Ответ 3
Кнопка "домой", кнопка переполнения и некоторые значки значков на складе из 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;
}
Ответ 4
Лучше использовать 2 разных изображения на панели инструментов. Другие могут вызвать некоторые нежелательные проблемы:
- Попытка установить 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));
});
Ответ 5
Вы можете получить хороший цветовой переход при прокрутке с помощью следующего подхода с использованием 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 развернут, и белый значок в свернутом состоянии.