【问题标题】:How to implement a rounded Button with gradient background and blurred shadow?如何实现带有渐变背景和模糊阴影的圆形按钮?
【发布时间】:2019-11-27 16:27:42
【问题描述】:

我正在努力实现这样的目标。

https://i.stack.imgur.com/SseaB.png

对于默认按钮/AppCompatButton,我曾尝试应用在 xml drawable 中预定义的带有圆角的渐变背景。但是如何实现带模糊的阴影呢?

【问题讨论】:

标签: android xml button material-design shadow


【解决方案1】:

创建一个可绘制类bg_theme_round_layer_shadow

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
    >
    <!-- Drop Shadow Stack -->
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#02AAAAAA" />
            <corners android:radius="46.5dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#05AAAAAA" />
            <corners android:radius="46dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#0FAAAAAA" />
            <corners android:radius="45.5dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#1CAAAAAA" />
            <corners android:radius="44.5dp" />
        </shape>
    </item>
    <item>
        <shape>
            <padding android:top="1dp" android:right="1dp" android:bottom="1dp" android:left="1dp" />
            <solid android:color="#24AAAAAA" />
            <corners android:radius="43.5dp" />
        </shape>
    </item>

    <!-- Background -->
    <item>
        <shape>
            <!--<solid android:color="@color/theme_color" />-->
            <gradient android:endColor="@color/gradient_normal_end" android:startColor="@color/gradient_normal_start"/>

            <corners android:radius="43dp" />
        </shape>
    </item>
</layer-list>

将这些颜色放入您的颜色文件中

<color name="gradient_normal_start">#e85d7b</color>
<color name="gradient_normal_end">#efa645</color>

【讨论】:

    猜你喜欢
    • 2012-03-26
    • 1970-01-01
    • 1970-01-01
    • 2017-07-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多