片段重叠工具栏的布局

ojo*_*ifu 10 android

使用以下代码替换/将我的Fragment放在DrawerLayout的FrameLayout中:

<?xml version="1.0" encoding="utf-8"?>
  <android.support.v4.widget.DrawerLayout      
  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/drawer_layout"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:fitsSystemWindows="true"
  tools:openDrawer="start">


<include
    layout="@layout/app_bar_base"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />


<FrameLayout
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />


<!--drawer items-->
<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:headerLayout="@layout/nav_header_base"
    app:menu="@menu/activity_base_drawer" />

 </android.support.v4.widget.DrawerLayout>
Run Code Online (Sandbox Code Playgroud)

app_bar_base.xml 包含工具栏和FAB:

<?xml version="1.0" encoding="utf-8"?>
    <android.support.design.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_width="match_parent"
     android:layout_height="match_parent"
     android:fitsSystemWindows="true"
     tools:context=".BaseActivity">

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

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

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



<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_dialog_email" />

</android.support.design.widget.CoordinatorLayout>
Run Code Online (Sandbox Code Playgroud)

当我运行我的应用程序时,结果如下:

在此输入图像描述

如您所见,片段的布局与工具栏重叠.如何解决这个问题?

我已经尝试将Toolbar和FrameLayout放在LinearLayout中,如下所示:

 <LinearLayout
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <include
            layout="@layout/app_bar_base"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
</LinearLayout>
Run Code Online (Sandbox Code Playgroud)

但随后FrameLayout被隐藏了.

Raf*_*ena 35

尝试添加 android:layout_marginTop="?attr/actionBarSize"FrameLayout你用来放入Fragments.

<FrameLayout
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="?attr/actionBarSize"/>
Run Code Online (Sandbox Code Playgroud)

为我工作:)

  • 虽然此解决方案可以正常工作,但如果由于某种原因需要隐藏ActionBar,则无法正常工作.正确的解决方案是将所有内容包装到**CoordinatorLayout**并添加属性**app:layout_behavior**,如@ ramachandra-reddy-avula给出的解决方案中所述 (2认同)

Ram*_*ula 23

请不要忘记将app:layout_behavior ="@ string/appbar_scrolling_view_behavior"添加到您的内容布局

<android.support.design.widget.CoordinatorLayout  
   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.support.design.widget.AppBarLayout
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

           <android.support.v7.widget.Toolbar
              android:layout_width="match_parent"
              android:layout_height="?attr/actionBarSize"
              android:background="?attr/colorPrimary"
              app:layout_scrollFlags="scroll|enterAlways"
              app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

           <android.support.design.widget.TabLayout
              android:layout_width="match_parent"
              android:layout_height="wrap_content" />
       </android.support.design.widget.AppBarLayout>

       <android.support.v4.view.ViewPager
             android:layout_width="match_parent"
             android:layout_height="match_parent"
             app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

</android.support.design.widget.CoordinatorLayout>
Run Code Online (Sandbox Code Playgroud)

  • 我认为这个答案更为通用,因为这个解决方案也适用于完全扩展的工具栏 (2认同)

小智 5

我尝试了所有答案,但没有一个对我有用。因为我隐藏了操作栏,所以情况变得更加复杂。

但是我终于添加android:paddingTop="?attr/actionBarSize"了,FrameLayout并且对我有用。希望能对某人有所帮助。


Emi*_*enT 0

使用下面的代码

<LinearLayout
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <include
            layout="@layout/app_bar_base"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
Run Code Online (Sandbox Code Playgroud)