How provide Up navigation with toolbar's home button on v7 toolbar

Question

I have a toolbar in my activity ( import android.support.v7.widget.Toolbar; ) and I'm trying to provide Up navigation using its home button. What I have:

Manifest:

<!-- ... -->
<activity android:name=".SettingsActivity"
          android:label="@string/settings"
          android:parentActivityName=".MainActivity"/>
<!-- ... -->

view_toolbar.xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:fitsSystemWindows="true"
    android:minHeight="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:elevation="4dp">
</android.support.v7.widget.Toolbar>

activity_settings.xml :

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <!-- Toolbar -->
    <include
        layout="@layout/view_toolbar" />

    <!-- ... -->

my onCreate method:

super.onCreate(bundle)
setContentView(R.layout.activity_settings);

// Set the toolbar
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

setSupportActionBar(toolbar);

So far I shouldn't have an up button and I don't. So we're fine. But when I tried to add it, I couldn't.

First I tried this:

getSupportActionBar().setDisplayShowHomeEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);

Didn't work. Then I tried this (as shown here):

toolbar.setNavigationOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
    Toast.makeText(ToolbarActivity.this, "Up clicked", 
        Toast.LENGTH_SHORT).show();
    NavUtils.navigateUpFromSameTask(ToolbarActivity.this);
}
});

I even tried a workaround I saw somewhere, involving creating a dummy menu and trying to get the event from onOptionsItemSelected (which is never called by the way).

What can I do? What is the correct way to provide Up navigation through toolbar?

Because you declare parent activity on manifest, so I think this answer may help: http://stackoverflow.com/a/12276100/719212 — ductran, Dec 15 '15 at 03:01
Did you find a solution to your issue? I am facing the same thing. For me the Back button or home icon does not give a call to `onOptionMenuSelected` neither in Fragment nor in the Activity. — AmeyaB, Dec 07 '16 at 00:01
@AmeyaB What about `onOptionsItemSelected` ?? Anyway.. The main idea is to catch the event from `android.R.id.home` button and `finish()` your activity there. Try "Daniel Martin Shum"'s answer below. What he says is right, even though it didn't solve my problem at the time. — TheCrafter, Dec 07 '16 at 10:28

score 15 · Answer 1 · answered Dec 15 '15 at 02:46

Did you have the below code to set your toolbar as the default activity actionbar?

setSupportActionBar(toolbar);

You did not set an image icon to the home button, maybe it shows up, but you just can't see it.

getSupportActionBar().setHomeAsUpIndicator(iconDrawable);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);

and as @Gonzalo said, you also have to override the menu select event to handle the home button onClick event

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
    // Respond to the action bar's Up/Home button
    case android.R.id.home:
        //handle the home button onClick event here.
        return true;
    case android.R.id.other_menu
        return true
    }

    return super.onOptionsItemSelected(item);
}

and why didn't you have a appbarlayout to contain the toolbar?

<android.support.design.widget.AppBarLayout
        android:id="@+id/baseAppbarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/baseToolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

</android.support.design.widget.AppBarLayout>

More actionbar implement details please have a look at my github project, hope it can help:

java code https://github.com/DanielShum/MaterialAppBase/blob/master/materialAppBaseLibrary/src/main/java/com/daililol/material/appbase/base/BaseActionbarActivity.java

xml code https://github.com/DanielShum/MaterialAppBase/blob/master/materialAppBaseLibrary/src/main/res/layout/base_actionbar_activity.xml

Thank you for your help. I tried using the `appbarlayout ` but it didn't work. Also, the back icon appears. I can see it normally but my pressing has no effect. — TheCrafter, Dec 15 '15 at 09:45

score 12 · Answer 2 · answered Nov 18 '17 at 09:09

12

1- set your toolbar

Toolbar toolbar = findViewById(R.id.toolbar);

2- setup your icon

    if (toolbar != null) {
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setHomeButtonEnabled(true);

    }

3- override this method

@Override
public boolean onSupportNavigateUp() {
    onBackPressed();
    return true;
}

answered Nov 18 '17 at 09:09

Bishoy Kamel

2,327
2
17
29

NB I didn't need to #setHomeButtonEnabled(true) when targetSDK=30 even though the doco says otherwise. – William Aug 10 '21 at 02:38
Very nice solution – Anti Atlas Dev Jun 26 '23 at 15:27

