android shape实现阴影或模糊边效果
android实现阴影的方式有很多,
1. Android 在 API21(5.0)添加了 elevation,可以很方便的在 View 上实现阴影。但是这个只在 >= API21 的手机上可以看到阴影效果,低于这个版本的就没有阴影效果。
2. CardView 也可以实现阴影效果,项目中一般都是使用这种方式实现卡片式的效果并带有阴影。使用 CardView 确实很不错,但是它在使用的时候也是需要有注意的地方:
(1) CardView 实现阴影效果的布局,在 >= API 21 的版本上和 < 21 的版本上,如果不在代码上做好控制,他们的显示差异还是很大的。(2) CardView 在 >= API21 的版本上实现阴影效果也是通过 elevation 来实现的,最终的渲染是调用 native 方法进行的。在使用过程中发现在不同位置的 View 阴影的方向是不一样的。不知道你们发现没,它模拟的场景就是 光源的位置在屏幕中心的正上方,然后 View 的位置由光源的位置决定。阴影方向不一致。
3. 通过 .9 图来制作阴影,这里通过一个很好的工具来制作哈:http://inloop.github.io/shadow4android/,这种方式制作小的背景阴影很模糊,效果上比不过 shape。
4. 用 SCardView 来实现阴影,使用方式和 CardView一样,但是它是使用一套代码,显示不会有差异,而且可以通过设置光源的位置来控制阴影的方向以及阴影的颜色。
compile 'io.github.meetsl:SCardView:1.0'
5. 通过shape来实现,具体是通过layer-list 多层叠放的方式实现的。
1 <?xml version="1.0" encoding="utf-8"?> 2 <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> 3 <!-- 边 --> 4 <item> 5 <shape android:shape="rectangle"> 6 <padding 7 android:bottom="2dp" 8 android:left="2dp" 9 android:right="2dp" 10 android:top="2dp" /> 11 <solid android:color="#00CCCCCC" /> 12 <corners android:radius="8dp" /> 13 </shape> 14 </item> 15 <item> 16 <shape android:shape="rectangle"> 17 <padding 18 android:bottom="2dp" 19 android:left="2dp" 20 android:right="2dp" 21 android:top="2dp" /> 22 <solid android:color="#10CCCCCC" /> 23 <corners android:radius="8dp" /> 24 </shape> 25 </item> 26 <item> 27 <shape android:shape="rectangle"> 28 <padding 29 android:bottom="2dp" 30 android:left="2dp" 31 android:right="2dp" 32 android:top="2dp" /> 33 <solid android:color="#20CCCCCC" /> 34 <corners android:radius="8dp" /> 35 </shape> 36 </item> 37 <item> 38 <shape android:shape="rectangle"> 39 <padding 40 android:bottom="2dp" 41 android:left="2dp" 42 android:right="2dp" 43 android:top="2dp" /> 44 <solid android:color="#30CCCCCC" /> 45 <corners android:radius="8dp" /> 46 </shape> 47 </item> 48 <item> 49 <shape android:shape="rectangle"> 50 <padding 51 android:bottom="2dp" 52 android:left="2dp" 53 android:right="2dp" 54 android:top="2dp" /> 55 <solid android:color="#50CCCCCC" /> 56 <corners android:radius="8dp" /> 57 </shape> 58 </item> 59 60 <!-- 中心背景 --> 61 <item> 62 <shape android:shape="rectangle" 63 android:useLevel="false"> 64 <!-- 实心 --> 65 <solid android:color="#ffffff" /> 66 <corners android:radius="10dp" /> 67 <padding android:left="10dp" 68 android:right="10dp" 69 android:top="10dp" 70 android:bottom="10dp"/> 71 </shape> 72 </item> 73 </layer-list>
使用
1 android:background="@drawable/layer_white_bg"
各种方式的差异
方式 | 是否有显示差异 | 是否可以控制阴影方向 | 是否可以设置阴影颜色 | 阴影是否占位 | 是否模糊 | 绘制效率 | 其他 |
elevation | 无 | 不可控制 | 不可设置 | 不占位 | 不 | 高,通过 native 绘制 | 只在 API 21 生效 |
CardView | 有 | 不可控制 | 不可设置 | 不占位 | 不 | Api 21 上效率高,通过native 绘制 | |
shape | 无 | 可控 | 可设置 | 占位 | 不 | 一般 | |
.9 图 | 无 | 可控,生效一次,更改需重新生成 | 可设置,更改需重新生成 | 占位 | 模糊 | 慢(加载图片显示) | |
SCardView | 无 | 可控 | 可设置 | 不占位 | 不 | 一般 |