在android的开发过程中,我们可能会做圆角的效果出来,如下图所示:

四个角都是圆角的效果。如果让UI设计人员直接出图,可能会更简单一些。但是我们使用android中layer-list多图层叠加效果同样可以实现。

我们把它拆分为三个部分,第一个部分是最顶端的那一行(我这里称为顶部),第二部分是中间部分(中间部分不需要圆角效果),第三部分是底部。

顶部的实现:

顶部是一个有灰色边框但无下边框,带圆角,白色背景的长方体。实现效果如下:

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item >
<shape>
<solid android:color="#FFFFFF" />
<corners android:topLeftRadius="10dp" android:topRightRadius="10dp"
android:bottomRightRadius="0.1dp" android:bottomLeftRadius="0.1dp" />
<stroke android:width="1dp" android:color="#ffa8abad" />
</shape>
</item>
<item android:top="1dp" android:left="1dp" android:right="1dp">
<shape>
<solid android:color="#FFFFFF" />
<corners android:topLeftRadius="10dp" android:topRightRadius="10dp"
android:bottomRightRadius="0.1dp" android:bottomLeftRadius="0.1dp" />
<stroke android:width="1dp" android:color="#ffffffff" />
</shape>
</item>
</layer-list>

中间部分是一个不带圆角 白色背景 灰色边框 无下边框 长方体.实现效果如下:

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape>
<solid android:color="#FFFFFF" />
<stroke
android:width="1dp"
android:color="#ffa8abad" />
</shape>
</item>
<item
android:left="1dp"
android:right="1dp"
android:top="1dp">
<shape>
<solid android:color="#FFFFFF" />
<stroke
android:width="1dp"
android:color="#ffffffff" />
</shape>
</item>
</layer-list>

底部是一个具有底部圆角,白色背景,灰色边框的长方体,实现效果如下:

<?xml version="1.0" encoding="UTF-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<solid android:color="#FFFFFF" />
<corners android:topLeftRadius="0.1dp" android:topRightRadius="0.1dp"
android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" />
<stroke android:width="1dp" android:color="#ffa8abad" />
</shape>
</item>
<item android:top="1dp" android:bottom="1dp" android:left="1dp" android:right="1dp">
<shape>
<solid android:color="#FFFFFF" />
<corners android:topLeftRadius="0.1dp" android:topRightRadius="0.1dp"
android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" />
<stroke android:width="1dp" android:color="#ffffffff" />
</shape>
</item>
</layer-list>

通过layer-list多图层叠加效果实现圆角功能的更多相关文章

  1. android圆角功能,非常好用,可以用在图片,视频,gif等上面

    使用方式:直接在xml中使用即可. <com.base.baseview.RoundLayout android:id="@+id/example_view" android ...

  2. GlideDemo【Glide3.7.0版本的简单使用以及圆角功能】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 本Demo主要记录Glide3.7.0版本的简单运用和实现圆角方案. 效果图 代码分析 Glide的centerCrop()和fit ...

  3. GlideNewDemo【Glide4.7.1版本的简单使用以及圆角功能】

    版权声明:本文为HaiyuKing原创文章,转载请注明出处! 前言 简单记录下Glide4.7.1版本的使用和实现圆角方案. 注意:关于详细使用请仔细阅读<官方指南>. 效果图 使用步骤 ...

  4. layer图层常见属性

    把layer常见图层属性总结了一下^-^欢迎大家讨论~~~~来吧 ,代码属性 #import "CZViewController.h" @interface CZViewContr ...

  5. 设置UI控件的Layer属性(边框可见,边框颜色,边框宽度,边框圆角)

    设置UI控件的Layer属性 #import "ViewController.h" @interface ViewController () @property (strong, ...

  6. ios开发图层layer与核心动画二:CATransform3D,CAlayear和UIView区别,layer的position和anchorpoint

    一:CATransform3D #import "ViewController.h" @interface ViewController () @property (weak, n ...

  7. iOS开发——UI精选OC篇&UIApplication,UIWindow,UIViewController,UIView(layer)简单介绍

    UIApplication,UIWindow,UIViewController,UIView(layer)简单介绍 一:UIApplication:单例(关于单例后面的文章中会详细介绍,你现在只要知道 ...

  8. UIApplication,UIWindow,UIViewController,UIView(layer)

    转载自:http://www.cnblogs.com/iCocos/p/4684749.html UIApplication,UIWindow,UIViewController,UIView(laye ...

  9. 【iOS开发-图层】图层的获取与一些属性

    图层 每个控件都有自己的一个图层,这个空间的全部东西就是显示在这个图层上面的,控件本身没有显示东西的功能,仅仅有拥有了图层才干显示东西 图层的获取 CALayer *layer = self.test ...

随机推荐

  1. Three.js学习笔记 – “我和小伙伴都惊呆了”的特效和Three.js初探

    什么是Three.js three.js是JavaScript编写的WebGL第三方库.提供了非常多的3D显示功能.Three.js 是一款运行在浏览器中的 3D 引擎,你可以用它创建各种三维场景,包 ...

  2. locate linux文件查找命令

    locate 让使用者可以很快速的搜寻档案系统内是否有指定的档案.其方法是先建立一个包括系统内所有档案名称及路径的数据库,之后当寻找时就只需查询这个数据库,而不必实际深入档案系统之中了.在一般的 di ...

  3. Android 不通过USB数据线调试的方法

    在开发Android应用时,通常情况下是通过USB数据线连接设备和计算机,但对于一些需要使用USB设备的应用,这种方法就碰到了麻烦,手机的USB接口已经和外接的USB设备连接,无法再连数据线,此时可以 ...

  4. 存储、读取——Android应用程序内置的文件夹

    1.将数据存储到应用程序的文件夹,并读写 Context提供了两个方法,打开应用程序文件夹的I/O,若文件不存在则创建 FileInputStream openFileInputStream(Stri ...

  5. php中__autoload()方法详解

    [导读] PHP在魔术函数__autoload()方法出现以前,如果你要在一个程序文件中实例化100个对象,那么你必须用include或者require包含进来100个类文件,或者你把这100个类定义 ...

  6. 通过读取excel数据和mysql数据库数据做对比(一)-win环境准备

    要想操作excel和mysql首先需要安装python,然后是安装excel和mysql插件: 第一步安装python: 直接百度搜索,下载安装就可以了. 第二步安装excel插件: 首先到这个htt ...

  7. 【转】C++虚函数解析

    本文转自陈皓大叔(左耳朵耗子)的博客www.coolshell.com. 文章是很久之前所写,去年还在写C++时有幸拜读,现在想起来还是相当有价值一转的,如果有一定C++基础(特别是读过<深度探 ...

  8. Unix/Linux环境C编程入门教程(19)Red Hat Entetprise Linux 7.0环境搭建

    位架构,包括英特尔X-86_64.Power和s390.动态定时能力将降低内核内部中断数量,Open vSwitch 2.0功能可调节虚拟机之间的流量.RHEL 7中默认的文件系统是XFS,包含了一个 ...

  9. 关于TCP封包、粘包、半包

    关于Tcp封包 很多朋友已经对此作了不少研究,也花费不少心血编写了实现代码和blog文档.当然也充斥着一些各式的评论,自己看了一下,总结一些心得. 首先我们学习一下这些朋友的心得,他们是: http: ...

  10. Java学习-练习1

    题目描述: 吸血鬼数字是指位数为偶数的数字,可以由一对数字相乘而得到, 而这对数字各包含乘积的一半位数的数字,其中最初的数字中可以 选取的数字可以任意排序,以两个0结尾的数字是不允许的,例如,下 面的 ...