Android开发笔记——圆角和边框们

2017-04-15 21:47:44

在做Android界面开发时,我们往往希望它尽可能优美,尽可能显得专业。于是你看了看其他应用,哇,好多边框和圆角啊。你是不是也想给自己的应用加上边框和圆角效果?呃……那怎么做呢?如果你是从web前端跑到Android来的,那么我想你一定想到了不下三种解决方案。如用图片替代,用CSS3定义,用JS画。在Android中,其实也有类似的用法,本文将简单介绍两种Android圆角和边框的实现。

1 图片

在Android中,给一个控件(或View)设置背景主要是通过background:xxx属性来完成。background的参数一般来说是一个drawable资源。 drawable可以是一张普通的图片,也可以是9 patch图片,还可以是一个xml文件。 给控件设置边框最简单的方式就是把background设置成你预先设计好的带圆角和边框的背景图。比如下面这张图:

但是,你很快会发现一个缺点:灵活性很差!是的,固定大小的图片很难根据控件里的内容而调整大小。它在被做出来的那天就已经被确定了!换句话说,你很难只用这一张图来应付拥有相同风格却大小各异的控件。为了给所有控件加上圆角和边框,你必须小心翼翼地计算他们的大小,然后一个一个得制作背景图片!天哪,这简直太愚蠢了。一旦遇到大小不定的控件,这方法就歇菜了。而且,大量的背景图片会让你的安装包迅速膨胀。呃……还有,你怎么应对拥有各式各样分辨率的Android设备呢?

所以,你需要……换个方法。

比较为大众采用一种解决方案是NinePatch。可以毫不夸张得说,9 patch是Android中解决自适应问题的利器。介绍和使用你可以看看这里还有这里

使用9 patch图片有很多好处,如减轻美工压力,减少UI代码量,减少内存使用……总结起来就是:省时省力,屌爆了。

所以在给圆角和边框时,你或许会这么做。

当然,9 patch能做的是远远比这多,如做一个自适应的对话框什么的。

2 XML定义

我想大多数程序员都喜欢用代码解决问题。原因如下:

  1. 用代码更加cool。

  2. 我美工不行,我会说出去吗?

OK,好东西在这里。

2.1 基本的圆角、边框

Android除了支持原始的图片资源外,比较棒的一点就是可以用XML文件定义一些简单的图形。这有点像web的CSS,不过相比CSS3,Android的xml实现还没那么强大,例如,边框要么四周都有,要么四周都没有(我们将在后面讨论这事)。xml drawable的传送门在这里

要画一个带灰色边框和圆角的图形很容易,在drawable资源目录下添加一个xml:

<?xml version="1.0" encoding="utf-8"?> <!-- shape如果不声明形状则默认为正方形 --> <shape xmlns:android="http://schemas.android.com/apk/res/android" >     <corners android:radius="5.0dp" />     <!-- 圆角,你也可以对不同的角设置不同的数值 -->     <solid android:color="#FFFFFF" />     <!-- 形状的填充色 -->     <stroke         android:width="1dp"         android:color="#CCCCCC" />     <!-- 边框宽度和颜色 --> </shape>

在你需要用到这东西的地方如某个View下,设置background就行了。

2.2 “自由的边框“

当前版本的Android SDK并没有给stroke提供bottom、left、right之类的属性,也就是说你无法通过它来让长方形的边框少于4条。啊,真是太遗憾了。怎么办呢?有人想到了对Layer List hack。 在StackOverflow上有不少这样的把戏

为了实现只有left,right和top边框,我们可以这么写:

<?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://schemas.android.com/apk/res/android" >     <item>         <shape android:shape="rectangle" >             <stroke                 android:width="1dp"                 android:color="@color/card_stroke" />         </shape>     </item>     <item         android:left="2dp"         android:right="2dp"         android:top="2dp">         <!-- 在实际使用中我发现1dp达不到显示效果,而2dp正好可以显示边框 -->         <shape android:shape="rectangle" >             <solid android:color="@color/solid_white" />         </shape>     </item> </layer-list>

原理差不多是这样:

诡异的是理论上只要偏移量只要1dp就能显示1dp宽带边框了,但我在listview里实验了一下发现不行,换成2dp方可。有同学能解释解释么?

如果要给图形加上圆角,只需要给每个shape加上

<corners     android:topLeftRadius="5.0dip"     android:topRightRadius="5.0dip" />

值得注意的是,两个shape的radius在设置的时候请确保前面的图层不会把后面的挡住。

3 小结

