在工具栏上显示返回箭头

Question

我正在我的应用程序中从 ActionBar 迁移到 Toolbar。 但我不知道如何像在Actionbar 上那样在Toolbar 上的后退箭头上显示和设置点击事件。

使用ActionBar，我打电话给mActionbar.setDisplayHomeAsUpEnabled(true)。 但是没有类似的方法。

有没有人遇到过这种情况并找到解决方法？

Answer 1

如果您使用的是ActionBarActivity，那么您可以告诉Android 使用Toolbar 作为ActionBar，如下所示：

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

然后调用

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

会起作用。您也可以在附加到ActionBarActivities 的片段中使用它，您可以像这样使用它：

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

如果您没有使用ActionBarActivities，或者如果您想在未设置为SupportActionBar 的Toolbar 上获得返回箭头，那么您可以使用以下命令：

mActionBar.setNavigationIcon(getResources().getDrawable(R.drawable.ic_action_back));
mActionBar.setNavigationOnClickListener(new View.OnClickListener() {
   @Override
   public void onClick(View v) {
       //What to do on back clicked
   }
});

如果您使用的是android.support.v7.widget.Toolbar，那么您应该将以下代码添加到您的AppCompatActivity：

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

Answer 2

我看到了很多答案，但这是我之前没有提到的。它适用于 API 8+。

public class DetailActivity extends AppCompatActivity

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

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

    // add back arrow to toolbar
    if (getSupportActionBar() != null){
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
    }
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    // handle arrow click here
    if (item.getItemId() == android.R.id.home) {
        finish(); // close this activity and return to preview activity (if there is any)
    }

    return super.onOptionsItemSelected(item);
}

Answer 3

有很多方法可以实现，这是我最喜欢的：

布局：

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    app:navigationIcon="?attr/homeAsUpIndicator" />

活动：

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

toolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // back button pressed
    }
});

Answer 4

可以使用工具栏的setNavigationIcon方法。 Android Doc

mToolBar.setNavigationIcon(R.drawable.abc_ic_ab_back_mtrl_am_alpha);

mToolBar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        handleOnBackPress();
    }
});

Answer 5

如果你不想创建自定义Toolbar，你可以这样做

public class GalleryActivity extends AppCompatActivity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        ...  
        getSupportActionBar().setTitle("Select Image");
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        if (item.getItemId() == android.R.id.home) {
            finish();
        }
        return super.onOptionsItemSelected(item);
    }
}                     

在你AndroidManifest.xml

<activity
    android:name=".GalleryActivity"
    android:theme="@style/Theme.AppCompat.Light">        
</activity>

你也可以把这个android:theme="@style/Theme.AppCompat.Light" 放到<aplication> 标签上，适用于所有活动

Answer 6

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    toolbar.setNavigationIcon(R.drawable.back_arrow); // your drawable
    toolbar.setNavigationOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            onBackPressed(); // Implemented by activity
        }
    });

对于 API 21+ android:navigationIcon

<android.support.v7.widget.Toolbar
    android:navigationIcon="@drawable/back_arrow"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"/>

Answer 7

我从Google Developer Documentation使用了这个方法：

@Override
public void onCreate(Bundle savedInstanceState) {
  ...
  getActionBar().setDisplayHomeAsUpEnabled(true);
}

如果你得到一个空指针异常，它可能取决于主题。尝试在清单中使用不同的主题或替代使用：

@Override
public void onCreate(Bundle savedInstanceState) {
  ...
  getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}

然后在清单中，我为当前活动设置父活动：

<activity
        android:name="com.example.myapp.MyCurrentActivity"
        android:label="@string/title_activity_display_message"
     android:parentActivityName="com.example.myfirstapp.MainActivity" >
    <!-- Parent activity meta-data to support 4.0 and lower -->
    <meta-data
        android:name="android.support.PARENT_ACTIVITY"
        android:value="com.example.myapp.MyMainActivity" />
</activity>

希望对你有帮助！

Answer 8

如果您曾经使用AppCompatActivity 并且走上了不使用它的道路，因为您不想获得它提供的自动ActionBar，因为您想分离出Toolbar，因为你的 Material Design 需求和 CoordinatorLayout 或 AppBarLayout，那么，考虑一下：

你仍然可以使用AppCompatActivity，你不需要停止使用它，你可以在你的xml中使用<android.support.v7.widget.Toolbar>。只需关闭操作栏style如下：

