iOS UIButton 设置图片文字垂直排列

浏览数：35 / 时间：2015年06月11日

本文转载至http://my.oschina.net/sayonala/blog/198376

摘要经过一下午的查阅资料及尝试，最终解决了在图片和文字垂直排列的情况下，如果文字长度变化会导致图片位置变动的问题。

经过一下午的查阅资料及尝试，最终解决了在图片和文字垂直排列的情况下，如果文字长度变化会导致图片位置变动的问题，最开始采用了网上比较多的做法，做法如下：

@interface UIButton (UIButtonExt)  
- (void)centerImageAndTitle:(float)space;  
- (void)centerImageAndTitle;  
@end  
 
@implementation UIButton (UIButtonExt)  
- (void)centerImageAndTitle:(float)spacing  
{      
    // get the size of the elements here for readability  
    CGSize imageSize = self.imageView.frame.size;  
    CGSize titleSize = self.titleLabel.frame.size;  
 
    // get the height they will take up as a unit  
    CGFloat totalHeight = (imageSize.height + titleSize.height + spacing);  
 
    // raise the image and push it right to center it  
    self.imageEdgeInsets = UIEdgeInsetsMake(- (totalHeight - imageSize.height), 0.0, 0.0, - titleSize.width);  
 
    // lower the text and push it left to center it  
    self.titleEdgeInsets = UIEdgeInsetsMake(0.0, - imageSize.width, - (totalHeight - titleSize.height),0.0);      
}  
 
- (void)centerImageAndTitle  
{  
    const int DEFAULT_SPACING = 6.0f;  
    [self centerImageAndTitle:DEFAULT_SPACING];  
 }  
@end

后面经过测试，如果button的文字长度变更，会导致图片位置变化，经过多次修改UIEdgeInsets的值也没有达到期望效果，最终采用集成UIButton类，重写layoutSubviews函数实现，特将成果记录一下，以便后续查阅

-(void)layoutSubviews {
    [super layoutSubviews];
 
    // Center image
    CGPoint center = self.imageView.center;
    center.x = self.frame.size.width/2;
    center.y = self.imageView.frame.size.height/2;
    self.imageView.center = center;
 
    //Center text
    CGRect newFrame = [self titleLabel].frame;
    newFrame.origin.x = 0;
    newFrame.origin.y = self.imageView.frame.size.height + 5;
    newFrame.size.width = self.frame.size.width;
 
    self.titleLabel.frame = newFrame;
    self.titleLabel.textAlignment = UITextAlignmentCenter;
}