中级篇第一期：UIButton内部再利用

     

当大家看到这两个图的时候，如果你没有看本文的标题，我想你的第一认识绝对是View里面包了一个ImageView和一个Label，没错，其实UIButton的内部就是这个构造，图1是由咱们原生的，而图2则是咱们衍生的，在项目开发过程中，会有很多情况利用到图2或更多相关衍生的现象，本期为大家做一个简单的例子，在项目中如何利用UIButton的内部构造

我们如何实现图1到图2的转化，先为大家介绍图中的各个颜色区域所表示的内容

橙色为当前View的背景色，红色为Button的背景色，蓝色为Button中的TitleLabel，图片为Button中的ImageView

在阅读下面代码前，请大家一定要了解bounds的具体意义

//根据效果图1我们先来获得p_w_picpathView的center
CGPoint p_w_picpathViewCenterNow = button.p_w_picpathView.center;

//根据效果图1我们先来获得titleLabel的center
CGPoint titleLabelCenterNow = button.titleLabel.center;

//获得Button的Center
CGPoint buttonBoundsCenter = CGPointMake(CGRectGetMidX(button.bounds), CGRectGetMidY(button.bounds));

//根据效果图2我们先来获得p_w_picpathView最终想要得到的center
CGPoint p_w_picpathViewCenter = CGPointMake(buttonBoundsCenter.x, CGRectGetMidY(button.p_w_picpathView.bounds));

//根据效果图2我们再来获得titleLabel最终想要得到的center
CGPoint titleLabelCenter = CGPointMake(buttonBoundsCenter.x, CGRectGetHeight(button.bounds) - CGRectGetMidY(button.titleLabel.bounds));

//根据两个图的差异我们来设置p_w_picpathEdgeInsets
//因为我们要将图上移，所以top一定是负值，bottom一定是正值，因为我们要将图右移，所以left一定是正值，right一定是负值
CGFloat p_w_picpathEdgeInsetsTop = p_w_picpathViewCenter.y - p_w_picpathViewCenterNow.y;

CGFloat p_w_picpathEdgeInsetsLeft = p_w_picpathViewCenter.x - p_w_picpathViewCenterNow.x;

CGFloat p_w_picpathEdgeInsetsBottom = -p_w_picpathEdgeInsetsTop;

CGFloat p_w_picpathEdgeInsetsRight = - p_w_picpathEdgeInsetsLeft;

UIEdgeInsets p_w_picpathInsets = UIEdgeInsetsMake(p_w_picpathEdgeInsetsTop, p_w_picpathEdgeInsetsLeft, p_w_picpathEdgeInsetsBottom, p_w_picpathEdgeInsetsRight);

button.p_w_picpathEdgeInsets = p_w_picpathInsets;

//根据两个图的差异我们来设置titleEdgeInsets，跟p_w_picpath同理
CGFloat titleEdgeInsetsTop = titleLabelCenter.y - titleLabelCenterNow.y;

CGFloat titleEdgeInsetsLeft = titleLabelCenter.x - titleLabelCenterNow.x;

CGFloat titleEdgeInsetsBottom = -titleEdgeInsetsTop;

CGFloat titleEdgeInsetsRight = -titleEdgeInsetsLeft;

UIEdgeInsets titleInsets = UIEdgeInsetsMake(titleEdgeInsetsTop, titleEdgeInsetsLeft, titleEdgeInsetsBottom, titleEdgeInsetsRight);

button.titleEdgeInsets = titleInsets;

没错，这就是UIButton的内部再利用，小伙伴们有没有想过，Button其实可以这么玩，由于时间有限，在这里就介绍这么多，欢迎校友们继续探索并补充，如有更好的想法，请分享到技术群里，我们一起来讨论