美文网首页
自定义按钮-图片+文字

自定义按钮-图片+文字

作者: 某天天 | 来源:发表于2018-04-18 17:31 被阅读0次

UIButton同时设置Title和Image后,默认是图片在左文字在右,但是很多情况下我们希望图片和文字的位置多样化!

#import <UIKit/UIKit.h>

/*
 针对同时设置了Image和Title的场景时UIButton中的图片和文字的关系
 */
typedef NS_ENUM(NSInteger, ButtonImageTitleStyle ) {
    ButtonImageTitleStyleDefault = 0,       //图片在左,文字在右,整体居中。
    ButtonImageTitleStyleLeft  = 0,         //图片在左,文字在右,整体居中。
    ButtonImageTitleStyleRight     = 2,     //图片在右,文字在左,整体居中。
    ButtonImageTitleStyleTop  = 3,          //图片在上,文字在下,整体居中。
    ButtonImageTitleStyleBottom    = 4,     //图片在下,文字在上,整体居中。
    ButtonImageTitleStyleCenterTop = 5,     //图片居中,文字在上距离按钮顶部。
    ButtonImageTitleStyleCenterBottom = 6,  //图片居中,文字在下距离按钮底部。
    ButtonImageTitleStyleCenterUp = 7,      //图片居中,文字在图片上面。
    ButtonImageTitleStyleCenterDown = 8,    //图片居中,文字在图片下面。
    ButtonImageTitleStyleRightLeft = 9,     //图片在右,文字在左,距离按钮两边边距
    ButtonImageTitleStyleLeftRight = 10,    //图片在左,文字在右,距离按钮两边边距
};

@interface UIButton (Category)


/**
 *  按钮样式
 *
 *  UIButtonTitleWithImageAlignment 样式
 *  @param imgTextDistance               距离图片和标题,默认是5
 */
-(void)setButtonTitleWithImageAlignment:(ButtonImageTitleStyle)style imgTextDistance:(CGFloat)padding;
@end

//
//  UIButton+Category.m
//  DaoLanTianXia
//
//  Created by JY Mac on 16/6/7.
//  Copyright © 2016年 zjy. All rights reserved.
//

#import "UIButton+Category.h"

@implementation UIButton (Category)

