如何更改布局 xml 以使工具栏不覆盖项目？

Posted 2023-04-18

【中文标题】如何更改布局 xml 以使工具栏不覆盖项目？

【英文标题】：Does anyone know how to change the layout xml so that the toolbar doesn't cover the items?有谁知道

【发布时间】：2021-01-05 04:33:34

【问题描述】：

谢谢！！

这是主要的 xml：

<?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_
    android:layout_
    tools:context=".MainActivity">

    <com.google.android.material.appbar.AppBarLayout
        android:id="@+id/appBarLayout"
        android:layout_
        android:layout_
        android:theme="@style/AppTheme.AppBarOverlay">

        <androidx.appcompat.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_
            android:layout_
            android:background="#EFC6D4"
            app:popupTheme="@style/AppTheme.PopupOverlay" />

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

    <include
        android:id="@+id/include"
        layout="@layout/content_main" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_
        android:layout_
        android:layout_gravity="bottom|end"
        android:layout_margin="@dimen/fab_margin"
        app:srcCompat="@android:drawable/ic_dialog_email" />

    <TextView
        android:id="@+id/textView"
        android:layout_
        android:layout_
        android:text="@string/electric_time_capital"
        android:textAppearance="@style/TextAppearance.AppCompat.Large"
        android:textColor="#FFFFFF"
        app:layout_anchor="@+id/appBarLayout"
        app:layout_anchorGravity="center" />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recyclerview"
        android:layout_
        android:layout_
        app:layout_anchor="@+id/include"
        app:layout_anchorGravity="center" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

这是布局 xml：

<?xml version="1.0" encoding="utf-8"?>
<!--<androidx.coordinatorlayout.widget.CoordinatorLayout  xmlns:android="http://schemas.android.com/apk/res/android"-->
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_
    android:layout_
    android:padding="15dp"
    android:id="@+id/parent_layout"
    app:layout_anchorGravity="center_horizontal">

    <de.hdodenhof.circleimageview.CircleImageView
        android:id="@+id/image"
        android:layout_
        android:layout_
        android:src="@mipmap/ic_launcher" />

    <TextView
        android:id="@+id/image_name"
        android:layout_
        android:layout_
        android:layout_alignBottom="@+id/image"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:layout_marginStart="31dp"
        android:layout_marginLeft="31dp"
        android:layout_marginTop="28dp"
        android:layout_marginEnd="202dp"
        android:layout_marginBottom="29dp"
        android:layout_toEndOf="@+id/image"
        android:layout_toRightOf="@+id/image"
        android:gravity="center"
        android:text="Walking"
        android:textColor="#000"
        android:textSize="17sp" />

</RelativeLayout>
<!--</androidx.coordinatorlayout.widget.CoordinatorLayout>-->

problem layout xml

【参考方案1】：

不要硬编码 RecyclerView 的高度，只需使用 ConstraintLayout 作为根布局，并将 RecyclerView 的顶部约束到 AppBarLayout 的底部。

【参考方案2】：

由于您没有附上任何关于您希望布局如何的图片，我假设您的要求是：

AppBarLayout，Toolbar 包含标题“Electric Time Capital”

工具栏下方的布局content_main

布局content_main

下方的RecyclerView

FloatingActionButton在右下角

 <androidx.constraintlayout.widget.ConstraintLayout 
     xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:app="http://schemas.android.com/apk/res-auto"
     android:layout_
     android:layout_>

     <com.google.android.material.appbar.AppBarLayout
         android:id="@+id/appBarLayout"
         android:layout_
         android:layout_
         android:theme="@style/AppTheme.AppBarOverlay"
         app:layout_constraintTop_toTopOf="parent">

         <androidx.appcompat.widget.Toolbar
             android:id="@+id/toolbar"
             android:layout_
             android:layout_
             android:background="#EFC6D4"
             app:popupTheme="@style/AppTheme.PopupOverlay">

             <TextView
                 android:id="@+id/textView"
                 android:layout_
                 android:layout_
                 android:text="@string/electric_time_capital"
                 android:textAppearance="@style/TextAppearance.AppCompat.Large"
                 android:textColor="#FFFFFF" />
         </androidx.appcompat.widget.Toolbar>

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

     <include
         android:id="@+id/include"
         layout="@layout/content_main"
         android:layout_
         android:layout_
         app:layout_constraintTop_toBottomOf="@id/appBarLayout" />

     <com.google.android.material.floatingactionbutton.FloatingActionButton
         android:id="@+id/fab"
         android:layout_
         android:layout_
         android:layout_gravity="bottom|end"
         android:layout_margin="@dimen/fab_margin"
         app:layout_constraintBottom_toBottomOf="parent"
         app:layout_constraintRight_toRightOf="parent"
         app:srcCompat="@android:drawable/ic_dialog_email" />

     <androidx.recyclerview.widget.RecyclerView
         android:id="@+id/recyclerview"
         android:layout_
         android:layout_
         android:layout_below="@id/include"
         app:layout_constraintTop_toBottomOf="@id/include" /> 
 </androidx.constraintlayout.widget.ConstraintLayout>

注意：使用ConstraintLayout，因为它更容易做出响应 布局。第一次使用它可能看起来很棘手，但它是 最好的方法！

编码愉快！ ?