首先，从您喜欢的 styles.xml 中的一个 NoActionBar 主题中派生出一种样式，我使用了 Theme.AppCompat.Light.NoActionBar，如下所示：

<style name="SuperCoolAppBarActivity" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorPrimary">@color/primary</item>

    <!-- colorPrimaryDark is used for the status bar -->
    <item name="colorPrimaryDark">@color/primary_dark</item>
    ...
    ...
</style>

在您的应用清单中，选择您刚刚定义的子样式主题，如下所示：

    <activity
        android:name=".activity.YourSuperCoolActivity"
        android:label="@string/super_cool"
        android:theme="@style/SuperCoolAppBarActivity">
    </activity>

在您的 Activity Xml 中，如果工具栏是这样定义的：

...
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        />
...

然后，这是重要的部分，您将支持操作栏设置到您正在扩展的 AppCompatActivity，以便您的 xml 中的工具栏，变成操作栏。我觉得这是一种更好的方式，因为您可以简单地执行 ActionBar 允许的许多事情，例如菜单、自动活动标题、项目选择处理等，而无需添加自定义点击处理程序等。

在您的 Activity 的 onCreate 覆盖中，执行以下操作：

@Override
protected void onCreate(Bundle savedInstanceState)
{
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_super_cool);
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);

    setSupportActionBar(toolbar);
    //Your toolbar is now an action bar and you can use it like you always do, for example:
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
} 

Answer 9

如果您使用的是androidx.appcompat.app.AppCompatActivity，请使用：

Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);

然后只需在Manifest.xml 中定义父Activity。

<activity
    android:name=".MyActivity"
    ...>
  <meta-data
      android:name="android.support.PARENT_ACTIVITY"
      android:value=".ParentActivity" />
</activity>

如果您使用的是 Toolbar 并且想要自定义行为，请使用：

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar" 
    app:navigationIcon="?attr/homeAsUpIndicator"
    .../>

在你的活动中：

Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        //....
    }
});

Answer 10

在 Kotlin 中会是

private fun setupToolbar(){
    toolbar.title = getString(R.string.YOUR_TITLE)
    setSupportActionBar(toolbar)
    supportActionBar?.setDisplayHomeAsUpEnabled(true)
    supportActionBar?.setDisplayShowHomeEnabled(true)
}

// don't forget click listener for back button
override fun onSupportNavigateUp(): Boolean {
    onBackPressed()
    return true
}

Answer 11

在工具栏上显示返回按钮的简单方法

将此代码粘贴到 onCreate 方法中

 if (getSupportActionBar() != null){

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

将此覆盖方法粘贴到onCreate方法之外

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    if(item.getItemId()== android.R.id.home) {

        finish();
    }
    return super.onOptionsItemSelected(item);
}

Answer 12

MyActivity extends AppCompatActivity {

    private Toolbar toolbar;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        ...
        toolbar = (Toolbar) findViewById(R.id.my_toolbar);
        setSupportActionBar(toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        toolbar.setNavigationOnClickListener(arrow -> onBackPressed());
    }

Answer 13

你可以轻松做到。

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

getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
@Override
public boolean onSupportNavigateUp() {
    onBackPressed();
    return true;
}

学分： https://freakycoder.com/android-notes-24-how-to-add-back-button-at-toolbar-941e6577418e

Answer 14

以AppCompatActivity为例，你可以这样做

public class GrandStatActivity extends AppCompatActivity {

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

    @Override
    public void onResume() {
        super.onResume();

        // Display custom title
        ActionBar actionBar = this.getSupportActionBar();
        actionBar.setTitle(R.string.fragment_title_grandstats);

        // Display the back arrow
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
    }

    // Back arrow click event to go to the parent Activity
    @Override
    public boolean onSupportNavigateUp() {
        onBackPressed();
        return true;
    }

}

Answer 15

首先，你需要初始化工具栏：

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

然后从操作栏中调用返回按钮：

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

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

Answer 16

在您想要执行的活动的清单文件中 添加一个后退按钮，我们将使用属性 android:parentActivityName

        <activity
        android:name=".WebActivity"
        android:screenOrientation="portrait"
        android:parentActivityName=".MainActivity"
        />

P.S. 这个属性是在 API Level 16 中引入的。

Answer 17

如果您想在未设置为 SupportActionBar 的工具栏上获得后退箭头：

（科特林）

val resId = getResIdFromAttribute(toolbar.context, android.R.attr.homeAsUpIndicator)
toolbarFilter.navigationIcon = ContextCompat.getDrawable(toolbar.context, resId)
toolbarFilter.setNavigationOnClickListener { fragmentManager?.popBackStack() }

从属性中获取资源：

@AnyRes
fun getResIdFromAttribute(context: Context, @AttrRes attr: Int): Int {
    if (attr == 0) return 0
    val typedValueAttr = TypedValue()
    context.theme.resolveAttribute(attr, typedValueAttr, true)
    return typedValueAttr.resourceId
}

Answer 18

效果很好

public class BackButton extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.chat_box);
        Toolbar chatbox_toolbar=(Toolbar)findViewById(R.id.chat_box_toolbar);
        chatbox_toolbar.setTitle("Demo Back Button");
        chatbox_toolbar.setTitleTextColor(getResources().getColor(R.color.white));
        setSupportActionBar(chatbox_toolbar);
        getSupportActionBar().setDisplayHomeAsUpEnabled(true);
        getSupportActionBar().setDisplayShowHomeEnabled(true);
        chatbox_toolbar.setNavigationOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                //Define Back Button Function
            }
        });
    }
}

