I've been trying to get the back button to become white using the default App Bar in my Android App. I looked at and tried a number of suggestions in this post as well and ran up against the following issues.
- Adding
colorControlNormalto my app style will mess with all of the other controls and essentially break the UI. - Subclassing other parent themes other than Widget.AppCompat.ActionBar usually just causes the title to disappear and I still can't change the back button color.
- Setting
android:homeAsUpIndicatorin my theme OR on the ActionBar style has no effect.
I ended up settling on this, but it feels pretty hacky - although it works. It basically watches the navigation and sets a custom vector back button with the white color when the user can go back. Seems like overkill to me. Is there a better way to do it?
My Styles
<style name="Theme.MyTheme" parent="Theme.Material3.Light"> <!-- ... --> <item name="actionBarStyle">@style/CustomActionBar</item> </style> <style name="ActionBarTitleText" parent="TextAppearance.Widget.AppCompat.Toolbar.Title"> <item name="android:textColor">@color/white</item> </style> <style name="CustomActionBar" parent="Widget.AppCompat.ActionBar"> <item name="background">@color/actionBarColor</item> <item name="titleTextStyle">@style/ActionBarTitleText</item> <item name="height">56dp</item> </style> MainActivity.kt
override fun onCreate(savedInstanceState: Bundle?) { super.onCreate(savedInstanceState) val navHostFragment = supportFragmentManager.findFragmentById(R.id.nav_host) as NavHostFragment NavigationUI.setupActionBarWithNavController(this, navHostFragment.navController) navHostFragment.navController.addOnDestinationChangedListener { _, destination, _ -> // Only show the custom up indicator if not on the start destination val isStartDestination = destination.id == navHostFragment.navController.graph.startDestinationId if (!isStartDestination) { ContextCompat.getDrawable(this, R.drawable.baseline_arrow_back_24)?.let { upArrow -> upArrow.setTint(ContextCompat.getColor(this, R.color.white)) supportActionBar?.setHomeAsUpIndicator(upArrow) } } else { // Optionally reset to default or hide supportActionBar?.setHomeAsUpIndicator(null) } } }