当启用后退按钮或 hamberger 按钮时，位于工具栏标题末尾的自定义工具栏侧 textView 被分离

Question

<androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorPrimary"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

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

                <TextView
                    android:id="@+id/toolbar_text_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginEnd="?android:attr/actionBarSize"
                    android:fontFamily="@font/inter_semi_bold"
                    android:textColor="@color/layout_main_text_color"
                    android:textSize="@dimen/_20ssp"
                    tools:text="Toolbar" />

                <TextView
                    android:id="@+id/total_job_text_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_toEndOf="@+id/toolbar_text_view"
                    android:background="@drawable/rectangle_blue_gradient_with_thirty_radius"
                    android:paddingLeft="@dimen/_7sdp"
                    android:paddingTop="@dimen/_1sdp"
                    android:paddingRight="@dimen/_7sdp"
                    android:paddingBottom="@dimen/_1sdp"
                    android:text="1425"
                    android:textColor="@color/white"
                    android:textSize="@dimen/_7ssp" />

            </RelativeLayout>

        </androidx.appcompat.widget.Toolbar>

在这个项目中，我使用了导航组件。我想在 "Job Board" 旁边用蓝色边框显示数字。我看了一下这个解决方案。 .该解决方案能够解决工具栏文本居中而不是数字居中的问题。我想要这种类型的输出

Answer 1

在您的 textView 中添加这一行

android:layout_centerHorizontal = "true"

这将解决您的问题

Answer 2

尝试删除 android:layout_marginEnd="?android:attr/actionBarSize" 并使用 alignParentLeft=true 或 layout_margenStart。希望有用。

Answer 3

将您的工具栏文本边距修改得更小。

@+id/toolbar_text_view

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

到

 android:layout_marginEnd="5dp"

Answer 4

你必须约束布局

<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=".view.ui.zzzzActivity">
<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="@color/colorPrimary"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="parent">

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

        <TextView
            android:id="@+id/toolbar_text_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="?android:attr/actionBarSize"
            android:textSize="@dimen/tulisan20sp"
            tools:text="Toolbar"
            android:textColor="@color/colorwhite"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

        <TextView
            android:id="@+id/total_job_text_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toEndOf="@+id/toolbar_text_view"
            android:layout_marginTop="@dimen/dimen8dp"
            android:text="1425"
            android:textColor="@color/colorwhite"
            android:layout_marginEnd="@dimen/dimen40dp"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"/>

    </androidx.constraintlayout.widget.ConstraintLayout>

</androidx.appcompat.widget.Toolbar>

更新如果您希望数字在片段中不可见，您可以设置可见：不可见和始终居中的文本：

您可以通过编程方式设置：

textview.setVisible(View.INVISIBLE)

不要

textview.setVisible(View.GONE)

如果你想设置可见：

textview.setVisible(View.VISIBLE)

Answer 5

从 TextView 中删除行:-

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

在相对布局中添加这一行：-

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

希望它能奏效。

Answer 6

我终于解决了这个问题。罪魁祸首是 contentinsetstart，它在大小为 72 dp 的工具栏的开头采用 72 dp 作为填充。所以我所做的是，我只是在 toolbarTextView 中给出了负的 72 边距。一切都如预期的那样运行 :)

<androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="@color/colorPrimary"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

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

                <TextView
                    android:id="@+id/toolbar_text_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="-72dp"
                    android:fontFamily="@font/inter_semi_bold"
                    android:textColor="@color/layout_main_text_color"
                    android:textSize="@dimen/_20ssp"
                    tools:text="Toolbar" />

                <TextView
                    android:id="@+id/total_job_text_view"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_toEndOf="@+id/toolbar_text_view"
                    android:background="@drawable/rectangle_blue_gradient_with_thirty_radius"
                    android:paddingLeft="@dimen/_7sdp"
                    android:paddingTop="@dimen/_1sdp"
                    android:paddingRight="@dimen/_7sdp"
                    android:paddingBottom="@dimen/_1sdp"
                    android:text="1425"
                    android:textColor="@color/white"
                    android:textSize="@dimen/_7ssp"
                    android:visibility="invisible" />

            </RelativeLayout>

        </androidx.appcompat.widget.Toolbar>

和 destinationChangeListener 看起来完全一样

navController.addOnDestinationChangedListener { _, destination, _ ->
            if (destination.id != R.id.tutorHomeFragment) {
                total_job_text_view.visibilityGone()
            }

            with(toolbar_text_view) {
                when(destination.id) {
                    R.id.tutorHomeFragment -> text = getString(R.string.job_board)
                    R.id.tutorProfileFragment -> text = getString(R.string.profile)
                    R.id.tutorStatusFragment -> text = getString(R.string.status)
                    R.id.tutorSettingFragment -> text = getString(R.string.settings)
                    R.id.tutorMessageFragment -> text = getString(R.string.message)
                    R.id.confirmationLetterFragment -> text = getString(R.string.confirmation_letter)
                    R.id.paymentFragment -> text = getString(R.string.payment)
                }
            }

        }

当启用后退按钮或 hamberger 按钮时，位于工具栏标题末尾的自定义工具栏侧 textView 被分离

Custom Toolbar side textView which is in the end of Toolbar title got detached when back button or hamberger Button is enable

android

android-layout

android-toolbar