title: Navigation Architecture Component - how to set/change custom back or hamburger icon with navigation controller?
body: <p>I am trying to implement the newly introduced <a href="https://developer.android.com/topic/libraries/architecture/navigation/navigation-implementing" rel="noreferrer">Navigation Architecture Component</a> provided with <a href="https://developer.android.com/jetpack/" rel="noreferrer">Jetpack</a>. as far it's very cool and useful for managing navigation flow of your app.</p>
  
  <p>I have already setup the basic navigation including drawer layout with the toolbar in MainActivity like this:</p>
  
  <pre><code>class MainActivity : AppCompatActivity() {
  
      override fun onCreate(savedInstanceState: Bundle?) {
          super.onCreate(savedInstanceState)
          setContentView(R.layout.activity_main)
  
          val navController = Navigation.findNavController(this, R.id.mainNavFragment)
  
          // Set up ActionBar
          setSupportActionBar(toolbar)
          NavigationUI.setupActionBarWithNavController(this, navController, drawerLayout)
  
          // Set up navigation menu
          navigationView.setupWithNavController(navController)
      }
  
      override fun onSupportNavigateUp(): Boolean {
          return NavigationUI.navigateUp(Navigation.findNavController(this, R.id.mainNavFragment), drawerLayout)
      }
  }
  </code></pre>
  
  <p>With this layout:</p>
  
  <pre><code>&lt;LinearLayout
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical"&gt;
  
      &lt;android.support.design.widget.AppBarLayout
          android:id="@+id/appbar"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:theme="@style/AppTheme.AppBarOverlay"&gt;
  
          &lt;android.support.v7.widget.Toolbar
              android:id="@+id/toolbar"
              android:layout_width="match_parent"
              android:layout_height="?attr/actionBarSize"
              app:popupTheme="@style/AppTheme.PopupOverlay"
              app:navigationIcon="@drawable/ic_home_black_24dp"/&gt;
  
      &lt;/android.support.design.widget.AppBarLayout&gt;
  
      &lt;fragment
          android:id="@+id/mainNavFragment"
          android:name="androidx.navigation.fragment.NavHostFragment"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          app:defaultNavHost="true"
          app:navGraph="@navigation/nav_main"/&gt;
  
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p>It works fins. But, the real question is when provided custom design for an app,</p>
  
  <blockquote>
    <p><strong>how can I set custom icon for hamburger or the back icon?</strong></p>
  </blockquote>
  
  <p>which is as of now, being handled by NavigatoinController itself.</p>
  
  <p><a href="https://i.stack.imgur.com/uW6Hv.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/uW6Hv.jpg" alt="enter image description here"></a></p>
  
  <p>I already tried options below, but it doesn't work:</p>
  
  <pre><code>app:navigationIcon="@drawable/ic_home_black_24dp" //1
  supportActionBar.setHomeAsUpIndicator(R.drawable.ic_android_black_24dp) //2
  </code></pre>
  
  <p>Thanks!</p>