如何添加一个浮动操作按钮（Floating Action Button），不使用AppCompat？

Question

我想制作一个新的应用程序，仅使用API 21。

为了遵循Material Design，我正在尝试使用FAB，但是我找不到任何有关如何使用Design Library中现在包含的FAB的合适信息。

到目前为止，我已将库添加到build.gradle文件中，并在我的视图中添加了一个FAB（以下是代码）。

<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:src="@android:drawable/ic_menu_add"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true"
        app:elevation="5dp"
        app:borderWidth="0dp"
        app:fabSize="mini"/>

（这是在RelativeLayout中）

当我启动应用程序时，我遇到了以下错误：

android.view.InflateException: Binary XML file line #15: Error inflating class android.support.design.widget.FloatingActionButton

我在SO上找到了一个答案，它说我需要使用AppCompat主题，但我更希望只使用纯Material / API21的内容。

如何在不使用AppCompat（支持库）的情况下使用FAB？

- Mr Pablo

---

我认为你会错过很多时间节省和伟大的API，比如CoordinatorLayout、Snackbar、NavigationView、TabLayout等等。这几乎就是所有“纯材料”的东西了。不管怎样，在API21+上创建自己的FloatingActionButton非常容易。你可以看看谷歌在android-topeka中的实现。 - Markus Rubey

Answer 1

FAB（浮动操作按钮）是内置于新的Design Compat库中的 - 可在早至API 7的设备上使用。您需要将其包含为依赖项才能使用它（并且不应该犹豫这样做）。如果您想避免使用库（或任何外部代码），则需要自己绘制FAB（使用Shape Drawable）。总之，使用Design Compat库是支持FAB的首选方法，您应该使用它。Design Compat库就是“纯/材料API21”的东西。除了Design support lib中的API之外，没有针对任何其他API实现FAB实现。您必须包含库，或完全自己实现代码。Design lib依赖于AppCompat，因此，如果您计划使用本机fab，则还需要包含AppCompat的依赖项。来自官方博客文章：“请注意，由于Design库依赖于Support v4和AppCompat Support库，因此在添加Design库依赖项时将自动包含它们。”

- Booger

---

我认为有些混淆了。我知道我需要使用设计支持库，这并不是我的问题。我的意思是看起来我必须使用v7 AppCompat的东西，但我不想使用它。 - Mr Pablo

将此合并到答案中 - 底线是，存在对AppCompat的依赖性，因此您必须使用它。 - Booger

Answer 2

Material Design库与AppCompat有依赖关系。 查看@Booger的答案。它引用了官方博客。

如何使用FAB。

将依赖项添加到您的build.gradle中：

compile 'com.android.support:design:22.2.0'

只需将FAB添加到您的设计中：

<android.support.design.widget.FloatingActionButton
            xmlns:app="http://schemas.android.com/apk/res-auto"
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|right"
            android:src="@drawable/ic_add"
            android:layout_marginBottom="@dimen/fab_margin_bottom"
            android:layout_marginRight="@dimen/fab_margin_right"
            app:elevation="6dp"
            app:borderWidth="0dp"
            app:fabSize="normal" />

目前有一些错误。

您必须定义 app:borderWidth="0dp" 才能在 API 21+ 上显示阴影。

此外，您还必须为 API 21+ 和旧设备定义不同的边距。

res/values/dimens.xml

<dimen name="fab_margin_right">0dp</dimen>
<dimen name="fab_margin_bottom">0dp</dimen>

res/values-v21/dimens.xml

<dimen name="fab_margin_right">16dp</dimen>
<dimen name="fab_margin_bottom">16dp</dimen>

FAB使用强调色，你可以使用app:backgroundTint属性进行覆盖。

最后，你可以使用以下代码设置ClickListener：

fab = (FloatingActionButton) findViewById(R.id.fab);
fab.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        //do something
    }
});

- Gabriele Mariotti

Answer 3

其实我也遇到了同样的问题。解决方案非常简单： 你需要定义 app:rippleColor="@color/colorPrimary" 这样你就可以使用 FAB 而不必使用 Appcompat 主题和活动。当然，你需要包含 compile 'com.android.support:support-v4:25.3.1' 和 compile 'com.android.support:design:25.3.1' 但是你不需要使用 AppCompatActivity 和那些主题。

   <android.support.design.widget.FloatingActionButton
    android:id="@+id/action_add_palette"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    android:layout_margin="16dp"
    android:src="@android:drawable/ic_input_add"
    app:rippleColor="@color/colorPrimary" />

- Jaqen hGhar

Answer 4

GitHub 上还有一些受欢迎的库，比如：

FloatingActionButton，它可以作为菜单展开/折叠，以显示多个操作。

- dasar

---

我个人现在不会使用第三方库，而是坚持使用包含在Design Lib中的“本地”实现。坚持遵循标准非常重要（标准的“Design Lib Implemented” FAB将使您最接近标准）。我知道它可能没有那么多功能（包括可扩展性），但仍然认为围绕新兴标准进行设计和实现非常重要。 - Booger

Answer 5

我认为，虽然你打算只在API21上提供应用程序，但我仍然鼓励你使用Android支持库AppCompat-v7来实现你的应用程序。这样做会带来很多好处。

当然，这是你的选择。这只是我的建议。但如果你被说服了，或者想了解如何使用Android Design Support Library，请查看这个完整的教程。http://inthecheesefactory.com/blog/android-design-support-library-codelab/en

希望这可以帮到你。

- nuuneoi

---

使用v7库有哪些好处？此外，似乎我只能使用原生FAB，使用Design Support Library必须使用AppCompat主题 :/ - Mr Pablo