为按钮添加边框~

需求

近来App中按钮要做统一话，如图所示框住部分为可点击区域，显示区域则为白色圆角框区域~~

317AA6AC-7059-4876-A5C3-5293D82A2F74.png

实现思路

根据上图表示，实现思路有

1. 自定义控件
   自定义控件就可以完美的实现这样的功能，并且也方面调整，对于新项目来说 是一个最优的方案了，但是由于是对app进行优化，项目中之前一直使用的是button，改起来工作量繁重，并且都是体力活不经济实惠，对于我这种懒惰的程序员来说，简直是折磨·· pass

2. 基于button做修改

   2.1 直接使用带文字的图片展示。

   但是由于app中包含了多种字体，如果要带文字的图片则一个按钮需要多张图片，这会无止境的增加项目内的图片，进而会增加项目包大小，非常的不经济·· 血崩··· Pass

   2.2 直接对button的titlelabel的layer做处理

   事实证明是可以的，但是效果图如下··
   

FEB48514-0406-40D4-827D-1124B30C53A8.png

      可以看出由于button对titlelabel做的处理，导致边框紧紧的围着文字，显得相当的不美观，进而Pass

2.3 对button的layer做处理

基于2.2可知，对layer层直接做处理是可行的，只是由于button对titlelabel做的处理，导致titlelabel的frame和文本的高宽一致，不能直接使用其layer处理，但是如果我们得知了titlelabel的frame，直接对此frame进行宽高的增加，中心点不变，来生成一个新的layer放到button上。这样处理下，圆角边框仅仅和button的内容相关，则button可以任意设置宽高，进而点击区域就不会被button的内容展示限制，简直完美。

效果展示

红色为可点击区域，虽然在项目中 没有用到 需要将button的imageview和titlelabel一起框起来的需求，但是在实际实现中，也将其实现进去了。
PS：同时也实现了安卓button自带的点击背景色改变效果~ 没办法，老大说要和安卓一样。。我有一句·····

btnlayer.gif

Demo地址

如有问题-联系邮箱357863248@qq.com.