安卓shadow综合控件和布局

时间:2022-02-05 22:41:40

最近项目遇到需要做一个阴影效果,涉及到一个listview的item的阴影效果,本菜赶紧去网上搜索了一下,还真的有,研究一下,写一个控件和布局都有的博客,就当是笔记了,留着以后查看

1.首先写控件的

一般的控件都可以用,比如说textview,button,edittext,等等这些控件自带阴影效果属性,下面写一个textview的布局:

<TextView
android:id="@+id/test_shadow2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:shadowColor="#ff000000"
android:shadowDx="10"
android:shadowDy="10"
android:shadowRadius="1"
android:text="SHADOW"
android:textColor="#ffffffff"
android:textSize="60sp" />

注意其中的属性:android:shadowColor="#ff000000" 这个是阴影的颜色

android:shadowDx="10" 水平方向上的偏移量,正负代表方向,大小代表距离

android:shadowDy="10"垂直方向上的偏移量,正负大小同Dx,Dx和Dy的比例决定“太阳“的位置,大家自己调试

android:shadowRadius="1"阴影半径和模糊度的大小,自己可以做实验,该值越大,半径越大,显示越大,也越模糊,找到适合自己的度数

浮雕效果:Dx和Dy的值调节到比较小,但不为0.

光圈效果:Dx和Dy的值为0,Radius比较大

还有一些其他效果都是通过这几个值加上颜色对比形成的,有兴趣的可以自己尝试一下

2.我用到的是布局阴影效果,因为listview的item是一个布局,所以现在用下面这个方法

直接写一个background_shadow.xml文件



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

<item android:state_pressed="true"><layer-list>

<!-- 相当于padding -->
<item android:left="4dp" android:top="4dp"><shape>
<solid android:color="#ff58bb52" />

<corners android:radius="1dip" />
</shape></item>
</layer-list></item>
<item><layer-list>

<!-- SHADOW LAYER -->
<item android:left="4dp" android:top="4dp"><shape>
<solid android:color="#66666666" />

<corners android:radius="1dip" />
</shape></item>
<!-- CONTENT LAYER -->
<!-- 相当于padding -->
<item android:bottom="4dp" android:right="4dp"><shape>
<solid android:color="#ffFFFFFF" />

<corners android:radius="1dip" />
</shape></item>
</layer-list></item>

</selector>
其中的color是背景颜色,radius是半径,bottom,left,right,top是方向,大家多尝试一下不同的值,就知道具体的效果了

用这个作为android:background="@drawable/shadow_to_layoutbg" 整体布局的背景就行了

这个是带有点击效果的背景,就是点击item之后显示效果和没有点击的不一样,如果想去掉效果,你可以有两种方法

1是将两个<item></item>的内容写成一样

2直接写一个<layer-list></layer-list>的 xml文件作为背景


控件相关连接:http://blog.csdn.net/hewence1/article/details/39993415

布局相关链接:http://www.jb51.net/article/75128.htm

效果图:安卓shadow综合控件和布局