时间戳

首页 > 解决方案 > 显示 navigationIcon 时工具栏切换到右侧

android - 显示 navigationIcon 时工具栏切换到右侧

问题描述

这是我的自定义工具栏： 在此处输入图像描述

工具栏_custom.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"
        xmlns:tools="http://schemas.android.com/tools"
        android:id="@+id/toolbar_main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/AppNavigationButtonToolbar"
        app:contentInsetLeft="0dp"
        app:contentInsetStart="0dp"
        app:contentInsetStartWithNavigation="0dp"
        app:popupTheme="@style/AppNavigationButtonToolbar">

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

            <ImageView
                android:id="@+id/ic_toolbar"
                android:layout_width="wrap_content"
                android:layout_height="@dimen/dimen_28"
                android:layout_gravity="center"
                android:layout_margin="@dimen/dimen_8"
                android:src="@drawable/ic_chat_black"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintLeft_toLeftOf="parent"
                app:layout_constraintRight_toRightOf="parent"
                app:layout_constraintTop_toTopOf="parent" />

            <View
                android:id="@+id/separator"
                android:layout_width="match_parent"
                android:layout_height="2dp"
                android:background="@color/greenLight"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
                app:layout_constraintStart_toStartOf="parent" />
        </androidx.constraintlayout.widget.ConstraintLayout>
    </androidx.appcompat.widget.Toolbar>

在哪里

<style name="AppNavigationButtonToolbar" parent="@style/Widget.AppCompat.Toolbar">
        <item name="android:minWidth">0dp</item>
        <item name="android:scaleType">centerInside</item>
        <item name="titleMargin">0dp</item>
        <item name="contentInsetStartWithNavigation">0dp</item>
</style>

和 ToolbarCustomView

internal class ToolbarCustomView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = 0
) : Toolbar(context, attrs, defStyleAttr) {

    init {
        inflate(context, R.layout.toolbar_custom, this)
    }

使用android组件，MainActivity.kt是：

...
<oncreate>
        setSupportActionBar(toolbar_main)
//...
 val appBarConfiguration = AppBarConfiguration(navigationController.graph)
        toolbar_main.setupWithNavController(navigationController, appBarConfiguration)

具有以下布局：

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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="match_parent"
    android:orientation="vertical">

    <com....ToolbarCustomView
        android:id="@+id/toolbar_main"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:contentInsetStartWithNavigation="0dp"
        app:contentInsetStart="0dp"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <fragment
        android:id="@+id/fragment_container"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@+id/bottom_navigation"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toBottomOf="@+id/toolbar_main"
        app:navGraph="@navigation/bottom_nav" />

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

问题：当导航图显示后退按钮时，结果如下： 在此处输入图像描述

知道如何避免工具栏切换到右侧吗？

标签： androidtoolbarandroid-architecture-components

解决方案

解决方案：我在底部创建了一个带有绿线的背景，并将其设置在我的工具栏上：

internal class ToolbarCustomView @JvmOverloads constructor(
    context: Context,
    attrs: AttributeSet? = null,
    defStyleAttr: Int = R.attr.toolbarStyle
) : Toolbar(context, attrs, defStyleAttr) {

    init {
        inflate(context, R.layout.toolbar_main, this)
        setBackgroundResource(R.drawable.toolbar_background)
    }
}

toolbar_custom .xml 更改为：

<?xml version="1.0" encoding="utf-8"?>
<merge xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools">

         <ImageView
           android:id="@+id/ic_toolbar"
           android:layout_width="wrap_content"
           android:layout_height="@dimen/dimen_28"
           android:layout_margin="@dimen/dimen_8"
           android:src="@drawable/ic_chat_black"
           android:layout_centerHorizontal="true"/>
</merge>

为了解决“底线”差距，我将相同的背景应用于 navigationIcon（后退按钮）

 <style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> 
    <...>
    <item name="toolbarNavigationButtonStyle">@style/AppTheme.NavigationButtonStyle</item>
 </style>

 <style name="AppTheme.NavigationButtonStyle" parent="@style/Widget.AppCompat.Toolbar">
    <item name="android:scaleType">centerInside</item>
    <item name="android:background">@drawable/toolbar_background</item>
 </style>

推荐阅读