折叠式工具栏标题未居中

6

我的应用程序包含一个带有标题的可折叠工具栏。当它展开时,标题位于中心位置,当它正在折叠时,应该保持居中。使用下面的布局,我的设备在折叠时不会将标题居中,而是稍微向右移动。我需要改变什么才能让它始终居中?如果有帮助,我当然可以添加图片。

我的布局:

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

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appBar"
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:fitsSystemWindows="true"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:fitsSystemWindows="true"
            app:expandedTitleGravity="center|bottom"
            app:title="Test"
            app:collapsedTitleGravity="center"
            app:expandedTitleMarginBottom="56dp"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:toolbarId="@+id/toolbar">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:layout_marginBottom="48dp"
                app:layout_collapseMode="pin"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

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

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginLeft="10dp"
        android:layout_marginRight="10dp"
        android:layout_marginTop="10dp"
        android:fillViewport="true"
        android:layout_gravity="fill_vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">>

    </android.support.v4.widget.NestedScrollView>
</android.support.design.widget.CoordinatorLayout>

这是展开后的效果

正如您在此图像上所看到的,它没有居中对齐,而是稍微向右移动了一点


1
对的,它从中心位置向右移动了一点。我尝试使用 app:collapsedTitleGravity="center" 将其居中,由于在展开模式下也是居中的,因此它应该只是直接上升,但它确实也会向一侧移动。 - user9155899
更新您的工具栏截图将有助于更准确地找到问题。 - Mohamed Mohaideen AH
7
尝试在工具栏中添加属性app:contentInsetLeft="0dp"app:contentInsetStart="0dp",如果不起作用,请再添加此属性app:contentInsetStartWithNavigation="0dp"。希望能有所帮助。 - Mohamed Mohaideen AH
工具栏设计中视图之间存在默认填充,因此会占用空间。您可以从文档中了解更多信息。 - Mohamed Mohaideen AH
好的,谢谢你的帮助! - user9155899
显示剩余7条评论
3个回答

1

将与内容相关的属性设置为0dp将有所帮助。这是我正在使用的工具栏条目。

<androidx.appcompat.widget.Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    app:contentInsetLeft="0dp"
                    android:contentInsetLeft="0dp"
                    app:contentInsetStartWithNavigation="0dp"
                    app:contentInsetStart="0dp"
                    android:contentInsetStart="0dp"
                    app:theme="@style/YourTheme"
                    android:gravity="center_horizontal"
                    android:layout_height="?attr/actionBarSize"
                    app:layout_collapseMode="pin"
                    app:titleMargin="0dp" />

希望它有所帮助 :)


1

这是因为右上角的后退按钮。解决方法是在工具栏中添加marginEnd。

<com.google.android.material.appbar.CollapsingToolbarLayout
    android:id="@+id/htab_collapse_toolbar"
    android:layout_width="match_parent"
    android:layout_height="110dp"
    app:expandedTitleMargin="@dimen/margin_15"
    app:collapsedTitleTextAppearance="@style/test1"
    app:expandedTitleTextAppearance="@style/test"
    app:collapsedTitleGravity="center_horizontal"
    app:layout_scrollFlags="scroll|exitUntilCollapsed"
    android:fitsSystemWindows="true"
    app:title="Send money">
    <androidx.appcompat.widget.Toolbar
        android:id="@+id/htab_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:layout_marginEnd="85dp"
        android:layout_gravity="top"
        app:layout_collapseMode="pin"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />
</com.google.android.material.appbar.CollapsingToolbarLayout>

0

当左侧显示返回导航按钮且标题未居中时,我遇到了折叠工具栏的同样问题。

我的解决方案是更改工具栏标题的边距,将marginStart设置为带有减号的返回按钮尺寸,以将标题向左移动:

在fragment.kt文件中实现:

toolbar.setTitleMargin(R.dimen.back_button.dimenToResPixel(), 0, 0, 0)

in dimens.xml

<dimen name="back_button">-40dp</dimen>

当后退导航按钮消失时,将其设置为0。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接