wKiom1UFJaCTUkWcAACdyniqP1A596.jpg     wKiom1UFJaDgitKUAACZGdqLA38901.jpg


当大家看到这两个图的时候,如果你没有看本文的标题,我想你的第一认识绝对是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其实可以这么玩,由于时间有限,在这里就介绍这么多,欢迎校友们继续探索并补充,如有更好的想法,请分享到技术群里,我们一起来讨论