Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.1k views
in Technique[技术] by (71.8m points)

android - How to add a blurred drop shadow to a button?

I need to add blurred drop shadow to my button:

enter image description here

I tried to create background with layer-list xml drawable, but it not looks like blur.

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

    <!-- Drop Shadow Stack -->
    <item>
        <shape>
            <corners android:radius="45dp" />
            <padding
                android:bottom="2dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp" />

            <stroke
                android:width="6dp"
                android:color="#007879E8" />

        </shape>
    </item>
    //////   10 more items
        <item>
        <shape>
            <corners android:radius="45dp" />
            <padding
                android:bottom="2dp"
                android:left="1dp"
                android:right="1dp"
                android:top="1dp" />

            <stroke
                android:width="6dp"
                android:color="#177879E8" />


        </shape>
    </item>

    <!-- Background -->
    <item>
        <shape>
            <corners android:radius="45dp" />
            <stroke
                android:width="2dp"
                android:color="@color/main_purple_text_color" />
        </shape>
    </item>

</layer-list>

Also i tried to use background element behind button with blured png but it uses to many resources and i cannot create selector to change background on hover or click.

I need to have single background file for button and use selector to change blur and gradient on hover/click. Any ideas how to achieve such effect with Android SDK ?

UPDATE 1

Thanks everybody for answers, but I'm not asking how to create gradient. I've already done this. I need to create blurred drop-shadow.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Well i found the solution: we need to create 9.png with blurred drop-shadow via this generator and pass it to drawable layer-list that contain button background gradient:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/blurred_9_path_png" />
    <item>
        <shape android:shape="rectangle" android:padding="10dp">
            <corners android:radius="45dp" />
            <gradient
                android:angle="45"
                android:endColor="@color/facebook_btn_fill_grad2"
                android:startColor="@color/facebook_btn_fill_grad1"
                android:type="linear" />
            <padding
                android:bottom="0dp"
                android:left="0dp"
                android:right="0dp"
                android:top="0dp" />
        </shape>
    </item>

</layer-list> 

After that we can use such drawables with different 9.path blurred shadow to create selector.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...