在工具栏右侧添加自定义视图

Question

我正在尝试实现这个功能（在工具栏中带有红色背景的计时器）：

我试图在工具栏中添加customView，但它总是出现在极左边，就在返回箭头旁边。像下面图像中的文本YP是添加到工具栏的自定义Textview。。

toolbar的代码：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    android:id="@+id/base_activity_toolbar"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:minHeight="?attr/actionBarSize"
    android:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" />

添加布局的代码：

    LayoutInflater mInflater= LayoutInflater.from(context);
    View mCustomView = mInflater.inflate(R.layout.textview, null);
    toolbar.addView(mCustomView);

这是我现在正在添加用于测试的布局：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="horizontal"
              android:layout_width="wrap_content"
              android:gravity="end"
              android:layout_height="wrap_content">
    <TextView android:layout_width="wrap_content"
              android:text="yp"
              android:layout_height="wrap_content"/>
</LinearLayout>

我正在错过一个重要的东西，无法弄清楚。让我抓狂。

- Shubham

---

å°†LinearLayoutçš„layout_width更改为match_parent。 - Mike M.

Answer 1

我刚刚将layout_gravity设置为right，然后它就起作用了

  <android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="0dp"
    android:layout_height="?android:actionBarSize"
    app:title="NEW REQUESTS"
  >
    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="blahblah"
      android:layout_gravity="right"  
      />
  </android.support.v7.widget.Toolbar>

- charlag

---

我简直不敢相信，那居然奏效了！A.S.在Toolbar内的TextView中没有提供layout_gravity选项，所以我之前从未尝试过。 - Anarchofascist

@Anarchofascist，是的，你说得对，Toolbar中没有layout_gravity选项，但是如果你自己添加了它，系统会接受的。 - shehzy

Answer 2

你可以在Toolbar内部添加ViewGroups。

          <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="@dimen/toolbar_height"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
            app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <RelativeLayout
             ....
            </RelativeLayout>

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

- Anoop M Maddasseri

---

当我像这样做的时候，虽然我看到了我添加的 TextView，但它不再显示 Toolbar 标题。有什么想法为什么会这样？ - AdamMc331

你是否指定了 getSupportActionBar().setDisplayShowTitleEnabled(false);？或者可能是 TextView 覆盖了工具栏标题。 - Anoop M Maddasseri

是的，因为RelativeLayout被添加到工具栏标题的左侧。特别是如果您添加了alignParentRight="true"，它会将标题推出视野。我已经添加了另一个答案来解决这个问题，一个带有所有代码的评论会太长。 - Ali Kazi

Answer 3

给出的答案有效，但如果您想为工具栏设置标题（最有可能的情况），那么添加一个RelativeLayout会将标题推到右侧视图之外。在这种情况下，您需要通过设置getSupportActionBar().setDisplayShowTitleEnabled(false)来禁用工具栏标题，并在要添加到工具栏的其他视图旁边添加自定义TextView。

例如，您可以通过以下方式添加ImageView：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
    android:id="@+id/base_activity_toolbar"
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="?attr/colorPrimary"
    android:elevation="4dp"
    android:minHeight="?attr/actionBarSize"
    android:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

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

        <TextView
            android:id="@+id/custom_toolbar_title"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            style="@style/ActionBarTitle"/>

        <ImageView
            android:layout_width="20dp"
            android:layout_height="20dp"
            android:scaleType="centerCrop"
            android:adjustViewBounds="true"
            android:layout_centerVertical="true"
            android:layout_toRightOf="@id/custom_toolbar_title"
            android:src="@drawable/arrow"/>

    </RelativeLayout>

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

- Ali Kazi

---

运行良好，对于那些需要 style="@style/ActionBarTitle" 的人，还有style="@style/TextAppearance.AppCompat.Widget.ActionBar.Title"。 - Vasile Doe

Answer 4

我发现了与之前一样的问题，但我找到了一个更简单（在我个人看来）的解决方案。

你可以稍微改变你的代码：

LayoutInflater mInflater= LayoutInflater.from(context);
View mCustomView = mInflater.inflate(R.layout.textview, null);
toolbar.addView(mCustomView);

收件人：

LayoutInflater mInflater= LayoutInflater.from(context);
View mCustomView = mInflater.inflate(R.layout.textview, null);
toolbar.addView(mCustomView, new Toolbar.LayoutParams(Gravity.RIGHT));

然后将该视图添加，并将其重心设置为右侧！

- Sylfo

---

很好，如果你正在以编程方式构建视图，这是完美的解决方案。谢谢。 - Bruno Oliveira

完美的解决方案！运行得非常好。 - Emre Akcan

运行得非常完美。我不得不将R.layout.textview的父布局更改为FrameLayout。 - ylinkz

Answer 5

试一下，将 R.layout.textview 更改为

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

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="TV"
                    android:id="@+id/textView2"
                    android:layout_centerVertical="true"
                    android:layout_alignParentRight="true"
                    android:layout_alignParentEnd="true" />
            </RelativeLayout>

- Akash kv

Answer 6

我会简单选择

<androidx.appcompat.widget.Toolbar
 ...>

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end"
        android:text="text aligned right" />

</androidx.appcompat.widget.Toolbar>

- Mieszko Koźma