【问题标题】:How to design toolbar in android如何在android中设计工具栏
【发布时间】:2021-04-27 20:31:38
【问题描述】:

我为工具栏创建了一个 XML 布局,并将样式更改为无操作栏。
但我在使用该工具栏时遇到了 2 个问题

  1. 工具栏中的文本视图消失

  2. 工具栏有边距开始,这与父级不匹配 那么我应该如何解决这些问题呢? 这是工具栏 XML:

      <?xml version="1.0" encoding="utf-8"?>
     <androidx.appcompat.widget.Toolbar 
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
     android:layout_height="?attr/actionBarSize"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:background="@color/white"
     android:elevation="16dp">
    
     <androidx.constraintlayout.widget.ConstraintLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content">
    
         <TextView
             android:id="@+id/txt_toolbar"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
             app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintBottom_toBottomOf="parent"
             android:layout_margin="8dp"
             android:textColor="@color/black"
             android:textSize="22sp"
             tools:text="@string/app_name" />
     </androidx.constraintlayout.widget.ConstraintLayout>
    </androidx.appcompat.widget.Toolbar>
    

这是主要的活动 XML 代码:

<?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:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <include layout="@layout/toolbar"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"/>
    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/nav_view"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:menu="@menu/bottom_nav_menu" />

    <fragment
        android:id="@+id/nav_host_fragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:defaultNavHost="true"
        app:layout_constraintBottom_toTopOf="@id/nav_view"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/mobile_navigation" />

</androidx.constraintlayout.widget.ConstraintLayout>

这是android studio中设计视图的图片

这是模拟器中的应用图片

正如您所见,片段中的 Texview 也存在问题,它的位置不正确,工具栏中的 textview 消失了 那么我应该如何解决这个问题呢?

【问题讨论】:

    标签: android android-layout kotlin android-xml ui-design


    【解决方案1】:

    您的问题的根源是tools:text="@string/app_name",如official docs 中所述

    Android Studio 支持工具命名空间中的各种 XML 属性,这些属性可启用设计时功能(例如在片段中显示哪种布局)或编译时行为(例如将哪种收缩模式应用于您的 XML 资源) .当您构建应用时,构建工具会移除这些属性,因此不会影响您的 APK 大小或运行时行为。

    在构建应用程序时,任何toolsNs 属性都会从 XML 中删除,在您的情况下,这就是您看不到任何文本的原因,而是使用 androidNs

    所以请在您的textview 中尝试以下操作

    android:text="@string/app_name"
    

    【讨论】:

    • 天啊!!!我没有看到,这是我第一次使用android studio模板。非常感谢。另一个问题呢,为什么工具栏不在中心?我该怎么办?
    • 你的第二个问题我不清楚,介意改写吗?你想把它放在中间吗?不是已经在中心了吗?
    • 是的,它必须在中心。您可以看到 XML 代码。但它不在中心。看来,它有边缘结束。但它没有任何边距
    • 您的 xml 似乎没问题,尝试重建项目,看看它是否有效,否则尝试在 SO 上提出与新问题相同的问题,快乐编码:)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-09-18
    • 2016-06-09
    • 2018-03-10
    • 1970-01-01
    • 2022-01-10
    相关资源
    最近更新 更多