美文网首页iOS 开发 iOS DeveloperiOS Development
设置UIButton图片在上标题在下

设置UIButton图片在上标题在下

作者: jett_yu | 来源:发表于2016-09-27 16:37 被阅读1101次

    一个老生常谈的小设计

    就是要让UIButton图片在上面,标题在下面。

    比如:

    账号登录.png

    实现这个设计的方法很多,这里说两种。
    第一种,
    创建UIImageView,UILabel,然后设置image和title
    通过 addSubview 方法,把UIImageView和UILabel添加进UIButton。
    例如:

      UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 80, 80)];
      [self.view addSubView:button];
      UIImageView *btnImage = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 80, 50)];
      btnImage.image = [UIImage imageNamed:@"accountIcon"];
      [button addSubview:btnImage];
    
      UILabel *btnLabel = [[UILabel alloc] initWithFrame:CGRectMake(0, 50, 80, 30)];
      btnLabel.contentMode = UIViewContentModeCenter;
      btnLabel.text = @"账号登录";
      [button addSubview:btnLabel];
    

    按照UIButton的高度和宽度设置UIImageView和UILabel的frame。

    然后就是第二种。

    - (void)setButtonImageAndTitleWithSpace:(CGFloat)spacing WithButton:(UIButton *)btn{
        CGSize imageSize = btn.imageView.frame.size;
        CGSize titleSize = btn.titleLabel.frame.size;
        CGSize textSize = [btn.titleLabel.text sizeWithFont:btn.titleLabel.font];
        CGSize frameSize = CGSizeMake(ceilf(textSize.width), ceilf(textSize.height));
        if (titleSize.width + 0.5 < frameSize.width) {
            titleSize.width = frameSize.width;
        }
        CGFloat totalHeight = (imageSize.height + titleSize.height + spacing);
        btn.imageEdgeInsets = UIEdgeInsetsMake(- (totalHeight - imageSize.height), 0.0, 0.0, - titleSize.width);
        btn.titleEdgeInsets = UIEdgeInsetsMake(0, - imageSize.width, - (totalHeight - titleSize.height), 0);
    
    }
    

    传入要设置的button,根据frame设置image和label的位置。

    相关文章

      网友评论

        本文标题:设置UIButton图片在上标题在下

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