首页 > 代码库 > iOS View自定义窍门——UIButton实现上显示图片,下显示文字
iOS View自定义窍门——UIButton实现上显示图片,下显示文字
“UIButton实现上显示图片,下显示文字”这个需求相信大家在开发中都或多或少会遇见。比如自定义分享View的时候。当然,也可以封装一个item,上边imageView,下边一个label。但是既然有现成的,稍微改造下,设置下就可以,干嘛还要重复造轮子。有时候好多东西不是他们没有给设置,而是暂时没找到如何设置的方法而已。
示例
1. 一开始我的方案
自定义类继承UIButton,然后
-(void)layoutSubviews
{
[super layoutSubviews];
CGFloat midX = self.frame.size.width / 2;
CGFloat midY = self.frame.size.height/ 2 ;
self.titleLabel.center = CGPointMake(midX, midY + 15);
self.imageView.center = CGPointMake(midX, midY - 10);
}
效果嘛,还不错,现在开发的项目中一直在用。但是心里总感觉这样有点旁门左道的样子,于是乎就有了下边的另外一种实现。
2. 之后试了好多次得到的结果
UIButton添加扩展
- (void)verticalImageAndTitle:(CGFloat)spacing
{
self.titleLabel.backgroundColor = [UIColor greenColor];
CGSize imageSize = self.imageView.frame.size;
CGSize titleSize = self.titleLabel.frame.size;
CGSize textSize = [self.titleLabel.text sizeWithFont:self.titleLabel.font];
CGSize frameSize = CGSizeMake(ceilf(textSize.width), ceilf(textSize.height));
if (titleSize.width + 0.5 < frameSize.width) {
titleSize.width = frameSize.width;
}
CGFloat totalHeight = (imageSize.height + titleSize.height + spacing);
self.imageEdgeInsets = UIEdgeInsetsMake(- (totalHeight - imageSize.height), 0.0, 0.0, - titleSize.width);
self.titleEdgeInsets = UIEdgeInsetsMake(0, - imageSize.width, - (totalHeight - titleSize.height), 0);
}
效果如下。imageView和label的大小都是根据内容确定的,而且二者的整体始终在中央,上下的间距可以设置。使用的时候要保证Button的宽度一定要大于等于图片的宽
效果图
效果图2
效果图3
iOS View自定义窍门——UIButton实现上显示图片,下显示文字
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。