ViewPager 和 FAB 的正确布局？答案

【问题标题】：Correct layout for ViewPager and FAB?ViewPager 和 FAB 的正确布局？
【发布时间】：2016-01-20 23:21:05
【问题描述】：

如果我想要一个ViewPager 和几个Fragments，以及一个供其中一个Fragments 使用的FloatingActionButton，理想的布局行为是什么？

A. FAB 是否应该位于Activity 布局中，其中还包含CoordinatorLayout 持有AppBarLayout/Toolbar/ViewPager？

或

B. FAB 是否应该位于 Fragment 布局中？

选项 A 的意义在于 FAB 应该能够在 CoordinatorLayout 内根据需要进行动画处理。例如，如果我显示Snackbar，我希望FAB 通过显示/隐藏Snackbar 向上/向下移动。但是，将FAB 放在这里需要我根据需要隐藏/显示FAB，因为其他两个Fragments 不会使用FAB，应该隐藏它。

选项 B 基本上与这些优点/缺点相反。

什么更正确？

谢谢，扎克

【问题讨论】：

对此没有正确答案。这取决于您，并且可以根据您的用例而有所不同。（出于这个原因，这种问题被认为是 StackOverflow 的题外话，因为它往往会收到固执己见的回应）。最坏的情况，尝试两者并做感觉更自然的事情。
大多数设计实践将FAB 放在activity 布局中。尽管您可能有其他选择，但遵循已经完成的工作更容易。

标签： android android-fragments android-viewpager android-coordinatorlayout floating-action-button

【解决方案1】：

A. FAB 是否应该位于 Activity 布局中，这也包含 CoordinatorLayout 持有 AppBarLayout/Toolbar/ViewPager?

是的，没错。

看这个例子：

<CoordinatorLayout>
    <AppbarLayout/>
    <scrollableView/>
    <FloatingActionButton/>
</CoordinatorLayout>

如您所见，在上面的示例中，我们在CoordinatorLayout 中使用了FloatingActionButton，FloatingActionButton 可以一直在布局上，而无需滚动甚至在滚动Fragment 或任何视图后隐藏。

最后，您可以将它用于您的Fragment：

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/coordinator"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.v7.widget.Toolbar
            android:id="@+id/dashboard_toolbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.Toolbar"
            app:layout_scrollFlags="scroll|enterAlways"/>

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

    <FrameLayout
        android:id="@+id/dashboard_content"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

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

另外，让我提一下，我已经添加了 FrameLayout 和 app:layout_behavior="@string/appbar_scrolling_view_behavior" 可以在AppbarLayout下。

这就是那条线的重点。

B. FAB 是否应该位于Fragment 布局中？

这取决于你，但是，将它与 CoordinatorLayout 一起使用是最好的方法。我的意思是，你可以用它实现许多 MaterialDesign 东西。

【讨论】：