我想知道如何在android中的任何常规视图中添加阴影图层。例如:假设我有一个布局xml,显示类似的东西..
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
<Button....
...
</LinearLayout>
现在,当它显示时,我希望它周围有一个阴影。
答案 0 :(得分:38)
创建阴影的最佳方法是使用9patch
图像
视图的背景(或包裹视图的ViewGroup
)。
第一步是创建一个带有阴影的png图像。一世 用photoshop创建这样的图像。它非常简单。
下一步是从此图像创建9-patch drawables。
draw9patch
android-sdk/tools
draw9patch
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"
>
我最近写了一篇blog post,详细解释了这一点 包括我用来创建阴影的9patch图像。
答案 1 :(得分:12)
假设您将使用线性布局(我考虑过垂直线性布局)..并且在线性布局下方有一个视图。此视图现在提供开始颜色和结束颜色。 我也想得到这个东西,它为我工作..如果你需要更好的效果,那么只需要解决开始和结束的颜色。
<强> 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不允许我因为我没有声誉。抱怨。
答案 2 :(得分:7)
您可以使用自API级别21以来可用的高程
由Z属性表示的视图的高程决定了 其阴影的视觉外观:具有更高Z值的视图 更大,更柔和的阴影。具有较高Z值的视图会遮挡视图 较低的Z值;但是,视图的Z值不会影响 查看大小。要设置视图的高程:
在布局定义中,使用
android:elevation
属性。要在活动代码中设置视图的高程, 使用
View.setElevation()
方法
答案 3 :(得分:4)
这是我的解决方案的俗气版本...这是对找到的解决方案的修改 here
我不喜欢角落看起来如此褪色所有这些......
<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>
答案 4 :(得分:2)
有一个简单的技巧,使用两个形成阴影的视图。
<?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>
希望得到这个帮助。
答案 5 :(得分:0)
</LinearLayout>
<View
android:layout_width="match_parent"
android:layout_height="2dp"
android:background="@color/dropShadow" />
使用LinearLayout正好
另一种方法
在/ drawable文件夹中创建“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"
答案 6 :(得分:0)
使用以下代码在 res/drawable 文件夹中创建 card_background.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="#BDBDBD"/>
<corners android:radius="5dp"/>
</shape>
</item>
<item
android:left="0dp"
android:right="0dp"
android:top="0dp"
android:bottom="2dp">
<shape android:shape="rectangle">
<solid android:color="#ffffff"/>
<corners android:radius="5dp"/>
</shape>
</item>
</layer-list>
然后将以下代码添加到您想要卡片布局的元素中
android:background="@drawable/card_background"
下面一行定义了卡片阴影的颜色
<solid android:color="#BDBDBD"/>