【问题标题】:FAB not positioning inside CoordinatorLayout with RecyclerViewFAB 未使用 RecyclerView 定位在 CoordinatorLayout 内
【发布时间】:2017-12-02 10:18:27
【问题描述】:

我正在尝试显示带有 FAB 的项目列表以添加新项目。当前画面如下。

我有一个 CoordinatorLayout,它只有一个 RecyclerView 和 FAB。我的问题是 FAB 没有锚定到页面底部,而是锚定到 RecyclerView 的底部,其高度似乎表现为wrap_content,但我已声明为match_parent。出于说明目的,RecylerView 具有银色背景。

<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"
tools:context="com.ae.apps.tripmeter.fragments.expenses.TripsListFragment">

<android.support.v7.widget.RecyclerView
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true"
    android:background="@color/silver"
    android:layout_margin="@dimen/activity_horizontal_margin"
    app:layoutManager="LinearLayoutManager"
    tools:listitem="@layout/fragment_trip"/>


<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:layout_gravity="bottom|end"
    android:layout_margin="@dimen/fab_margin"
    android:src="@android:drawable/ic_input_add"
    app:elevation="8dp"/>

我不知道为什么我不能将 FAB 放在页面底部。

【问题讨论】:

  • 你能显示整个xml吗?
  • 似乎您正在使用RelativeLayout 的功能,但您的代码中没有。尝试将RelativeLayoutmatch_parent 的宽度和高度放在CoordinatorLayout 以下,但作为RecyclerViewFloatingActionButton 的父级
  • @kara4k,这是整个 xml 文件
  • 如果这是你的整个 xml 文件,ToolBar来自哪里?
  • 工具栏在父Activity中。此内容是一个片段。

标签: android android-coordinatorlayout floating-action-button


【解决方案1】:

尝试将RecyclerView 放在“内容”布局文件中,并通过

将其添加到主布局中
<include layout="@layout/content_recyclerview" />

编辑:

如果 FAB 位于 Activity 的底部,则不应将其放置在 Fragment 中。从片段中移除 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="com.your_company.your_project">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        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>

    <-- ref. your recycler here -->
    <include layout="@layout/content_with_your_list"/>

    <-- Put the FAB here -->
    <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_input_add"
    />

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

现在在您的片段中删除 FAB!它应该与CoordinateLayout 一起存在于您的主要活动中。在您的片段中使用简单的LinearLayout

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              app:layout_behavior="@string/appbar_scrolling_view_behavior"
              tools:showIn="@layout/activity_your_main_activity"
              >


    <android.support.v7.widget.RecyclerView
        android:id="@+id/list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@color/silver"
        android:layout_margin="@dimen/activity_horizontal_margin"
        app:layoutManager="LinearLayoutManager"/>


</LinearLayout>

您需要进行适当的更改以适合您的项目。


切换 FAB 可见性

为了切换 FAB 的可见性,请将以下属性添加到父 Activity 中的 FloatingActionButton

android:visibility="gone"

并使其在代码中可见:

mFab.setVisibility(View.VISIBLE);

或不可见,再次使用

mFab.setVisibility(View.GONE);

只要您需要,例如。当显示或删除片段时。

【讨论】:

  • 投反对票时请留下解释。否则我将无法改进我的答案。谢谢。
  • 我认为 CoordinatorLayout 必须是 FAB 预期行为的根布局
  • 是的,你是对的。嵌套在LinearLayout 中时,FAB 的行为与预期不同。我已根据我的建议对其进行了编辑。
【解决方案2】:

你可能想要这样的东西?

Example

<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.support.v7.widget.RecyclerView
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:layout_alignParentTop="true" />


<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_alignParentEnd="true"
    android:layout_gravity="bottom|end"
    android:src="@android:drawable/ic_input_add"
    android:layout_margin="8dp"
    app:elevation="8dp"/>

如果你想在 fab 下有一些布局,你应该使用相对布局作为根布局。并将我的代码放在这个相对布局中。

【讨论】:

  • 这个 xml 与问题中的内容有何不同?
  • 我想实现这个布局,但似乎这就是我目前在我的问题中的布局。
  • 但是我在屏幕底部有工厂,而你没有。所以它不可能是一样的。
【解决方案3】:

我使用以下命令将 fab 锚定在 recyclerView 的底部,它为我提供了我想要的输出。试试这个..

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" 
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.v7.widget.RecyclerView
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

</android.support.v7.widget.RecyclerView>

<android.support.design.widget.FloatingActionButton
    android:layout_alignParentBottom="true"
    android:layout_alignParentEnd="true"
    android:layout_margin="16sp"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />


</RelativeLayout>

【讨论】:

  • 那么我应该使用RelativeLayout而不是CoordinatorLayout
  • yes....即使使用坐标布局它也可以工作...如果您想使用坐标布局,请在FAB 中使用android:layout_gravity="bottom|end" 并删除以下行android:layout_alignParentBottom="true" android:layout_alignParentEnd="true" ...它将给出你想要什么......如果你使用RelativeLayout,我的回答会给你你想要的。所以基本上你可以使用它们中的任何一个`
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-12-03
  • 2015-08-12
  • 1970-01-01
相关资源
最近更新 更多