<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="rectangle"
android:dither="true"> <corners android:radius="2dp"/>
<stroke
android:width="2dp"
android:color="#ccc" /> </shape>
</item> <item
android:top="0dp"
android:bottom="2dp"
>
<shape
android:shape="rectangle"
android:dither="true">
<corners android:radius="2dp"/>
<solid android:color="@android:color/white"/>
</shape>
</item> </layer-list>

我们注意到上面的文件中有item和shape,shape就不多说了就是一个规则的图像。其中item用了bottom、top来指定上下的内边距,最终带来了如下的效果:

我们来一步一步的理解这是怎么做出来的:

1.首先画一个只有描边的shape:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="rectangle"
android:dither="true"> <corners android:radius="2dp"/>
<stroke
android:width="2dp"
android:color="#ccc" /> </shape>
</item> </layer-list>

2.接下来我们需要让底部显示出灰色的描边,其余的地方都应该是白色的,所以写一个白色的shape,并且底部内边界是2dp。这里的bottom就是底部的内边距。

  <item
android:bottom="2dp"
>
<shape
android:shape="rectangle"
android:dither="true">
<corners android:radius="2dp"/>
<solid android:color="@android:color/white"/>
</shape>
</item>

3.最终组合起来,产生最终的效果:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape
android:shape="rectangle"
android:dither="true"> <corners android:radius="2dp"/>
<stroke
android:width="2dp"
android:color="#ccc" />
</shape>
</item> <item
android:bottom="2dp"
>
<shape
android:shape="rectangle"
android:dither="true">
<corners android:radius="2dp"/>
<solid android:color="@android:color/white"/>
</shape>
</item> </layer-list>

参考自:

http://my.oschina.net/u/937713/blog/168673

用layer-list做一个卡片背景的更多相关文章

  1. 巧用用layer-list做一个卡片背景

    <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android=" ...

  2. 用bootstrap做一个背景可轮转的登录界面

    用bootstrap做一个背景可轮转的登录界面 一.总结 一句话总结:用css3的动画的 @keyframes 规则,制作轮转图. 1.用bootstrap做一个背景可轮转的登录界面? a.动画部分用 ...

  3. 做一个阅读管理APP

    背景 由于最近在看的书有点多,所以一直想找一个能够管理阅读进度的书(鄙人记性不是很好,两天不看就忘了)可惜Android平台上一直找不到合适的APP: 有没有读书进度管理的网站或软件啊? 有没有记录读 ...

  4. 【Bugly干货分享】一起用 HTML5 Canvas 做一个简单又骚气的粒子引擎

    Bugly 技术干货系列内容主要涉及移动开发方向,是由Bugly邀请腾讯内部各位技术大咖,通过日常工作经验的总结以及感悟撰写而成,内容均属原创,转载请标明出处. 前言 好吧,说是“粒子引擎”还是大言不 ...

  5. 做一个会PS切图的前端开发

    系列链接 做一个会使用PS的前端开发 做一个会PS切图的前端开发 切图方法分类 PhotoShop从CS版本演变到现在的CC版本,切图功能发生了比较大的变化,我们可以把PhotoShop CS版本时的 ...

  6. 领导让我重新做一个微信H5页面!

    leader:我们需要做一个微信H5页面,效果如图,功能如描述,时间越快越好. 需求是不是很简单呢?2015-11-24 12:44:00文末有最新更新 背景描述 前几天微信转发相关项目开发后,这是第 ...

  7. 一起用HTML5 canvas做一个简单又骚气的粒子引擎

    前言 好吧,说是"粒子引擎"还是大言不惭而标题党了,离真正的粒子引擎还有点远.废话少说,先看demo 本文将教会你做一个简单的canvas粒子制造器(下称引擎). 世界观 这个简单 ...

  8. NetAnalyzer笔记 之 三. 用C++做一个抓包程序

    [创建时间:2015-08-27 22:15:17] NetAnalyzer下载地址 经过前两篇的瞎扯,你是不是已经厌倦了呢,那么这篇让我们来点有意思的吧,什么,用C#.不,这篇我们先来C++的 Wi ...

  9. - 通过 UIBezierPath 做一个中空的扫描器

    今天在公司的代码里看到通过 UIBezierPath 绘制 CALayer 然后实现中空的正方形,感觉还挺有意思的,简单记录一下 UIBezierPath 这个东西. 一条线 我们自定义一个 Bezi ...

随机推荐

  1. mongodb的安装(linux下)

    1.去官网下载安装包 2.解压tar包 tar -zxvf filename 3.移动路径,并进入路径 mv mongodb-linux-x86_64-3.0.6/ /usr/local/mongod ...

  2. struts2的搭建和简单的例子(采用struts-2.5.2版本)

    struts框架的概述: 当2001年初,Struts的第一个版本在apache网站上发布,它提供了一种分离视图和业务应用逻辑的web应用方案. 在Struts诞生之前,开发人员都是在jsp里写入处理 ...

  3. Linux 利用hosts.deny 防止暴力破解ssh

    一.ssh暴力破解 利用专业的破解程序,配合密码字典.登陆用户名,尝试登陆服务器,来进行破解密码,此方法,虽慢,但却很有效果. 二.暴力破解演示 2.1.基础环境:2台linux主机(centos 7 ...

  4. Julia - 复数

    全局变量 im 即复数 i ,为复数的虚数单位,表示 -1 的正平方根 Julia 允许数值作为代数系数,这也适用于复数 julia> 1 + 2im 1 + 2im 复数的运算 julia&g ...

  5. 29_java之JDBC|SQL注入

    01JDBC概念和数据库驱动程序 * A: JDBC概念和数据库驱动程序 * a: JDBC概述 * JDBC(Java Data Base Connectivity,java数据库连接)是一种用于执 ...

  6. Memcache线上常见问题(缓存雪崩、缓存无底洞、永久数据被踢)

    缓存雪崩现象 一般是由于某个节点失效,导致其它节点的缓存命中率下降,缓存中缺失的数据直接去数据库查询,短时间内造成数据库服务器崩溃. 或者是由于缓存周期性失效,比如设置每隔6个小时失效一次,那么每6个 ...

  7. Unknown picture file extension

    Image1.Picture.LoadFromFile('aaa.jpg'); Project Project1.exe raised exception class EInvalidGraphic ...

  8. UNITY Destroy()和DestroyImadiate()都不会立即释放对象内存

    如题,destroyimadiate是立即将物体从场景hierachy中移除,并标记为 "null",注意 是带引号的null.这是UNITY内部的一个处理技巧.关于这个技巧有很争 ...

  9. STL - Vector迭代器简单应用之计算元素和

    Description 用vector向量容器装入10个整数,然后,使用迭代器iterator和accumulate算法统计出这10个元素的和 Solution #include "stda ...

  10. 从零玩转JavaWeb系列7web服务器-----用户登录界面二维码的制作

    1.用eclipse工具新建一个Dynamic Web Project工程如下: 2.在Java Resources的src目录下新建一个包,包名称为com.it666.code 3.在com.it6 ...