如何自定义浮动操作按钮形状？

Question

我正在尝试创建具有自定义形状的自定义FAB。我尝试将android: background和shapeAppearanceOverlay和shapeAppearance属性一起设置，但还是没有运气。

        <com.google.android.material.floatingactionbutton.FloatingActionButton
            android:id="@+id/edit_score_fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:shapeAppearance="@drawable/edit_score_fab"
            app:shapeAppearanceOverlay="@drawable/edit_score_fab"
            android:background="@drawable/edit_score_fab"/>

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle"
    >
    <size
        android:height="5dp"
        android:width="10dp"/>
    <corners android:bottomLeftRadius="4dp" />
    <solid android:color="@color/color_primary"/>
</shape>

我的结果

我想要的

Answer 1

您可以将 ExtendedFloatingActionButton 用于自定义形状外观。
像这样：

<com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
    app:shapeAppearanceOverlay="@style/ShapeAppearanceOverlayExtended"
    ../>

具有：

  <style name="ShapeAppearanceOverlayExtended" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">0dp</item>
    <item name="cornerSizeTopLeft">50%</item>
  </style>

Answer 2

如果你想要一个可扩展的完全可定制的 FAB :

首先下载我的库 Viper Pack 并将其安装到您的项目中。

其次，转到您的活动 onCreate 循环并使用来自 Lava 类的 Lava.app.addLavaFab(...) 方法添加它：

简单的熔岩工厂：

Lava.app.addLavaFab(Context c, int imgres, String text, View.OnClickListener lis) 允许您在应用中添加一个简单的图像和文本熔岩工厂，imgres 是来自资源的工厂图像，文本是工厂文本。

Lava.app.addLavaFab(Context c, int imgres, String text, String gravity, View.OnClickListener lis) 允许您在应用程序中添加一个简单的图像和文本熔岩晶圆厂，重力是晶圆厂的位置，可以是 Lava.FabPosition.LEFT 或 Lava.FabPosition.RIGHT 或 Lava.FabPosition.CENTER，imgres是来自资源的 fab 图片，text 是 fab 文本。

Lava.app.addLavaFab(Context c, Drawable d, String text, View.OnClickListener lis) 允许您在应用中添加一个简单的图像和文本 lava fab，d 是作为 drawable 的 fab 图像，而 text 是 fab 文本。

Lava.app.addLavaFab(Context c, Drawable d, String text, String gravity, View.OnClickListener lis) 允许您在应用程序中添加一个简单的图像和文本熔岩晶圆厂，重力是晶圆厂的位置，它可以是 Lava.FabPosition.LEFT 或 Lava.FabPosition.RIGHT 或 Lava.FabPosition.CENTER， d 是可绘制的 fab 图像，text 是 fab 文本。

您可以使用 Lava.app.fabtext 和 Lava.app.fabimage 获得简单的 lava fab textview 和 imageview。

定制熔岩工厂：

Lava.app.addLavaFab(Context c, View fixedview, View hiddenview, View.OnClickListener lis) 允许你在你的应用程序中添加一个自定义的熔岩工厂，fixedview 是 fab 中始终出现的视图，它可以是一个图像，lottie 动画，任何东西； hiddenview 是只有当用户按下 fab 时才会出现的隐藏视图，它可以是文本或其他任何东西。

Lava.app.addLavaFab(Context c, View fixedview, View hiddenview, String gravity, View.OnClickListener lis) 允许你在你的应用程序中添加一个自定义的熔岩工厂，fixedview 是 fab 中始终出现的视图，它可以是一个图像，lottie 动画，任何东西； hiddenview 是只有当用户按下 fab 时才会出现的隐藏视图，它可以是文本或其他任何东西，gravity 是 fab 的位置，它可以是 Lava.FabPosition.LEFT 或 Lava.FabPosition.RIGHT 或 Lava.FabPosition.CENTER .

您可以通过 Lava.app.fab 将熔岩工厂本身作为 LinearLayout 获取。

很容易添加，试一试并分享给其他人:)