要在Android中实现圆角和边框,比较简单的方法:图片、XML差不多就是这么用的啦。此外还有用Java代码调用draw方法画出来的,不过我没有研究过。 他们各有各的优点啦。用图片,能控制的东西更多,用代码修改起来比较另过。 最后要说的是两个方法的效率。在这个问题上,我留有疑问,没有做过专门的比较。但直观的感受是……好吧,没什么感受。


  • 2018-12-04 23:40:26

    pod删除已导入的第三方库和移除项目中的cocoapods

    CocoaPods是一个负责管理iOS项目中第三方开源库的工具。CocoaPods的项目源码在Github上管理。在我们有了CocoaPods这个工具之后,只需要将用到的第三方开源库放到一个名为Podfile的文件中,然后在命令行执行$ pod install命令。CocoaPods就会自动将这些第三方开源库的源码下载下来,并且为我的工程设置好相应的系统依赖和编译参数. 但是如果我们导入的某个第三方不适用,或者我们又不想使用该第三方,那我们又该如何将这些相关的东西从我们的项目中清理出去呢?

  • 2018-12-04 23:41:47

    制作自己的Pod库(公有/私有)

    目的:1.管理自己常用的类;2.组件化开发步骤:1.想一个比较酷的名字,在桌面简历文件夹。2.打开terminal,cd到这个文件夹下面,执行pod lib create  xxx(这里我们以JJCategoryKit为例子,下同)命令,如下图。这个过程会问几个问题,根据实际情况输入回答即可。这里我们选择添加demo,结束的时候会自动Lanuch这个app. 作者:深水日月 链接:https://www.jianshu.com/p/ece0b5721461 來源:简书 简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

  • 2018-12-05 06:08:26

    CocoaPods建立私有仓库 spec repo

    好多项目里都有公共的组件,copy来,copy去很容易出错,而且不容易维护,所以就想到用用cocoapods 建自己的私有库,Carthage用法虽然相对简单,但是它是把公共组件都放在framework里不容易单步调试,所以我还是选择用Cocoapods 来建立私有仓库 参考使用Cocoapods创建私有podspec

  • 2018-12-05 15:11:18

    为什么 Objective-C非常难

    作为一个Objective-C的coder,我总能听到一部 分人在这门语言上抱怨有很多问题。他们总在想快速学习这门语言来写一个App出来,但他们也总是联想到Objective-C看上去实在太难了或者在想这 些语法符号都是神马玩意?不错,他们问得非常好,所以本人也解释一下为什么很多程序员相比较学习Ruby或者Java很容易,但在决定开发iOS或者OS X应用时会那么犹豫。

  • 2018-12-05 15:22:23

    十分钟让你明白Objective-C的语法(和Java、C++的对比)

    很多想开发iOS,或者正在开发iOS的程序员以前都做过Java或者C++,当第一次看到Objective-C的代码时都会头疼,Objective-C的代码在语法上和Java, C++有着很大的区别,有的同学会感觉像是看天书一样。不过,语言都是相通的,有很多共性。下面列出Objective-C语言的语法和Java,C++的对比,这样你就会很容易Objective-C的语法是怎么回事了。

  • 2018-12-05 15:33:33

    一篇文章看懂有关iOS开发语言的一切!

    OS开发语言有哪些?OS开发语言主要包括什么?iOS开发语言具体怎么学习?今天重点介绍一下: iOS开发语言主要包括:C语言基础、Obiective-C编程、Swift、UIKit框架详解这几大块,在这里项目阶段就不详细的介绍了。 C语言基础 C语言是开发语言的基础,是最常用的一门程序设计语言,最常用于编写计算机程序。

  • 2018-12-06 10:03:36

    定时杀掉processlist sleep状态的线程

    由于程序设计的Bug,导致目前这个项目使用的数据库中有很多Sleep状态的线程。找了很多解决办法,还没发现最终有效的解决方案。只能临时使用如下方法: 编写shell文件,如killSleepProcess.sh

  • 2018-12-07 08:26:37

    mysql线程池和连接池的区别

    可能有的DBA会把线程池和连接池混淆,其实两者是有很大区别的,连接池一般在客户端设置,而线程池是在DB服务器上配置;另外连接池可以取到避免了连接频繁创建和销毁,但是无法取到控制MySQL活动线程数的目标,在高并发场景下,无法取到保护DB的作用。比较好的方式是将连接池和线程池结合起来使用。 作者:飞鸿无痕 链接:https://www.jianshu.com/p/88e606eca2a5 來源:简书 简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

  • 2018-12-07 17:47:24

    linux中wc命令用法

    Linux系统中的wc(Word Count)命令的功能为统计指定文件中的字节数、字数、行数,并将统计结果显示输出。