Android阴影效果

布局、按钮背景阴影:layer-list

原理:将多个drawable按照顺序层叠在一起显示
效果图

image.png

在drawable文件下新建layer-list的xml文件

阴影边框效果
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!--第一层阴影-->
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#0F000000" />
            <corners android:radius="10dp" />
        </shape>
    </item>
    <!--第二层前景-->
    <item
        android:bottom="1dp"
        android:left="1dp"
        android:right="1dp"
        android:top="1dp">
        <shape android:shape="rectangle">
            <solid android:color="@android:color/white"/>
            <corners android:radius="10dp" />
        </shape>
    </item>
</layer-list>
image.png
层叠效果
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 第一层阴影 层叠-->
    <item>
        <shape>
            <solid android:color="@android:color/darker_gray" />
            <!--圆角-->
            <corners android:radius="10dp" />
        </shape>
    </item>
    <!-- 第二层前景 层叠-->
    <item>
        <shape>
            <solid android:color="@android:color/white" />
            <corners android:radius="10dp" />
        </shape>
    </item>
</layer-list>
image.png
底部偏移效果
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 第一层阴影 -->
    <item>
        <shape>
            <solid android:color="@android:color/darker_gray" />
            <corners android:radius="10dp" />
        </shape>
    </item>
    <!--第二层前景 底偏移1dp -->
    <item android:bottom="1dp">
        <shape>
            <solid android:color="@android:color/white" />
            <corners android:radius="10dp" />
        </shape>
    </item>
</layer-list>
image.png
右下偏移效果
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- 第一层阴影:左偏移2dp,上偏移4dp -->
    <item
        android:left="2dp"
        android:top="4dp">
        <shape>
            <solid android:color="@android:color/darker_gray" />
            <!--圆角-->
            <corners android:radius="10dp" />
        </shape>
    </item>
    <!-- 第二层前景::底偏移4dp,右偏移2dp -->
    <item
        android:bottom="4dp"
        android:right="2dp">
        <shape>
            <solid android:color="@android:color/white" />
            <!--圆角-->
            <corners android:radius="10dp" />
        </shape>
    </item>
</layer-list>
image.png
使用:直接设android:background属性为xml文件

android:background="@drawable/bg_shadow_white"

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,699评论 25 708
  • 记得刚开始学Android时,看着自己完全用系统控件写出的不忍直视的界面,对于如何做出不一样的按钮,让它们在不同状...
    biloba阅读 1,758评论 1 11
  • 概述 今天我们来探究一下android的样式。其实,几乎所有的控件都可以使用 background属性去引用自定义...
    CokeNello阅读 4,912评论 1 19
  • 好吧,老土不得不承认今天转载这个内容的真实目的有两个: 1、太晚了,实在是没有时间写原创;2、给自己天天喝咖啡找到...
    北邮老土阅读 308评论 0 1
  • 愚人节的考试伤不起,继续加油努力吧。现在只不过是一只小鱼虾而已。有梦想就有方向,有尝试就有希望,有努力就有力量,有...
    来自_你的星星阅读 154评论 0 0