一款简单方便的设置UIButton图片和标题相对位置及距离的工具LBButtonImageTitlePosition 支持pod

27 篇文章 1 订阅

前言:
我们经常会要用到自定义button的
标题,图片位置, 距离等定制化需求,
在网上也有很多相关工具,但找来之后发现用起来不方便,有时还不能满足需求,
于是,自己写了一个工具,目前支持图片和标题左右布局

一 想要实现如图的效果

    #import <LBButtonImageTitlePosition/UIButton+ImageTitleLocationSpace.h>
....
self.firstButton.contentEdgeInsets = UIEdgeInsetsMake(0, 20, 0, 40);
    [self.firstButton setTitle:@"你好你哈" forState:UIControlStateNormal];
    [self.firstButton setImage:[UIImage imageNamed:@"account_verify_info"] forState:UIControlStateNormal];
    [self.firstButton rightImgWithIntervalSpace:40];
    

请添加图片描述

二 实现原理核心代码

图片在右

- (void)rightImgWithIntervalSpace:(CGFloat)space
{
/*这里为了避免重复设置导致的button frame 重复改变,添加了一个判断*/
    if (self.hasSetPositionAndSpace) {
        return;
    }
    CGFloat imageWidth = self.imageView.image.size.width;
    CGFloat titleWidth = self.titleLabel.intrinsicContentSize.width;
    if ([UIApplication sharedApplication].userInterfaceLayoutDirection == UIUserInterfaceLayoutDirectionRightToLeft) {
        //反向语言处理
        [self setImageEdgeInsets:UIEdgeInsetsMake(0, -titleWidth - space/2.0, 0, titleWidth + space/2.0)];
        [self setTitleEdgeInsets:UIEdgeInsetsMake(0, imageWidth + space/2, 0, -imageWidth-space/2.0)];
    } else {
    ///通常情况下,我们只需要关注正向布局的即可
    /*
    这里的 titleWidth的标题的宽度
    正常情况下,图片是在左,标题是在右的,
    我们如果想要实现图片在右边,则需要
    将图片的左边距和有边距都移动
    标题的宽度(图片移动的距离等于左边距移动的距离/2 + 右边距移动的距离/2),然后还需要加上我们设置的距离
    */
    
        [self setImageEdgeInsets:UIEdgeInsetsMake(0, titleWidth + space/2.0, 0, -titleWidth -space/2.0)];
        [self setTitleEdgeInsets:UIEdgeInsetsMake(0, -imageWidth - space/2, 0, imageWidth + space/2.0)];
    }
    [self _updateContentInsetWithSpace:space];
}

// 图片在左边就简单些了

- (void)intervalSpace:(CGFloat)space
{
    if (self.hasSetPositionAndSpace) {
        return;
    }
    if ([UIApplication sharedApplication].userInterfaceLayoutDirection == UIUserInterfaceLayoutDirectionRightToLeft) {
        //反向语言处理
        [self setTitleEdgeInsets:UIEdgeInsetsMake(0, -space/2, 0, space/2)];
        [self setImageEdgeInsets:UIEdgeInsetsMake(0, space/2, 0, -space/2)];
    } else {
        [self setTitleEdgeInsets:UIEdgeInsetsMake(0, space/2, 0, -space/2)];
        [self setImageEdgeInsets:UIEdgeInsetsMake(0, -space/2, 0, space/2)];
    }
    [self _updateContentInsetWithSpace:space];
}
// 修改button 的内容内边距,防止button宽度过小导致内容左右溢出
- (void)_updateContentInsetWithSpace:(CGFloat)space
{
    CGFloat top = self.contentEdgeInsets.top;
    CGFloat bottom = self.contentEdgeInsets.bottom;
    CGFloat right = self.contentEdgeInsets.right;
    CGFloat left = self.contentEdgeInsets.left;
    if ([UIApplication sharedApplication].userInterfaceLayoutDirection == UIUserInterfaceLayoutDirectionRightToLeft) {
        //反向语言处理
        CGFloat temp = right;
        right = left;
        left = temp;
    }
    [self setContentEdgeInsets:UIEdgeInsetsMake(top, space/2 + left, bottom, space/2 + right)];
    self.hasSetPositionAndSpace = YES;
}

demo

使用方法
pod ‘LBButtonImageTitlePosition’

button设置标题,图片之后,调用该工具的设置距离的方法
如
[self.firstButton setTitle:@"你好你哈" forState:UIControlStateNormal];
[self.firstButton setImage:[UIImage imageNamed:@"account_verify_info"] forState:UIControlStateNormal];
[self.firstButton rightImgWithIntervalSpace:40];

[self.firstButton mas_makeConstraints:^(MASConstraintMaker *make) {
    make.left.mas_equalTo(10);
    make.top.mas_equalTo(100);
    make.height.mas_equalTo(50);
}];

注意: 调用rightImgWithIntervalSpace 方法一定要button设置标题,图片之后哦,因为
需要根据获取内容的大小来进行相应的设置
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值