Android Toolbar or AppBar color:
We can apply the app theme color dynamically. In this blog, we will learn to apply the Toolbar/ActionBar color style dynamically.
We can provide color configuration at the web end to control app theme color dynamically. In the dynamic color implementation, We have saved color in the app SharedPreferences and applied it at run time dynamically.
1. Toolbar navigation icon, overflow icon, and text color
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 |
fun setToolbarThemeColor(toolbar: Toolbar) { //Get saved dynamic color from SharedPreferences val background = Color.parseColor(AppSharedPref.getAppThemeColor(toolbar.context)) val foreground = Color.parseColor(AppSharedPref.getAppThemeTextColor(toolbar.context)) //Background drawable toolbar.background = ColorDrawable(background) //Title text color toolbar.setTitleTextColor(foreground) toolbar.setSubtitleTextColor(foreground) val colorFilter = PorterDuffColorFilter(foreground, PorterDuff.Mode.MULTIPLY) // Overflow icon val overflowIcon: Drawable? = toolbar.overflowIcon if (overflowIcon != null) { overflowIcon.colorFilter = colorFilter toolbar.overflowIcon = overflowIcon } //Navigation/Back arrow icon val navigationIcon: Drawable? = toolbar.navigationIcon if (navigationIcon != null) { navigationIcon.colorFilter = colorFilter toolbar.navigationIcon = navigationIcon } } |
In the case of AppBar, we can apply dynamically color style as below mentioned
2. AppBar navigation icon, overflow icon, and text color
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
fun setActionBarThemeColor(actionBar: androidx.appcompat.app.ActionBar, context: Context){ val backgroundColor= Color.parseColor(AppSharedPref.getAppThemeColor(context)) val foregroundColor = Color.parseColor(AppSharedPref.getAppThemeTextColor(context)) actionBar.apply { val text = SpannableString(title ?: "") text.setSpan(ForegroundColorSpan(foregroundColor),0,text.length, Spannable.SPAN_INCLUSIVE_INCLUSIVE) val upArrow =ContextCompat.getDrawable(context, R.drawable.abc_ic_ab_back_material) upArrow?.colorFilter= PorterDuffColorFilter(foregroundColor, PorterDuff.Mode.SRC_ATOP) title = text setBackgroundDrawable(ColorDrawable(backgroundColor)) setHomeAsUpIndicator(upArrow) } } |
Now, We will change the Colors of the menu items dynamically
2.Toolbar Menu Color
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
fun setMenuItemIconColor(menu: Menu, context: Context) { //Get saved dynamic color from SharedPreferences val foregroundColor = Color.parseColor(AppSharedPref.getAppThemeTextColor(context)) val iconColorFilter = PorterDuffColorFilter(foregroundColor, PorterDuff.Mode.SRC_ATOP) //iterate menu to change all items color for (i in 0 until menu.size()) { val drawable = menu.getItem(i).icon drawable?.apply { mutate() drawable.colorFilter = iconColorFilter } } } |
Hope it will help you apply dynamic Toolbar or AppBar color style dynamically.
Happy Learning 🙂
. . .
Be the first to comment.