有些時候我們需要創(chuàng)建一些不一樣的button,像很多APP的按鈕會根據(jù)自己的需要安排按鈕上面圖片和文字的位置.這篇文章就是對UIButton進行了進一步的加工,封裝出滿足需要的按鈕.

JHButton.h文件

#import <UIKit/UIKit.h>
typedef void(^tapHandler)(UIButton *sender);
@interface JHButton : UIButton
@property (nonatomic,strong)tapHandler handler;
 + (instancetype)buttonWithType:(UIButtonType)buttonType frame:(CGRect)frame title:(NSString *)title titleColor:(UIColor *)titleColor titleFont:(CGFloat)font textAlignment:(NSTextAlignment)textAlignment  image:(UIImage *)image imageViewContentMode:(UIViewContentMode)imageViewContentMode handler:(tapHandler)handler;
@end

在.h文件中聲明一個+方法,和一個block(用作button的點擊事件);

JHButton.m文件

#import "JHButton.h"
//title所占的conentView的比例
#define kTitleRatio 0.4
@implementation JHButton
+ (instancetype)buttonWithType:(UIButtonType)buttonType frame:       (CGRect)frame title:(NSString *)title titleColor:(UIColor *)titleColor titleFont:(CGFloat)font textAlignment:(NSTextAlignment)textAlignment  image:(UIImage *)image imageViewContentMode:(UIViewContentMode)imageViewContentMode handler:(tapHandler)handler{
//button的類型
JHButton *button = [super buttonWithType:buttonType];
//button的frame
button.frame = frame;
//文字居中
button.titleLabel.textAlignment = textAlignment;
//文字大小
button.titleLabel.font = [UIFont systemFontOfSize:font];
//文字顏色
[button setTitleColor:titleColor forState:UIControlStateNormal];
//圖片填充的內(nèi)容模式
button.imageView.contentMode = imageViewContentMode;
//button的title
[button setTitle:title forState:UIControlStateNormal];
//button的image
[button setImage:image forState:UIControlStateNormal];
//button的點擊事件
button.handler = handler;
[button addTarget:button action:@selector(handleButton:) forControlEvents:UIControlEventTouchUpInside];
return button;
}
#pragma mark - handleButton
- (void)handleButton:(UIButton *)sender{
if (self.handler) {
    self.handler(sender);
}
}

此方法設(shè)置title在左,圖片在右(舉例)

#pragma mark - 調(diào)整內(nèi)部ImageView的frame
- (CGRect)imageRectForContentRect:(CGRect)contentRect{
CGFloat imageX = contentRect.size.width * kTitleRatio;
CGFloat imageY = 0;
CGFloat imageWidth = contentRect.size.width * (1 - kTitleRatio);
CGFloat imageHeight = contentRect.size.height;
return CGRectMake(imageX, imageY, imageWidth, imageHeight); 
}
#pragma mark - 調(diào)整內(nèi)部UIlable的frame
- (CGRect)titleRectForContentRect:(CGRect)contentRect{
CGFloat titleX = 0;
CGFloat titleY = 0;
CGFloat titleWidth = contentRect.size.width * kTitleRatio - 20;
CGFloat titleHeight = contentRect.size.height;
return CGRectMake(titleX, titleY, titleWidth, titleHeight);
}

示例一

如下設(shè)置圖片在上,title在下(舉例)

#pragma mark - 調(diào)整內(nèi)部ImageView的frame --
- (CGRect)imageRectForContentRect:(CGRect)contentRect{
CGFloat imageX = 0;
CGFloat imageY = 0;
CGFloat imageWidth = contentRect.size.width;
CGFloat imageHeight = contentRect.size.height * (1 - kTitleRatio);
return CGRectMake(imageX, imageY, imageWidth, imageHeight);
}
#pragma mark - 調(diào)整內(nèi)部UIlable的frame
- (CGRect)titleRectForContentRect:(CGRect)contentRect{
CGFloat titleX = 0;
CGFloat titleHeight = contentRect.size.height * kTitleRatio;
CGFloat titleY = contentRect.size.height - titleHeight + 10;
CGFloat titleWidth = contentRect.size.width;
return CGRectMake(titleX, titleY, titleWidth, titleHeight);    
}

示例二

在ViewController里調(diào)用

- (void)createSubView{
JHButton *button = [JHButton buttonWithType:UIButtonTypeCustom frame:CGRectMake(0, 0, 200, 200) title:@"登錄" titleColor:[UIColor yellowColor] titleFont:25 textAlignment:NSTextAlignmentCenter image:[UIImage imageNamed:@"1234"] imageViewContentMode:UIViewContentModeLeft handler:^(UIButton *sender) {
}];
[self.view addSubview:button];
}

原始的UIButton文字與圖片位置(紫色背景的圖片為backgroundImage,綠色背景為Image,紅色背景為Label),只又在添加這些圖片或文字后,才會顯示出來,否則不會顯示(如不setTitle,則紅色的view將不會顯示出來).

原始的Button圖文位置