Question

编辑：现在，我的Toolbar自定义toolbar.xml与activity_main.xml的布局不同。现在，新版式仅包含一个TextView标题。 Toolbar有一个overflow menu，其中仅包含一项（设置图标），并且设置为showAsAction="always"。但是，在布局预览中，我看不到实际的设置图标，因此我无法使用该图标align标题TextView以避免任何未对准的情况（参见图片）。有什么想法吗？

toolbar.xml：

<?xml version="1.0" encoding="utf-8"?>
<androidx.appcompat.widget.Toolbar 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="70dp"
    android:background="@drawable/toolbar_gradient"
    android:elevation="4dp"
    app:titleTextColor="@android:color/white"
    app:layout_scrollFlags="scroll|enterAlways">

    <TextView
        android:id="@+id/toolbar_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:text="@string/toolbar_title_placeholder"
        android:fontFamily="@font/montserrat_semibold"
        android:textColor="@android:color/white"
        android:textSize="20sp" />
</androidx.appcompat.widget.Toolbar>

如下图所示，我的标题TextView与overflow menu item（设置图标）未对齐。我有办法解决这个问题吗？

Answer 1

用 app:elevation="0dp" 添加CoordinatorLayout和AppBarLayout。

    <?xml version="1.0" encoding="utf-8"?>
    <androidx.coordinatorlayout.widget.CoordinatorLayout 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"
        >
        <com.google.android.material.appbar.AppBarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:theme="@style/AppTheme.AppBarOverlay"
                app:elevation="0dp">

                <androidx.appcompat.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"
                  app:titleTextAppearance="@style/Toolbar.TitleText"
                  app:layout_scrollFlags="scroll|enterAlways"
                    > 
                 //Your work
                </androidx.appcompat.widget.Toolbar>

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

     <androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
       >

      //Your work
    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Answer 2

[{id:2,name:'first'}, {id:2,name:'second'}, {id:3}] .slice().reverse() .filter((v, i, a) => a.findIndex((t) => (t.id === v.id)) === i) .reverse()是工具栏的非标准高度，这是布局的根本问题。如果您停留在70dp工具栏高度上，则需要对工具栏布局进行调整。

这是仅修改XML布局的一种方法。工具栏中的70dp填充将使图标向下移动。对文本视图进行相应的更改可使文本视图保持对齐。

7dp

要了解发生了什么，请进行更改并运行该应用程序。在Android Studio中，转到“工具”->“布局检查器”，然后选择您的设备和应用。您将看到的是您可以检查的布局转储。

此方法适用于您发布的内容。它可能会对其他视图的放置产生副作用，因此请注意监视。

替代方案涉及代码来检索与设置图标相对应的视图。如果我还记得，那不是很漂亮。

顺便说一句，您没有在Android Studio中看到设置图标，因为菜单项是在运行时添加的。

Answer 3

我们知道Android在设计模式中有一些特定的规则，例如工具栏大小，图标大小等。

Android更喜欢在工具栏中使用actionBarSize。

?android:attr/actionBarSize

在这种情况下，如果您需要自定义尺寸工具栏，则应创建自己的自定义工具栏，如下所示：

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

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="70dp"
                android:background="@color/colorWhite"
                android:contentInsetLeft="0dp"
                android:contentInsetStart="0dp"
                android:elevation="0.1dp"
                android:paddingEnd="10dp"
                android:paddingStart="10dp"
                app:contentInsetLeft="0dp"
                app:contentInsetStart="0dp"
                app:layout_scrollFlags="scroll|enterAlways|snap"
                tools:targetApi="lollipop">

                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:gravity="center"
                    android:orientation="horizontal">


                    <LinearLayout
                        android:id="@+id/search_layout"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="start"
                        android:orientation="horizontal">


                        <ImageView
                            android:id="@+id/toolbar_start_image_view"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:padding="5dp"
                            android:src="@drawable/ic_search_black_24dp"

                            />


                    </LinearLayout>


                    <TextView
                        android:id="@+id/toolbar_title"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_gravity="center"
                        android:fontFamily="@font/bold"
                        android:gravity="center"
                        android:text="Visit Tulsipur"
                        android:textColor="@color/colorBlack"
                        android:textSize="18sp" />

                    <LinearLayout
                        android:id="@+id/notification_layout"
                        android:layout_width="0dp"
                        android:layout_height="wrap_content"
                        android:layout_weight="1"
                        android:gravity="end"
                        android:orientation="horizontal">


                        <ImageView
                            android:id="@+id/toolbar_end_image_view"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:padding="5dp"
                       android:src="@drawable/ic_notifications_none_black_24dp"

                            />


                    </LinearLayout>

                </LinearLayout>

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

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

现在您可以在定义的ImageView / Layout中单击。

输出

将溢出菜单项的图标与工具栏标题对齐

3 个答案: