码迷,mamicode.com
首页 > 移动开发 > 详细

android中图型的阴影效果(shadow-effect-with-custom-shapes)

时间:2017-06-06 20:40:44      阅读:202      评论:0      收藏:0      [点我收藏+]

标签:net   top   技术   enter   gravity   item   line   多层   color   

思路:

在自己定义shape中添加一层或多层。并错开。就可以显示阴影效果。为添加立体感,button按下的时候,仅仅设置一层。我们能够通过top, bottom, right 和 left 四个參数来控制阴影的方向和大小。

技术分享

关系图

下面自己定义两种阴影效果:

res/drawable-hdpi/shadow1.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>
            <item android:left="4dp" android:top="4dp"><shape>
                    <solid android:color="#ff58bb52" />
                    <corners android:radius="30dip" />
                </shape></item>
        </layer-list>
    </item>
    <item>
        <layer-list>
            <!-- 第一层 -->
            <item android:left="4dp" android:top="4dp"><shape>
                    <solid android:color="#66000000" />
                    <corners android:radius="30dip" />
                    <!-- 描边 -->
                    <stroke android:width="1dp" android:color="#ffffffff" />
                </shape></item>
            <!-- 第二层 -->
            <item android:bottom="4dp" android:right="4dp"><shape>
                    <solid android:color="#ff58bb52" />
                    <corners android:radius="30dip" />
                    <!-- 描边 -->
                    <stroke android:width="1dp" android:color="#ffffffff" />
                </shape></item>
        </layer-list></item>
</selector>

/TestAA/res/drawable-hdpi/shadow2.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>
            <item 
                android:left="4dp" 
                android:top="4dp">
                <shape>
                    <solid 
                        android:color="#ff58bb52" />
                    <corners 
                        android:radius="3dp" />
                </shape>
             </item>
        </layer-list></item>
    <!-- 正常状态 -->
    <item>
        <layer-list>
            <!-- 第一层 -->
            <item 
                android:left="2dp" 
                android:top="2dp">
                <shape>
                    <solid 
                        android:color="#66000000" />
                    <corners
                        android:radius="3dp" />
                </shape>
            </item>
            <!-- 第二层 -->
            <item 
                android:bottom="4dp" 
                android:right="4dp">
                <shape>
                    <solid 
                        android:color="#ff58bb52" />
                    <corners 
                        android:radius="3dp" />
                </shape>
            </item>
            <!-- 第三层 -->
            <item 
                android:bottom="6dp" 
                android:right="6dp">
                <shape>
                    <solid 
                        android:color="#ffcccccc" />
                    <corners 
                        android:radius="3dp" />
                </shape>
           </item>
        </layer-list>
   </item>
</selector>

效果图:

技术分享

android中图型的阴影效果(shadow-effect-with-custom-shapes)

标签:net   top   技术   enter   gravity   item   line   多层   color   

原文地址:http://www.cnblogs.com/clnchanpin/p/6953273.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!