uibutton 图文上下

#if __IPHONE_OS_VERSION_MIN_REQUIRED >= 70000

#define SS_SINGLELINE_TEXTSIZE(text, font) [text length] > 0 ? [text

\ sizeWithAttributes:@{NSFontAttributeName:font}] : CGSizeZero;

#else #define SS_SINGLELINE_TEXTSIZE(text, font) [text length] > 0 ? [text sizeWithFont:font] : CGSizeZero;

#endif

@implementation UIButton (Edge)

- (void)setImagePositionWithType:(SSImagePositionType)type spacing:(CGFloat)spacing {

    CGSize imageSize = [self imageForState:UIControlStateNormal].size;

    CGSize titleSize = SS_SINGLELINE_TEXTSIZE([self titleForState:UIControlStateNormal], self.titleLabel.font);

         switch (type) {

        case SSImagePositionTypeLeft: {

            self.titleEdgeInsets = UIEdgeInsetsMake(0, spacing, 0, 0);

            self.imageEdgeInsets = UIEdgeInsetsMake(0, 0, 0, spacing);

            break;

        }

        case SSImagePositionTypeRight: {

            self.titleEdgeInsets = UIEdgeInsetsMake(0, - imageSize.width, 0, imageSize.width + spacing);

            self.imageEdgeInsets = UIEdgeInsetsMake(0, titleSize.width + spacing, 0, - titleSize.width);

            break;

        }

        case SSImagePositionTypeTop: {

            // lower the text and push it left so it appears centered

            //  below the image

            self.titleEdgeInsets = UIEdgeInsetsMake(0, - imageSize.width, - (imageSize.height + spacing), 0);

                         // raise the image and push it right so it appears centered

            //  above the text

            self.imageEdgeInsets = UIEdgeInsetsMake(- (titleSize.height + spacing), 0, 0, - titleSize.width);

            break;

        }

        case SSImagePositionTypeBottom: {

            self.titleEdgeInsets = UIEdgeInsetsMake(- (imageSize.height + spacing), - imageSize.width, 0, 0);

            self.imageEdgeInsets = UIEdgeInsetsMake(0, 0, - (titleSize.height + spacing), - titleSize.width);

            break;

        }

    }

}



在UIButton中有三个对EdgeInsets的设置:ContentEdgeInsets、titleEdgeInsets、imageEdgeInsets

@property(nonatomic)          UIEdgeInsets titleEdgeInsets;                // default is UIEdgeInsetsZero

@property(nonatomic)          UIEdgeInsets imageEdgeInsets;                // default is UIEdgeInsetsZero

UIEdgeInsetsMake

里面的四个参数表示距离上边界、左边界、下边界、右边界的距离,默认都为零,title/image在button的正中央

UIKIT_STATIC_INLINE UIEdgeInsets UIEdgeInsetsMake(CGFloat top, CGFloat left, CGFloat bottom, CGFloat right) {

    UIEdgeInsets insets = {top, left, bottom, right};

    return insets;

}

这里使用button的titleEdgeInsets和imageEdgeInsets属性,通过这两个属性一下子调整过来.先说明,edgeInsets这个属性,就是增加控件的偏移,它是怎么移动空间的呢?4个属性是上,下,左,右。要往右移动5个点,可以这样做,左偏移增加10,或者左增加5并且右减少5,这样也可以。明白了这个原理就好办了,呵呵。

下面来计算偏移量,两个控件,假设图片的尺寸大于文字的尺寸。仅用于计算,实际应用中谁大谁小都无所谓,得到的公式是通用的。

设图片的的宽度为iw,文字的宽度为tw。设button中心点为横轴的零点,那么图片右偏移中心点为delta = (iw+tw)/2-tw=0.5iw-0.5tw。图片需要右移的距离为0.5iw-delta=0.5tw。对应的insets设置为imagedgeinsets=uiinsetsmake(0,0.5tw,0,-0.5tw);文字左偏移的距离为delta+0.5tw=0.5iw-0.5tw+0.5tw=0.5iw,对应的insets设置为titleedgeinsets= uiinsetsmake(0,-0.5iw,0,+0.5iw);

这样设置完成了。

同样的道理,高度也可以设置完成。最终为imageedgeinsets = uiinsetsmake(-0.5th,0.5tw,0.5th,-0.5tw);titeledgeinsets=uiinsetmake(0.5ih,-0.5iw,-0.5ih,+0.5iw)

根据insets特点,可以替换为:image:(-th,tw,0,0);title:(ih,-iw,0,0)从Label到Image这个顺序看,修改的值分别为正,负,负,正),修改的值是前两项,分别是对方的高,宽,符号为正负负正,这就是正,负,负,正原理。

UIButton*itemButton = [UIButton buttonWithType:UIButtonTypeCustom];

[itemButton setTitleColor:COLOR_WITH_RGBString(@"666666") forState:UIControlStateNormal];

NSString*titleStr =@"title";

[itemButton setTitle:titleStr forState:UIControlStateNormal];

UIImage *btnImage = [UIImage imageNamed:@"image"];

[itemButton setImage:btnImage forState:UIControlStateNormal];

itemButton.frame=CGRectMake(0,0,KSCREENWIDTH,70);

itemButton.titleLabel.font= [UIFont systemFontOfSize:13];

CGSize titleSize = [titleStr boundingRectWithSize:CGSizeMake(KSCREENWIDTH, itemButton.titleLabel.frame.size.height) options:NSStringDrawingUsesLineFragmentOrigin | NSStringDrawingUsesFontLeading attributes:@{NSFontAttributeName:[UIFontsystemFontOfSize:13]} context:nil].size;

itemButton.imageEdgeInsets=UIEdgeInsetsMake(-titleSize.height/2+15, titleSize.width/2, titleSize.height/2, -titleSize.width/2);

itemButton.titleEdgeInsets=UIEdgeInsetsMake(btnImage.size.height/2+30, -btnImage.size.width/2, -btnImage.size.height/2, btnImage.size.width/2);

另外一种可行办法  图片在右,文字在左

[button setTitleEdgeInsets:UIEdgeInsetsMake(0, -image.size.width, 0, image.size.width)];

[button setImageEdgeInsets:UIEdgeInsetsMake(0, button.titleLabel.bounds.size.width, 0, -button.titleLabel.bounds.size.width)];

你可能感兴趣的:(uibutton 图文上下)