score 4 · Accepted Answer · answered Jan 19 '19 at 19:03

It's very simple. Just do the following steps:

Add the toolbar to the activity_child.xml:

(In my project, this AppBarLayout is placed inside a ConstraintLayout)

<android.support.design.widget.AppBarLayout
            android:id="@+id/appBarLayout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.AppBarOverlay"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="?attr/colorPrimary"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

</android.support.design.widget.AppBarLayout>

...

Set up the toolbar in the ChildActivity.java

public class ChildActivity extends AppCompatActivity
{

    @Override
    protected void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_child);

        Toolbar toolbar = findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);
        getSupportActionBar().setHomeAsUpIndicator(R.drawable.ic_arrow_back_black_24dp);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
  }

  ...
}

set the parentActivityName property in AndroidManifest.xml

<activity android:name=".ChildActivity"
            android:theme="@style/AppTheme.NoActionBar"
            android:parentActivityName=".ParentActivity"/>

Important

For this to work properly, do not call finish() in the parent activity after you call startActivity(intent).

Since I asked that question I've solved the problem many times with many different ways. I'll accept your answer because it's more updated than @Daniel Martin Shum answer. Sorry I took too long. I haven't logged in for ages. — TheCrafter, Oct 02 '19 at 09:27

score 2 · Answer 4 · answered Dec 15 '15 at 02:56

2

You can do it like this.

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setTitle(R.string.title);
toolbar.setNavigationIcon(R.mipmap.back); // just setNavigationIcon
setSupportActionBar(toolbar);

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
        // Respond to the toorbar's NavigationIcon as up/home button
        case android.R.id.home:
            //NavigationIcon
            return true;
    }
    return super.onOptionsItemSelected(item);
}

answered Dec 15 '15 at 02:56

Dong Wang

334
1
10

If you want to use toolbar, you should set your Activity noactionbar style. Such as: `` – Dong Wang Dec 15 '15 at 10:14
The toolbar itself IS working. The problem is with the home button. The toolbar is up and running. – TheCrafter Dec 15 '15 at 16:07

score 1 · Answer 5 · answered Jul 27 '17 at 07:27

I found a simple way. Which works perfectly according to expectation.

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar_id);
    toolbar.setTitleTextColor(Color.WHITE);
    toolbar.setTitle(getResources().getString(R.string.your_title));
    toolbar.setNavigationIcon(R.mipmap.back_btn);
    setSupportActionBar(toolbar);

    toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            onBackPressed();  // byDefault provided backPressed method, or handle your own way
        }
    });

Martin Zeitler · Answer 6 · 2021-10-09T14:47:15.320

1

One can select by ID home, when binding the event with ViewDataBinding:

this.getDataBinding().toolbarProducts.home.setOnClickListener(view -> {
    NavController controller = Navigation.findNavController(getDataBinding().getRoot());
    controller.navigateUp();
});

Nothing else worked for me inside a Fragment.

edited Oct 09 '21 at 14:47

answered Oct 09 '21 at 14:32

Martin Zeitler

1
19
155
216

score 0 · Answer 7 · answered Dec 15 '15 at 00:19

0

As far as I know the back button of the toolbar is treated as a menu item, so as you say you should override the onOptionsItemSelected.

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
    // Respond to the action bar's Up/Home button
    case android.R.id.home:
        //Home/back button
        return true;
    }
    return super.onOptionsItemSelected(item);
}

answered Dec 15 '15 at 00:19

Gonzalo

1,781
15
29

Tried it. Not working. The `onOptionsItemSelected` is never call, as I state in my post. – TheCrafter Dec 15 '15 at 00:24

score 0 · Answer 8 · answered Dec 15 '15 at 00:57

I too had this kind of issue earlier. I suspect there is something going on with include. Try to add an id to the toolbar included layout like

<include
    layout="@layout/view_toolbar"
    id = "@+id/incl_toobar"/>

And now try to get the toolbar using incl_toolbar.

Toolbar toolbar = (Toolbar) findViewById(R.id.incl_toolbar);

Hope this helps.

Regards,
Sree

How provide Up navigation with toolbar's home button on v7 toolbar

8 Answers8

Linked

Related