如何在Android中设置阴影视图?

我想知道如何添加一个阴影层到任何一般的视图在Android中。 例如:假设我有一个布局xml,显示这样的东西..

<?xml version="1.0" encoding="utf-8"?> <LinearLayout android:layout_height="wrap_content" android:layout_width="wrap_content" <Button.... ... </LinearLayout> 

现在,当它显示时,我想在它周围有一个阴影。

有一个简单的伎俩,使用两个视图,形成了阴影。

 <?xml version="1.0" encoding="utf-8"?> <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:padding="10dp" android:background="#CC55CC"> <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="vertical"> <TableLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:stretchColumns="0"> <TableRow> <LinearLayout android:id="@+id/content" android:layout_width="wrap_content" android:layout_height="wrap_content"> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="#FFFFFF" android:text="@string/hello" /> </LinearLayout> <View android:layout_width="5dp" android:layout_height="fill_parent" android:layout_marginTop="5dp" android:background="#55000000"/> </TableRow> </TableLayout> <View android:layout_width="fill_parent" android:layout_height="5dp" android:layout_marginLeft="5dp" android:background="#55000000"/> </LinearLayout> </FrameLayout> 

希望这个帮助。

创build阴影的最佳方法是使用9patch图像作为视图的背景(或包装视图的ViewGroup )。

第一步是创build一个带有阴影的png图像。 我用photoshop来创build这样一个图像。 它非常简单。

  • 用Photoshop创build一个新的图像。
  • 添加一个图层并创build一个4×4的黑色方块。
  • 通过在图层浏览器中select图层并单击标题为fx的button并select投影来在图层上创build阴影。
  • 将图像导出为png。

下一步是从这个图像创build9个补丁的drawables。

  • android-sdk/tools打开draw9patch
  • draw9patch打开图像
  • 在正方形四边创build4条黑线,然后保存为shadow.9.png

现在,您可以将此阴影添加为要添加阴影的视图的背景。 将shadow.9.png添加到res/drawables 。 现在添加它作为背景:

 <LinearLayout android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@drawable/shadow" android:paddingBottom="5px" android:paddingLeft="6px" android:paddingRight="5px" android:paddingTop="5px" > 

我最近写了一篇博客文章 ,详细解释了这一点,并包含了我用来创build影子的9patch映像。

假设你会使用线性布局(我已经考虑了垂直线性布局)..并有一个视图正好在你的线性layout.Now这个视图提供了一个开始颜色和结束颜色..我也想得到这个东西,其为我工作..如果你需要一个更好的效果,那么只是围绕起点和终点的颜色。

activity_main

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <LinearLayout android:id="@+id/vertical" android:layout_width="match_parent" android:layout_height="150dp" android:background="@drawable/layout_back_bgn" android:orientation="vertical" > </LinearLayout> <View android:layout_below="@+id/vertical" android:layout_width="match_parent" android:layout_height="10dp" android:background="@drawable/shadow" > </View> </LinearLayout> 

layout_back_bgn.xml

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <solid android:color="#FF4500" /> </shape> 

shadow.xml

 <?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> <gradient android:startColor="#4D4D4D" android:endColor="#E6E6E6" android:angle="270" > </gradient> </shape> 

我试图张贴一个图像,我使用上述代码后,但stackoverflow doesnot让我因为我没有声望..不好意思。

您可以使用自API级别21起可用的高程

由Z属性表示的视图的高程决定了其阴影的视觉外观:具有较高Z值的视图投射较大,较柔和的阴影。 具有较高Z值的视图遮挡具有较低Z值的视图; 但是,视图的Z值不会影响视图的大小。 设置视图的高程:

在布局定义中,使用

 android:elevation 

属性。 要在活动的代码中设置视图的高程,请使用

 View.setElevation() 

方法。

资源

这是我的解决scheme…这是在这里find的解决scheme的修改

我不喜欢angular落的样子,所以我淡化了所有的angular落。

 <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <!--Layer 0--> <!--Layer 1--> <!--Layer 2--> <!--Layer 3--> <!--Layer 4 (content background)--> <!-- dropshadow --> <item> <shape> <gradient android:startColor="@color/white" android:endColor="@color/white" android:centerColor="#10CCCCCC" android:angle="180"/> <padding android:top="0dp" android:right="0dp" android:bottom="2dp" android:left="0dp" /> </shape> </item> <item> <shape> <gradient android:startColor="@color/white" android:endColor="@color/white" android:centerColor="#20CCCCCC" android:angle="180"/> <padding android:top="0dp" android:right="0dp" android:bottom="2dp" android:left="0dp" /> </shape> </item> <item> <shape> <gradient android:startColor="@color/white" android:endColor="@color/white" android:centerColor="#30CCCCCC" android:angle="180"/> <padding android:top="0dp" android:right="0dp" android:bottom="2dp" android:left="0dp" /> </shape> </item> <item> <shape> <gradient android:startColor="@color/white" android:endColor="@color/white" android:centerColor="#40CCCCCC" android:angle="180"/> <padding android:top="0dp" android:right="0dp" android:bottom="2dp" android:left="0dp" /> </shape> </item> <item> <shape> <gradient android:startColor="@color/white" android:endColor="@color/white" android:centerColor="#50CCCCCC" android:angle="180"/> <padding android:top="0dp" android:right="0dp" android:bottom="2dp" android:left="0dp" /> </shape> </item> <!-- content background --> <item> <shape> <solid android:color="@color/PostIt_yellow" /> </shape> </item> 

在这里输入图像描述

 </LinearLayout> <View android:layout_width="match_parent" android:layout_height="2dp" android:background="@color/dropShadow" /> 

在LinearLayout之下使用

另一种方法

在这里输入图像描述

在/ drawable文件夹中创build“rounded_corner_bg.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="@color/primaryColor" /> <corners android:radius="4dp" /> </shape> </item> <item android:bottom="2dp" android:left="0dp" android:right="0dp" android:top="0dp"> <shape android:shape="rectangle"> <solid android:color="#F7F7F7" /> <corners android:radius="4dp" /> </shape> </item> </layer-list> 

要使用此布局 android:background="@drawable/rounded_corner_bg"