iOS学习-UIButton的imageView和titleLabel

UIButton的imageView和titleLabel的位置设置通过setImageEdgeInsets和setTitleEdgeInsets来设置

参考:http://blog.csdn.net/dfqin/article/details/37813591http://blog.sina.com.cn/s/blog_5df876f301016h8h.html

 

 

实现如上图的效果其实有多种方法,像在button上嵌套label,imageView即可,下面是通过调节button自带的titleLabel和imageView来实现。

自定义一个创建button的方法,传入titleLabel的text和图片名称,图片不应该太大,width和height超过button的长宽时图片会被压缩

- (UIButton *)creatBtnWithTitle:(NSString *)title andImageName:(NSString *)image
{
    UIImage *buttonImage = [UIImage imageNamed:image];
    CGFloat buttonImageViewWidth = CGImageGetWidth(buttonImage.CGImage)
    ;
    CGFloat buttonImageViewHeight = CGImageGetHeight(buttonImage.CGImage);

    NSString *buttonTitle = title;
    
    UIFont *buttonTitleFont = [UIFont systemFontOfSize:18.0f];
  
    CGSize buttonTitleLabelSize = [buttonTitle sizeWithAttributes:@{NSFontAttributeName:buttonTitleFont}];
    // button宽度,至少为imageView宽度与titleLabel宽度之和
    
    CGFloat buttonWidth = buttonImageViewWidth + buttonTitleLabelSize.width;
    
    // button高度,至少为imageView高度与titleLabel高度之和
    
    CGFloat buttonHeight = buttonImageViewHeight + buttonTitleLabelSize.height;
    
    
    
    UIButton *tempBtn = [UIButton buttonWithType:(UIButtonTypeCustom)];
    
    [tempBtn setBounds:CGRectMake(0, 0, buttonWidth, buttonHeight)];
    
    [tempBtn.titleLabel setFont:buttonTitleFont];
    
    
    [tempBtn setImage:buttonImage forState:UIControlStateNormal];
    
    [tempBtn.imageView setBackgroundColor:[UIColor clearColor]];
    
    [tempBtn setTitle:buttonTitle forState:UIControlStateNormal];
    
    [tempBtn.titleLabel setBackgroundColor:[UIColor clearColor]];
    
    
    CGPoint buttonBoundsCenter = CGPointMake(CGRectGetMidX(tempBtn.bounds), CGRectGetMidY(tempBtn.bounds));
    
    // 找出imageView最终的center
    
    CGPoint endImageViewCenter = CGPointMake(buttonBoundsCenter.x + tempBtn.bounds.size.width/2-tempBtn.imageView.bounds.size.width/2, buttonBoundsCenter.y);
    
    // 找出titleLabel最终的center
    
    CGPoint endTitleLabelCenter = CGPointMake(buttonBoundsCenter.x-tempBtn.bounds.size.width/2 + tempBtn.titleLabel.bounds.size.width/2, buttonBoundsCenter.y);
    
    // 取得imageView最初的center
    
    CGPoint startImageViewCenter = tempBtn.imageView.center;
    
    // 取得titleLabel最初的center
    
    CGPoint startTitleLabelCenter = tempBtn.titleLabel.center;
    
    // 设置imageEdgeInsets
    
    CGFloat imageEdgeInsetsTop = endImageViewCenter.y - startImageViewCenter.y;
    
    CGFloat imageEdgeInsetsLeft = endImageViewCenter.x - startImageViewCenter.x;
    
    CGFloat imageEdgeInsetsBottom = -imageEdgeInsetsTop;
    
    CGFloat imageEdgeInsetsRight = -imageEdgeInsetsLeft;
    
    tempBtn.imageEdgeInsets = UIEdgeInsetsMake(imageEdgeInsetsTop, imageEdgeInsetsLeft, imageEdgeInsetsBottom, imageEdgeInsetsRight);
    
    // 设置titleEdgeInsets
    
    CGFloat titleEdgeInsetsTop = endTitleLabelCenter.y-startTitleLabelCenter.y;
    
    CGFloat titleEdgeInsetsLeft = endTitleLabelCenter.x - startTitleLabelCenter.x;
    
    CGFloat titleEdgeInsetsBottom = -titleEdgeInsetsTop;
    
    CGFloat titleEdgeInsetsRight = -titleEdgeInsetsLeft;
    
    tempBtn.titleEdgeInsets = UIEdgeInsetsMake(titleEdgeInsetsTop, titleEdgeInsetsLeft, titleEdgeInsetsBottom, titleEdgeInsetsRight);
    
    return tempBtn;
}

可以再实现方法中创建出一个button

UIButton *btn = [self creatBtnWithTitle:@"爱妃,请叫我朕" andImageName:@"chat_bottom_up_nor"];

    btn.layer.cornerRadius = 5;

    [btn setTitleColor:[UIColor blackColor] forState:(UIControlStateNormal)];

    [btn setTitleColor:[UIColor groupTableViewBackgroundColor] forState:(UIControlStateHighlighted)];

    btn.layer.borderWidth = 0.5;

    btn.frame = CGRectMake(50, 200, 250, 50);

    [self.view addSubview:btn];

 

posted @ 2015-01-06 14:24  Zsmile  阅读(2228)  评论(0编辑  收藏  举报

屛去雕饰,反近自然。