Android按钮背景作为与阴影的形状

时间:2012-04-02 10:33:12

标签: android android-layout button shape

我已经从形状中制作了一个按钮背景,看起来非常符合我的目的。唯一需要的是为它投下一点阴影。 这是代码:

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

    <item android:state_pressed="true">
        <shape>
            <solid android:color="#343434" />

            <stroke android:width="1dp" android:color="#171717" />

            <corners android:radius="3dp" />

            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
        </shape>
    </item>
    <item>
        <shape>
            <gradient android:angle="270" android:endColor="#E2E2E2" android:startColor="#BABABA" />

            <stroke android:width="1dp" android:color="#BABABA" />

            <corners android:radius="4dp" />

            <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
        </shape>
   </item>

</selector>

这就是我想要实现的目标

enter image description here

如何删除阴影?我的猜测是我需要制作另一个形状,但是有黑色/灰色背景,并设置某种形式的左边缘填充以使其看起来像阴影。但我不知道该怎么做......而且文档对我的帮助太大了。

稍后编辑:我想在xml文件中添加阴影而不是代码。 感谢。

6 个答案:

答案 0 :(得分:11)

如果您希望将更多形状叠加在一起,则可以使用layer-list。 Bellow是选择器中正常项目的代码(带有灰色条带):

<item>
    <layer-list>
        <item android:right="5dp" android:top="5dp">
            <shape>
                <corners android:radius="3dp" />
                <solid android:color="#D6D6D6" />
            </shape>
        </item>
        <item android:bottom="2dp" android:left="2dp">
            <shape>
                <gradient android:angle="270" android:endColor="#E2E2E2" android:startColor="#BABABA" />
                <stroke android:width="1dp" android:color="#BABABA" />
                <corners android:radius="4dp" />
                <padding android:bottom="10dp" android:left="10dp" android:right="10dp" android:top="10dp" />
            </shape>
        </item>
    </layer-list>
</item>

问题在于,使用这种类型的drawable,你无法在Button上实现真正的阴影效果。您可以使用其他答案中的代码或已经有阴影的九个补丁图像。

答案 1 :(得分:5)

试试这个......

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>
        <shape>
            <solid android:color="#000000" />

            <corners android:radius="7dp" />
        </shape>
    </item>
    <item
        android:bottom="5px"
        android:left="5px">
        <shape>
            <solid android:color="#FF0000" />

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

答案 2 :(得分:4)

Paint mShadow = new Paint(); 
// radius=10, y-offset=2, color=black 
mShadow.setShadowLayer(10.0f, 0.0f, 2.0f, 0xFF000000); 
// in onDraw(Canvas) 
canvas.drawBitmap(bitmap, 0.0f, 0.0f, mShadow);

此代码来自Android的Romain Guy:http://www.devoxx.com/download/attachments/1705921/D8_C_10_09_04.pdf

答案 3 :(得分:2)

你可以试试这个:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<!-- Bottom Shadow Darker Line--> 
<item>
    <shape android:shape="rectangle" >
        <solid android:color="@color/blue_darker" />
        <corners android:radius="9dip" />
    </shape>
</item>    


<!-- Main Content Gradient -->
<item android:bottom="1dip">
    <shape android:shape="rectangle" android:dither="false" >
        <gradient
            android:startColor="@color/blue_dark"
            android:centerColor="@color/blue_medium"
            android:endColor="@color/blue_light"
            android:type="linear"
            android:angle="90"/>
        <corners android:radius="9dip" />
    </shape>
</item>

<!-- Upper Shadow Dark Line -->
<item android:bottom="1dip" android:left="1dip" android:right="1dip">
     <shape android:shape="rectangle" >
        <gradient
            android:centerX="0.98"
            android:centerY="0"
            android:startColor="@android:color/transparent"
            android:centerColor="@android:color/transparent"
            android:endColor="@color/blue_medium"
            android:type="linear"
            android:angle="90"/>            
        <corners android:radius="9dip" />
    </shape>
</item>    

答案 4 :(得分:1)

您也可以尝试使用以下代码为视图获取平滑的边框阴影:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

<item>
    <shape>
        <solid android:color="#88000000" />

        <corners android:radius="15dp" />
    </shape>
</item>
<item
    android:bottom="5px"
    android:right="5px">
    <shape>
        <solid android:color="#55B0CF" />

        <stroke
            android:width="2dp"
            android:color="#ffffff" />

        <corners android:radius="7dp" />
    </shape>
</item>

答案 5 :(得分:1)

在这种情况下,我使用lib https://github.com/dmytrodanylyk/shadow-layout

首先,你应该在gradle中打开它

dependencies {
    compile 'com.github.dmytrodanylyk.shadow-layout:library:1.0.3'
}

然后将你的Button放入ShadowLayout

<com.dd.ShadowLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:sl_shadowRadius="3dp"
        app:sl_shadowColor="@color/your_color">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content" />
    </com.dd.ShadowLayout>

它对我来说很好看)