Answer 19

将此添加到布局文件夹中活动的xml：

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">
    <android.support.v7.widget.Toolbar
        android:id="@+id/prod_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>

使工具栏可点击，将这些添加到 onCreate 方法：

Toolbar toolbar = (Toolbar) findViewById(R.id.prod_toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setDisplayShowHomeEnabled(true);
toolbar.setNavigationOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        finish();
    }
});

Answer 20

可能是从主题中获取向上图标的更可靠方法（如果不使用工具栏作为操作栏）：

toolbar.navigationIcon = context.getDrawableFromAttribute(R.attr.homeAsUpIndicator)

为了将主题属性转换为可绘制对象，我使用了扩展功能：

fun Context.getDrawableFromAttribute(attributeId: Int): Drawable {
    val typedValue = TypedValue().also { theme.resolveAttribute(attributeId, it, true) }
    return resources.getDrawable(typedValue.resourceId, theme)
}

Answer 21

如果您想快速简单地解决问题，请按照 3 个步骤操作：

将文件 ic_arrow.xml 添加到 Drawable 文件夹，下面有一些代码（将下面的代码添加到 ic_arrow.xml 中）

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:width="24dp"
android:height="24dp"
android:tint="@color/black"
android:viewportWidth="24"
android:viewportHeight="24"
tools:ignore="ExtraText">
<path
    android:fillColor="@android:color/white"
    android:pathData="M20,11H7.83l5.59,-5.59L12,4l-8,8 8,8 1.41,-1.41L7.83,13H20v-2z" />
</vector>

将ImageButton 添加到Toolbar（确保自定义工具栏，而不是标题栏或状态栏）- 如果需要，您可以自定义 ImageButton（箭头按钮）的位置

<ImageButton
android:id="@+id/arrow"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_arrow"
android:layout_marginTop="15dp"
android:layout_marginStart="15dp"
android:background="@android:color/transparent"
tools:ignore="ContentDescription" />

将setArrowButton 方法添加到DetailActivity.java（或您需要的任何xxxActivity.java）

public class DetailActivity extends AppCompatActivity {
    ImageButton arrowButton;

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

    arrowButton = findViewById(R.id.arrow);

    setArrowButton(arrowButton);
}

public void setArrowButton(ImageButton arrowButton) {
    arrowButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            finish(); //will close the moment activity and return to 
                      //the last activity
        }
    });
   }
}

完成

关于箭头按钮的预览

Answer 22

如果您将 DrawerLayout 与 ActionBarDrawerToggle 一起使用，则显示 Back 按钮而不是 Menu 按钮（以及反之亦然），您需要在 Activity 中添加此代码：

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    // ...

    mDrawerLayout = (DrawerLayout) findViewById(R.id.drawer_layout);
    mDrawerToggle = new ActionBarDrawerToggle(this, mDrawerLayout, toolbar, R.string.application_name, R.string.application_name);
    mDrawerLayout.addDrawerListener(mDrawerToggle);

    mDrawerToggle.setHomeAsUpIndicator(R.drawable.ic_arrow_back_white_32dp);
    mDrawerToggle.setToolbarNavigationClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            onBackPressed(); // Or you can perform some other action here when Back button is clicked.
        }
    });
    mDrawerToggle.syncState();
    // ...
}

@Override
public boolean onOptionsItemSelected(MenuItem item) {
    if (mDrawerToggle.onOptionsItemSelected(item))
        return true;

    switch (item.getItemId()) {
        case android.R.id.home:
            onBackPressed();
            return true;
        // ...
    }

    return super.onOptionsItemSelected(item);
}

