iOS - 一个简单的带标题的图标的实现

时间:2021-10-22 06:02:57

代码不复杂,直接上代码:

ImageViewButton.h
//
// ImageViewButton.h//
// 带有图片、底部标题或者顶部的按钮
//
// #import <UIKit/UIKit.h> NS_ASSUME_NONNULL_BEGIN @interface ImageViewButton : UIView /**
* 带有图标标题的按钮
*
* @param frame 大小
* @param image 图标
* @param title 标题
* @param topTitle 标题是否在顶部
*
*/
- (instancetype)initWithFrame:(CGRect)frame image:(NSString *)image title:(NSString *)title topTitle:(BOOL)topTitle; // 按钮点击回调
@property (copy, nonatomic) void (^iconClickCallback) (void); @end NS_ASSUME_NONNULL_END
ImageViewButton.m
//
// ImageViewButton.m
// #import "ImageViewButton.h" @interface ImageViewButton () // 图标
@property (strong, nonatomic) UIButton *iconButton;
// 标题
@property (strong, nonatomic) UILabel *titleLabel;
// 标题是否在顶部
@property (assign, nonatomic) BOOL topTitle; @end @implementation ImageViewButton - (instancetype)initWithFrame:(CGRect)frame image:(NSString *)image title:(NSString *)title topTitle:(BOOL)topTitle {
if (self = [super initWithFrame:frame]) {
self.topTitle = topTitle;
self.translatesAutoresizingMaskIntoConstraints = NO; // 图标
self.iconButton = [[UIButton alloc] initWithFrame:CGRectZero]; self.iconButton.translatesAutoresizingMaskIntoConstraints = NO;
[self.iconButton setImage:[UIImage imageNamed:image] forState:UIControlStateNormal];
[self.iconButton addTarget:self action:@selector(iconButtonClick:) forControlEvents:UIControlEventTouchUpInside]; [self addSubview:self.iconButton]; // 标题
self.titleLabel = [[UILabel alloc] initWithFrame:CGRectZero]; self.titleLabel.translatesAutoresizingMaskIntoConstraints = NO;
self.titleLabel.textAlignment = NSTextAlignmentCenter;
self.titleLabel.textColor = [UIColor whiteColor];
self.titleLabel.text = title; [self addSubview:self.titleLabel]; [self setConstraints];
} return self;
} - (void)iconButtonClick:(UIButton *)sender {
if (self.iconClickCallback) {
self.iconClickCallback();
}
} - (void)setConstraints {
// 标题
NSLayoutConstraint *titleLabelTopBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0];
NSLayoutConstraint *titleLabelLeadingLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeLeading relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeLeading multiplier:1.0 constant:0.0];
NSLayoutConstraint *titleLabelTrailingLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeTrailing relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTrailing multiplier:1.0 constant:0.0];
NSLayoutConstraint *titleLabelHeightLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1.0 constant:16.0]; // 图标
NSLayoutConstraint *iconImageViewWidthHeightLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.iconButton attribute:NSLayoutAttributeHeight multiplier:1.0 constant:0.0];
NSLayoutConstraint *iconImageViewCenterXLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeCenterX relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeCenterX multiplier:1.0 constant:0.0];
NSLayoutConstraint *iconImageViewTopLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.titleLabel attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0];
NSLayoutConstraint *iconImageViewBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0]; if (self.topTitle == NO) {
// 标题在底部
titleLabelTopBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.titleLabel attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeBottom multiplier:1.0 constant:0.0];
iconImageViewTopLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0];
iconImageViewBottomLayoutConstraint = [NSLayoutConstraint constraintWithItem:self.iconButton attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:self.titleLabel attribute:NSLayoutAttributeTop multiplier:1.0 constant:0.0];
} [self addConstraints:@[titleLabelTopBottomLayoutConstraint, titleLabelLeadingLayoutConstraint, titleLabelTrailingLayoutConstraint, titleLabelHeightLayoutConstraint, iconImageViewWidthHeightLayoutConstraint, iconImageViewCenterXLayoutConstraint, iconImageViewTopLayoutConstraint, iconImageViewBottomLayoutConstraint]];
} /*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
// Drawing code
}
*/ @end