如何设计具有2层阴影的浮动动作按钮

Question

谁能告诉我如何设计这种具有两层阴影的浮动动作按钮？有谁知道任何提供这种服务的图书馆？ 预先谢谢你。

Answer 1

自定义“浮动操作按钮”的背景有点困难。相反，您可以使用具有自定义背景可绘制背景的ImageButton来创建按钮设计。

步骤1：在 res / drawable 文件夹中创建 button_bg.xml 。用原始颜色替换颜色。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    //outer circle
    <item >
        <shape android:shape="oval">
            <size android:width="25dp" android:height="25dp"/>
            <solid android:color="#40FE6F51"/>
        </shape>
    </item>

    //mid circle
    <item android:top="4dp"
        android:left="4dp"
        android:right="4dp"
        android:bottom="4dp">
        <shape android:shape="oval">
            <size android:width="25dp" android:height="25dp"/>
            <solid android:color="#40FE6F51"/>
        </shape>
    </item>

    //inner circle
    <item android:top="8dp"
        android:left="8dp"
        android:right="8dp"
        android:bottom="8dp">
        <shape
            android:shape="oval">
            <size android:width="25dp" android:height="25dp"/>
            <gradient android:angle="45"
                android:startColor="#FF4A23" android:endColor="#FF937C"/>
        </shape>
    </item>

</layer-list>

第2步：，如下所示在布局内添加图片按钮。使用先前创建的 button_bg 作为此图像按钮的背景。将 src 替换为您自己的图标

<ImageButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/plus_icon"
        android:padding="20dp"
        android:background="@drawable/button_bg"/>