public void showBackInToolbar(boolean isBack) {
    // Remove next line if you still want to be able to swipe to show drawer menu.
    mDrawerLayout.setDrawerLockMode(isBack ? DrawerLayout.LOCK_MODE_LOCKED_CLOSED : DrawerLayout.LOCK_MODE_UNLOCKED);
    mDrawerToggle.setDrawerIndicatorEnabled(!isBack);
    mDrawerToggle.syncState();
}

所以当你需要显示Back按钮而不是Menu按钮时，调用showBackInToolbar(true)，如果你需要菜单按钮，调用showBackInToolbar(false)。

您可以生成返回箭头 (ic_arrow_back_white_32dp)over here，在 Clipart 部分搜索 arrow_back（使用默认 32dp 和 8dp 填充）。只需选择您想要的颜色即可。

Answer 23

您可以随时在您的Toolbar 中添加Relative layout 或Linear Layout，并根据需要在工具栏中的任意位置放置后退图标或关闭图标的图像视图

例如，我在工具栏中使用了相对布局

 <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar_top"
                android:layout_width="match_parent"
                android:layout_height="35dp"
                android:minHeight="?attr/actionBarSize"
                android:nextFocusDown="@id/netflixVideoGridView"
                app:layout_collapseMode="pin">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content">


                    <TextView

                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text="Myflix"
                        android:textAllCaps="true"
                        android:textSize="19sp"
                        android:textColor="@color/red"
                        android:textStyle="bold" />


                    <ImageView
                        android:id="@+id/closeMyFlix"
                        android:layout_alignParentRight="true"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center_vertical"
                        app:srcCompat="@drawable/vector_close" />


                </RelativeLayout>

            </android.support.v7.widget.Toolbar>

它看起来像这样：

您可以像这样从 Activity 或片段中在该图像视图上添加点击侦听器。

  closeMyFlix.setOnClickListener({
            Navigator.instance.showFireTV(  activity!!.supportFragmentManager)
        })

Answer 24

有了 Kotlin，它变成了：

XML：

<include
android:id="@+id/tbSignToolbar "
layout="@layout/toolbar_sign_up_in"/>

在您的活动中：-

setSupportActionBar(tbSignToolbar as Toolbar?)//tbSignToolbar :id of your toolbar 
supportActionBar?.setDisplayHomeAsUpEnabled(true)
supportActionBar?.setDisplayShowHomeEnabled(true)

Answer 25

如果您使用的是 JetPack Navigation。

这是 MainActivity 的布局

<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
                                               xmlns:app="http://schemas.android.com/apk/res-auto"
                                               xmlns:tools="http://schemas.android.com/tools"
                                               android:layout_width="match_parent"
                                               android:layout_height="match_parent"
                                               tools:context=".MainActivity">

<androidx.appcompat.widget.Toolbar
        android:id="@+id/toolBar"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

</androidx.appcompat.widget.Toolbar>

<fragment
        android:id="@+id/my_nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:layout_constraintTop_toBottomOf="@id/toolBar"
        app:layout_constraintBottom_toTopOf="parent"
        app:navGraph="@navigation/nav_graph"/>

在 Activity 类的 onCreate() 中设置工具栏，如下所示。

val navHostFragment = supportFragmentManager
        .findFragmentById(R.id.my_nav_host_fragment) as NavHostFragment? ?: return

val navController = navHostFragment.findNavController()
val toolBar = findViewById<Toolbar>(R.id.toolBar)
setSupportActionBar(toolBar) // To set toolBar as ActionBar
setupActionBarWithNavController(navController)

setupActionBarWithNavController(navController) 如果需要，将在工具栏上创建一个后退按钮并处理后退按钮功能。 如果您需要编写 CustomBack 功能，请在您的片段 onCreate() 方法上创建如下回调

val callback = requireActivity().onBackPressedDispatcher.addCallback(this) {
        // Handle the back button event
    }

来自文档：https://developer.android.com/guide/navigation/navigation-custom-back

Answer 26

也许它会帮助某人，我没有在答案中找到我最后所做的事情： 与 ActionBarDrawerToggle mDrawerToggle; 在工具栏中显示后退箭头： mDrawerToggle.setDrawerIndicatorEnabled(false);

如果你想让它在工具栏中显示汉堡包：

mDrawerToggle.setDrawerIndicatorEnabled(true);