iOS中轻松控制UIButton中image和title的位置

UIButton是iOS的基础控件，它默认是图片在左，文字在右的。但我们在实际开发中有许多情况是要随需求调整的，现结合实际开发中使用的方法分享给大家：

　　

UIButton是iOS的基础控件，它默认是图片在左，文字在右的。但我们在实际开发中有许多情况是要随需求调整的，现结合实际开发中使用的方法分享给大家。

     我的方法是给UIButton写一个分类,.h中写上如下几个方法：

#import <UIKit/UIKit.h>

@interface UIButton (Alignment)
/**
 *  水平排列，文字在左，图片在右
 *
 *  @param space 文字和图片间隔
 */
- (void)setTitleImageHorizontalAlignmentWithSpace:(float)space;

/**
 *  水平排列，图片在左，文字在右
 *
 *  @param space 图片和文字间隔
 */
- (void)setImageTitleHorizontalAlignmentWithSpace:(float)space;

/**
 *  竖直排列，文字在上，图片在下
 *
 *  @param space 文字和图片的间距
 */
- (void)setTitleImageVerticalAlignmentWithSpace:(float)space;

/**
 *  竖直排列，图片在上，文字在下
 *
 *  @param space 图片和文字的间距
 */
- (void)setImageTitleVerticalAlignmentWithSpace:(float)space;

@end

 

然后在.m中实现如下代码：

 

- (void)setTitleImageHorizontalAlignmentWithSpace:(float)space;
{
    [selfresetEdgeInsets];
    [selfsetNeedsLayout];
    [selflayoutIfNeeded];
   
    CGRect contentRect = [selfcontentRectForBounds:self.bounds];
    CGSize titleSize = [selftitleRectForContentRect:contentRect].size;
    CGSize imageSize = [selfimageRectForContentRect:contentRect].size;
   
    [selfsetContentEdgeInsets:UIEdgeInsetsMake(0, 0, 0, space)];
    [selfsetTitleEdgeInsets:UIEdgeInsetsMake(0, -imageSize.width, 0, imageSize.width)];
    [selfsetImageEdgeInsets:UIEdgeInsetsMake(0, titleSize.width+space, 0, -titleSize.width - space)];
}

- (void)setImageTitleHorizontalAlignmentWithSpace:(float)space;
{
    [selfresetEdgeInsets];
    [selfsetTitleEdgeInsets:UIEdgeInsetsMake(0, space, 0, -space)];
    [selfsetContentEdgeInsets:UIEdgeInsetsMake(0, 0, 0, space)];
}

- (void)setTitleImageVerticalAlignmentWithSpace:(float)space;
{
    [selfverticalAlignmentWithTitleTop:YESspace:space];
}

- (void)setImageTitleVerticalAlignmentWithSpace:(float)space;
{
    [selfverticalAlignmentWithTitleTop:NOspace:space];
}

- (void)verticalAlignmentWithTitleTop:(BOOL)isTop space:(float)space ;
{
    [selfresetEdgeInsets];
    [selfsetNeedsLayout];
    [selflayoutIfNeeded];
   
    CGRect contentRect = [selfcontentRectForBounds:self.bounds];
    CGSize titleSize = [selftitleRectForContentRect:contentRect].size;
    CGSize imageSize = [selfimageRectForContentRect:contentRect].size;
   
    float halfWidth = (titleSize.width + imageSize.width)/2;
    float halfHeight = (titleSize.height + imageSize.height)/2;
   
    float topInset = MIN(halfHeight, titleSize.height);
    float leftInset = (titleSize.width - imageSize.width)>0?(titleSize.width - imageSize.width)/2:0;
    float bottomInset = (titleSize.height - imageSize.height)>0?(titleSize.height - imageSize.height)/2:0;
    float rightInset = MIN(halfWidth, titleSize.width);
   
    if (isTop) {
        [selfsetTitleEdgeInsets:UIEdgeInsetsMake(-halfHeight-space, - halfWidth, halfHeight+space, halfWidth)];
        [selfsetContentEdgeInsets:UIEdgeInsetsMake(topInset+space, leftInset, -bottomInset, -rightInset)];
    } else {
        [selfsetTitleEdgeInsets:UIEdgeInsetsMake(halfHeight+space, - halfWidth, -halfHeight-space, halfWidth)];
        [selfsetContentEdgeInsets:UIEdgeInsetsMake(-bottomInset, leftInset, topInset+space, -rightInset)];
    }
}
/**
 *  重置边缘间距
 */
- (void)resetEdgeInsets
{
    [selfsetContentEdgeInsets:UIEdgeInsetsZero];
    [selfsetImageEdgeInsets:UIEdgeInsetsZero];
    [selfsetTitleEdgeInsets:UIEdgeInsetsZero];

}

 

如此大功能告成，在需要创建button的地方调用分类中的方法，就可以轻松愉快的控制文字和图片的位置了（如下为文字在下，图片的在上的样式，其它样式也是一样的调用方法）；

UIButton *loginBtn=[[UIButtonalloc] initWithFrame:CGRectMake(150, 120, 88, 52)];
    [loginBtn setTitleColor:[UIColorredColor] forState:UIControlStateNormal];
    [loginBtn setImage:[UIImageimageNamed:@"cellFollowClickIcon"] forState:UIControlStateNormal];
    [loginBtn setBackgroundColor:[UIColoryellowColor]];
    loginBtn.titleLabel.font = [UIFontsystemFontOfSize:12];
    [loginBtn setTitle:@"599人想要"forState:UIControlStateNormal];
    //设置图片在上文字在下
    [loginBtn setImageTitleVerticalAlignmentWithSpace:0];

    [self.viewaddSubview:loginBtn];