启用后退按钮时工具栏标题不在中心

Toolbar title not in center when Back Button is enable

我试图在中心显示我的工具栏标题,为此我使用了此答案中给出的方法:-Toolbar Center title

但是,当我通过以下代码在 activity 中启用后退按钮时:

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

工具栏的标题没有显示在中间,而是稍微向右off-centered。

如何实现标题居中而不 受后退按钮或菜单栏的影响?

不要这样设置属性

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

这样做

        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        // Title and subtitle
        toolbar.setTitle(R.string.about_toolbar_title);
        toolbar.setSubtitleTextColor(Color.WHITE);
        toolbar.setTitleTextColor(Color.WHITE);
        toolbar.setBackgroundColor(getResources().getColor(
                R.color.themeToolbarColor));
        toolbar.setNavigationIcon(R.drawable.ic_action_back);
        toolbar.setNavigationOnClickListener(new OnClickListener() {

            @Override
            public void onClick(View v) {
               finish();  // to go back  finish() will do your work.
                //mActionBar.setDisplayHomeAsUpEnabled(true);
                //mActionBar.setDisplayShowHomeEnabled(true);
            }
        });

在工具栏中添加一个 TextView 并且不要忘记在您的 TextView 中设置以下属性。

android:layout_marginRight="?android:attr/actionBarSize"

OR

android:layout_marginEnd="?android:attr/actionBarSize"

代码片段:

<android.support.v7.widget.Toolbar
    android:id="@+id/custom_toolbar"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/actionBarSize"
    android:background="@android:color/holo_red_dark">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="abc"
        android:textColor="@android:color/white"
        android:textSize="20sp"
        android:layout_marginRight="?android:attr/actionBarSize"
        android:gravity="center"/>

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

有关详细信息,请参阅 this 教程。

只需将 android:paddingEnd="72dp; 添加到工具栏布局。

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/actionBarSize"
    app:contentScrim="@color/colorPrimary"
    app:layout_collapseMode="pin"
    android:paddingEnd="72dp"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Dark"
    app:title="Title"/>

具有与后退箭头相同大小的占位符图像并将其设置为 不可见 当后退箭头为 未显示消失当它是displayed 对我有用。

<?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:background="@color/blue"
    android:minHeight="?attr/actionBarSize"
    app:contentInsetEnd="0dp"
    app:contentInsetLeft="0dp"
    app:contentInsetRight="0dp"
    app:contentInsetStart="0dp"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

<ImageView
    android:id="@+id/iv_placeholder"
    android:layout_width="72dp"
    android:layout_height="48dp"
    android:src="@drawable/ic_actionbar_hamburger"
    android:visibility="invisible"/>


<TextView
    android:id="@+id/logo_tv"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginEnd="?attr/actionBarSize"
    android:gravity="center"
    android:text=""
    android:textColor="@color/white"
    android:textStyle="normal"/>

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

当您使用后退按钮作为导航图标时标题不居中的原因是导航图标表示为 AppCompatImageButton 并且添加到与您的标题相同的布局 TextView .使用 Arshak's answer is not a bad idea, but ?android:attr/actionBarSize is not a good way to define the end margin. As the action bar height is probably the same size as icon's width, it might work, but might not work on all devices. Could be a good idea to specify this size from material design guidelines.

只需将您的内容放在 XML 中工具栏标签内的子视图中,使用以下属性:

android:layout_width="wrap_content"
android:layout_gravity="center"

工具栏状态的官方文档:

One or more custom views. The application may add arbitrary child views to the Toolbar. They will appear at this position within the layout. If a child view's LayoutParams indicates a Gravity value of Gravity#CENTER_HORIZONTAL the view will attempt to center within the available space remaining in the Toolbar after all other elements have been measured.

这对我有用,使用 androidx.appcompat.widget.Toolbar 和子视图。

在我的例子中,我在工具栏内使用了一个图像视图,我不想在 activity 的片段之间导航时四处移动。 我通过将它放在工具栏之外来使其居中。我使用了 constraintlayouts

<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:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">

<com.google.android.material.appbar.MaterialToolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">



</com.google.android.material.appbar.MaterialToolbar>

<ImageView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_constraintTop_toTopOf="@id/toolbar"
    app:layout_constraintBottom_toBottomOf="@id/toolbar"
    android:src="@drawable/ic_logo"
    tools:ignore="ContentDescription" />
 ...

</androidx.constraintlayout.widget.ConstraintLayout>

我认为最好和最新的方法是完全控制应用栏。这样您就可以从文本视图位置更改其他内容。

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


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

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/app_name"
                android:textSize="20dp"
                android:textColor="?attr/colorPrimary"
                android:layout_centerInParent="true"
                android:layout_marginEnd="20dp"/>

        </RelativeLayout>

    </androidx.appcompat.widget.Toolbar>

您可以直接在 activity 中使用它。但是,您可能需要通过在添加此工具栏的 activity 中进行此类定义来更改活动工具栏。

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