-(void)setButtonTitleWithImageAlignment:(ButtonImageTitleStyle)style imgTextDistance:(CGFloat)padding;
{

    if (self.imageView.image != nil && self.titleLabel.text != nil)
    {
        //先还原
        self.titleEdgeInsets = UIEdgeInsetsZero;
        self.imageEdgeInsets = UIEdgeInsetsZero;
        
        CGRect imageRect = self.imageView.frame;
        CGRect titleRect = self.titleLabel.frame;
        
        CGFloat totalHeight = imageRect.size.height + padding + titleRect.size.height;
        CGFloat selfHeight = self.frame.size.height;
        CGFloat selfWidth = self.frame.size.width;
        
        switch (style) {
            case ButtonImageTitleStyleLeft:
                if (padding != 0)
                {
                    self.titleEdgeInsets = UIEdgeInsetsMake(0,
                                                            padding/2,
                                                            0,
                                                            -padding/2);
                    
                    self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                            -padding/2,
                                                            0,
                                                            padding/2);
                }
                break;
            case ButtonImageTitleStyleRight:
            {
                //图片在右,文字在左
                self.titleEdgeInsets = UIEdgeInsetsMake(0,
                                                        -(imageRect.size.width + padding/2),
                                                        0,
                                                        (imageRect.size.width + padding/2));
                
                self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                        (titleRect.size.width+ padding/2),
                                                        0,
                                                        -(titleRect.size.width+ padding/2));
            }
                break;
            case ButtonImageTitleStyleTop:
            {
                //图片在上,文字在下
                self.titleEdgeInsets = UIEdgeInsetsMake(((selfHeight - totalHeight)/2 + imageRect.size.height + padding - titleRect.origin.y),
                                                        (selfWidth/2 - titleRect.origin.x - titleRect.size.width /2) - (selfWidth - titleRect.size.width) / 2,
                                                        -((selfHeight - totalHeight)/2 + imageRect.size.height + padding - titleRect.origin.y),
                                                        -(selfWidth/2 - titleRect.origin.x - titleRect.size.width /2) - (selfWidth - titleRect.size.width) / 2);
                
                self.imageEdgeInsets = UIEdgeInsetsMake(((selfHeight - totalHeight)/2 - imageRect.origin.y),
                                                        (selfWidth /2 - imageRect.origin.x - imageRect.size.width / 2),
                                                        -((selfHeight - totalHeight)/2 - imageRect.origin.y),
                                                        -(selfWidth /2 - imageRect.origin.x - imageRect.size.width / 2));
                
            }
                break;
            case ButtonImageTitleStyleBottom:
            {
                //图片在下,文字在上。
                self.titleEdgeInsets = UIEdgeInsetsMake(((selfHeight - totalHeight)/2 - titleRect.origin.y),
                                                        (selfWidth/2 - titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2,
                                                        -((selfHeight - totalHeight)/2 - titleRect.origin.y),
                                                        -(selfWidth/2 - titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2);
                
                self.imageEdgeInsets = UIEdgeInsetsMake(((selfHeight - totalHeight)/2 + titleRect.size.height + padding - imageRect.origin.y),
                                                        (selfWidth /2 - imageRect.origin.x - imageRect.size.width / 2),
                                                        -((selfHeight - totalHeight)/2 + titleRect.size.height + padding - imageRect.origin.y),
                                                        -(selfWidth /2 - imageRect.origin.x - imageRect.size.width / 2));
            }
                break;
            case ButtonImageTitleStyleCenterTop:
            {
                self.titleEdgeInsets = UIEdgeInsetsMake(-(titleRect.origin.y - padding),
                                                        (selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2,
                                                        (titleRect.origin.y - padding),
                                                        -(selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2);
                
                self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                        (selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2),
                                                        0,
                                                        -(selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2));
            }
                break;
            case ButtonImageTitleStyleCenterBottom:
            {
                self.titleEdgeInsets = UIEdgeInsetsMake((selfHeight - padding - titleRect.origin.y - titleRect.size.height),
                                                        (selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2,
                                                        -(selfHeight - padding - titleRect.origin.y - titleRect.size.height),
                                                        -(selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2);
                
                self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                        (selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2),
                                                        0,
                                                        -(selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2));
            }
                break;
            case ButtonImageTitleStyleCenterUp:
            {
                self.titleEdgeInsets = UIEdgeInsetsMake(-(titleRect.origin.y + titleRect.size.height - imageRect.origin.y + padding),
                                                        (selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2,
                                                        (titleRect.origin.y + titleRect.size.height - imageRect.origin.y + padding),
                                                        -(selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2);
                
                self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                        (selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2),
                                                        0,
                                                        -(selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2));
            }
                break;
            case ButtonImageTitleStyleCenterDown:
            {
                self.titleEdgeInsets = UIEdgeInsetsMake((imageRect.origin.y + imageRect.size.height - titleRect.origin.y + padding),
                                                        (selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2,
                                                        -(imageRect.origin.y + imageRect.size.height - titleRect.origin.y + padding),
                                                        -(selfWidth / 2 -  titleRect.origin.x - titleRect.size.width / 2) - (selfWidth - titleRect.size.width) / 2);
                
                self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                        (selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2),
                                                        0,
                                                        -(selfWidth / 2 - imageRect.origin.x - imageRect.size.width / 2));
            }
                break;
            case ButtonImageTitleStyleRightLeft:
            {
                //图片在右,文字在左,距离按钮两边边距
                
                self.titleEdgeInsets = UIEdgeInsetsMake(0,
                                                        -(titleRect.origin.x - padding),
                                                        0,
                                                        (titleRect.origin.x - padding));
                
                self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                        (selfWidth - padding - imageRect.origin.x - imageRect.size.width),
                                                        0,
                                                        -(selfWidth - padding - imageRect.origin.x - imageRect.size.width));
            }
                
                break;
                
            case ButtonImageTitleStyleLeftRight:
            {
                //图片在左,文字在右,距离按钮两边边距
                
                self.titleEdgeInsets = UIEdgeInsetsMake(0,
                                                        (selfWidth - padding - titleRect.origin.x - titleRect.size.width),
                                                        0,
                                                        -(selfWidth - padding - titleRect.origin.x - titleRect.size.width));
                
                self.imageEdgeInsets = UIEdgeInsetsMake(0,
                                                        -(imageRect.origin.x - padding),
                                                        0,
                                                        (imageRect.origin.x - padding));
                
                
                
            }
                break;
            default:
                break;
        }
    }
    else {
        self.titleEdgeInsets = UIEdgeInsetsMake(0, 0, 0, 0);
        self.imageEdgeInsets = UIEdgeInsetsMake(0, 0, 0, 0);
    }
}


相关文章

  • OC下的自定义Button

    用OC实现自定义按钮的图片和文字布局 实现按钮中的文字和图片自定义布局的方法很简单,只要在按钮添加到父视图之前获取...

  • UIButton Image和title 的位置关系

    自定义按钮之:文字图片位置随意定制http://www.tuicool.com/articles/YvUJnqR

  • 自定义按钮-图片+文字

    UIButton同时设置Title和Image后,默认是图片在左文字在右,但是很多情况下我们希望图片和文字的位置多样化!

  • UIButton图片文字位置

    分类:.h中 --space 是图片与文字的间距。.m中 或者自定义,如果达不到需求(图片与文字宽度大于按钮宽度会...

  • iOS返回按钮自定义

    引子 iOS导航栏返回按钮的自定义,无非就是自定义文字和自定义图像。 自定义文字 想要返回按钮显示不同的文字,只需...

  • 知识点总结:10-自定义第三方分享按钮

    自定义第三方分享按钮(重写awakeFromNib设置文字格式,重写fayoutsubvious设置文字和图片的f...

  • 自定义按钮一

    一、自定义按钮 可实现的效果如图1.0和1.1所示 1.这是一个可以自定义按钮背景图片位置大小,可以自定义按钮图片...

  • iOS 11 下导航栏自定义按钮偏移以及侧滑时按钮图片部分消失问

    项目中一般我们会用自定义按钮(图片+文字形式)来替换系统自带的返回按钮: 该做法会导致按钮左边产生 20 距离的间...

  • 02-02、UIButton内部子控件的调整以及UIButton

    1、如何调整UIButton内部子控件(因为默认图片是在左边,文字在右边) 2、继承UIButton,自定义按钮

  • 多态

    参考博文: 多态? 多态就是父类指针指向子类对象 例如: 自定义按钮的时候想改变按钮内部的图片和文字的位置,这个时...

网友评论

      本文标题:自定义按钮-图片+文字

      本文链接:https://www.haomeiwen.com/subject/auhbkftx.html