Is it possible to change up button icon in Navigation Component?

android navigation component back button
appbarconfiguration
android navigation component toolbar
android navigation component bottom navigation
drawerlayout
android navigation drawer with activities
onsupportnavigateup navigation component
android navigation bar

I would like to change up button icon in ActionBar that is working with Navigation Component. I've tried several options like:

supportActionBar?.setHomeAsUpIndicator(R.drawable.ic_arrow_left_blue_24dp)

in MainAcitivty or

app:navigationIcon="@drawable/ic_arrow_left_blue_24dp"

in Toolbar .xml file and nothing seems to work.

I have a pretty standard setup with

setSupportActionBar(appToolbar.toolbar)
setupActionBarWithNavController(this, navController)

called in MainActivity:onCreate method.

I would expect that

supportActionBar?.setHomeAsUpIndicator(R.drawable.ic_arrow_left_blue_24dp)

would work, because for example disabling title for ActionBar by calling:

supportActionBar?.setDisplayShowTitleEnabled(false)

works as expected and title is not set to Fragment name while navigating.

What's more, I investigated a little bit and in ActionBarOnDestinationChangedListener there is a call to setNavigationIcon which is setting an icon to DrawerArrowDrawable, which is a little bit weird since I'm not using Drawer in my setup.

Also changing to:

setupWithNavController(toolbar, navController)

is not working because ToolbarOnDestinationChangedListener also using the same DrawerArrowDrawable.

I have found answer. I checked issue tracker for navigation component and it seems like for now it's impossible to change it without a workaround:

https://issuetracker.google.com/u/1/issues/121078028

Gladly it's still possible, we just need to implement OnDestinationChangedListener and change icon there as it's called after setNavigationIcon in AbstractAppBarOnDestinationChangedListener. Here is a code:

navController.addOnDestinationChangedListener { _, _, _ ->
      supportActionBar?.setHomeAsUpIndicator(R.drawable.ic_arrow_left_blue_24dp)
}

You can even differ icon for different destinations.

It's temporary solution as this feature is not there yet. I'm using 1.0.0-alpha09 version of the navigation component.

How to Customize the Navigation Bar Icons on Android Oreo, How do I change the navigation icon on my Android? You need to select the button and then tap on the ‘Type’. Select the keycode as per your wish and then tap on ‘Icon’. There you need to select the icon as per your wish. That’s it, you are done!

If you do not use a supportActionBar but use your own toolbar intead, the solution is as follows.

navController.addOnDestinationChangedListener { _, destination, _ ->

        if (destination.id == R.id.myDestination) {

            myToolbar.setNavigationIcon(R.drawable.myIcon)
        }
}

How to change Toolbar home icon color, How do I change the color of my taskbar icons on Android? 3 Is it possible to change up button icon in Navigation Component? Jan 17 '19. 3 Is it possible to change up button icon in Navigation Component? Jan 17 '19.

You can implement NavigationController.OnDestinationChangedListener and use the Toolbar.setNavigationIcon method to set the icon. I would recommend using AppBarConfiguration.topLevelDestinations to determine if your destination is a top-level destination and set your icons accordingly. Kotlin Example:

navController.addOnDestinationChangedListener { _, destination, _ ->
            val isTopLevelDestination = appBarConfiguration.topLevelDestinations.contains(destination.id)
            toolbar.setNavigationIcon(
                if(isTopLevelDestination) R.drawable.ic_menu
                else R.drawable.ic_back
            )
        }

Changing Navigation Drawer Icon (Burger Button) on Actionbar , How to Changing Navigation Drawer Icon (Burger button) on Actionbar Download Source Code Duration: 4:55 Posted: Dec 2, 2018 xda-developers Samsung Galaxy S8 Samsung Galaxy S8 Questions & Answers Possible to change the navigation bar icons? by iTayGNR XDA Developers was founded by developers, for developers. It is now a valuable resource for people who want to make the most of their mobile devices, from customizing the look and feel to adding new functionality.

Update UI components with NavigationUI, See Single Activity: Why, When, and How to learn more about the advantages of using fragments. which was used by the activity because nothing needs to change to the layout itself. android:icon="@drawable/ic_menu_slideshow" closing the DrawerLayout and handling Up and Back button behavior appropriately. With the introduction of action bars in Android 3.0, a second navigation mechanism appeared: the Up button, consisting of the app icon and a left-point caret. Up vs. Back. The Up button is used to navigate within an app based on the hierarchical relationships between screens.

Migrate to the Navigation component, There are two methods to add a back button on the toolbar. First, I'm Sign up and get an extra one for free. If you want to change the back button icon, you need to change Navigation Drawer with Navigation Component. 3 Ways to Add Image Icon Inside Navigation Bar. Here are the 3 Ways to Add Image Icon Inside Navigation Bar in React Native. If you want to make an application with a React Navigation, you can find a NavigationBar/ ActionBar on the top of the screen.

Android Notes 24: How to add Back Button at Toolbar [UPDATED v2], Contextual top app bar with menu icon and page title on left, and favorite, A menu icon, which opens a navigation drawer; An up arrow, which When scrolling up, prominent top app bars using imagery can transform into normal top app bars. Fortnightly is a news app that uses Material Design components and Material  When the user selects the Up button, the app navigates to the parent activity. This lesson shows you how to add an Up button to an activity by declaring the activity's parent in the manifest, and enabling the app bar's Up button. The Navigation Architecture Component, currently in alpha, is another method of handling navigation in your app.