美文网首页
iOS-button标题和图片位置的摆放

iOS-button标题和图片位置的摆放

作者: coderJerry01 | 来源:发表于2017-02-07 13:44 被阅读230次

项目中我们经常会有这样的需求,button中图片左标题右,图片上标图下,图片下标题上,图片右标题左;感觉挺简单的是吧!可是在自定义的时候可能总和需求有些差距。
(相关点:
titleEdgeInsets是titleLabel相对于其上下左右的inset,跟tableView的contentInset是类似的;
如果只有title,那titleLabel的 上下左右 都是 相对于Button 的;
如果只有image,那imageView的 上下左右 都是 相对于Button 的;
如果同时有image和label,那image的 上下左 是 相对于Button 的,右 是 相对于label 的;
label的 上下右 是 相对于Button的, 左 是 相对于label 的。)
方法确实也是那样:写给button的category然后重写方法:
//设置标题的位置

  • (CGRect)titleRectForContentRect:(CGRect)contentRect{}
  • (CGRect)imageRectForContentRect:(CGRect)contentRect{}
    没错,我也是这么搞得,可是不能满足需求,所以在简书找了一下方法;(http://www.jianshu.com/p/3052a3b14a4e)mokong写的方法真的不错,亲测;解决了我一个需求问题;
    在原来的方法中加了两个参数,满足了我的需求:
    .m文件中实现方法:

define IOS_VERSION_8_OR_Above (([[[UIDevice currentDevice] systemVersion] floatValue] >= 8.0)? (YES):(NO))

const CGFloat kRcsCommonButtonAverageValue = 2.0f;

//设置item标题和icon

  • (void)setTitle:(NSString *)title
    image:(UIImage *)image
    withEdgeInsetsStyle:(XXYButtonEdgeInsetsStyle)style
    imageTitleSpace:(CGFloat)space{
    //1. 基本设置
    [self setTitle:title forState:UIControlStateNormal];
    [self setImage:image forState:UIControlStateNormal];
    // self.titleLabel.numberOfLines = 2;
    // self.titleLabel.font = [UIFont systemFontOfSize:14.f];
    [self setTitleColor:kRCSColor_BlackColor forState:UIControlStateNormal];
    //2. 得到imageview和titlelabel的宽、高
    CGFloat imageWidth = self.imageView.frame.size.width;
    CGFloat imageHeight = self.imageView.frame.size.height;

    CGFloat labelWidth = 0.0f;
    CGFloat labelHeight = 0.0f;

    if (IOS_VERSION_8_OR_Above) {
    //iOS8中titleLabel的size为0,用下面的这种设置
    labelWidth = self.titleLabel.intrinsicContentSize.width;
    labelHeight = self.titleLabel.intrinsicContentSize.height;
    }else{
    labelWidth = self.titleLabel.frame.size.width;
    labelHeight = self.titleLabel.frame.size.height;
    }
    //3. 声明全局的imageEdgeInsets和labelEdgeInsets
    UIEdgeInsets imageEdgeInsets = UIEdgeInsetsZero;
    UIEdgeInsets labelEdgeInsets = UIEdgeInsetsZero;
    //4. 根据style和space得到imageEdgeInsets和labelEdgeInsets的值
    switch (style) {
    case XXYButtonEdgeInsetsStyleTop:
    {
    imageEdgeInsets = UIEdgeInsetsMake(-labelHeight - space / kRcsCommonButtonAverageValue, 0, 0, -labelWidth);
    labelEdgeInsets = UIEdgeInsetsMake(0, -imageWidth, -imageHeight - space / kRcsCommonButtonAverageValue, 0);
    }
    break;
    case XXYButtonEdgeInsetsStyleLeft:
    {
    imageEdgeInsets = UIEdgeInsetsMake(0, -space / kRcsCommonButtonAverageValue, 0, space / kRcsCommonButtonAverageValue);
    labelEdgeInsets = UIEdgeInsetsMake(0, space / kRcsCommonButtonAverageValue, 0, -space / kRcsCommonButtonAverageValue);
    }

          break;
      case XXYButtonEdgeInsetsStyleBottom:
      {
          imageEdgeInsets = UIEdgeInsetsMake(0, 0, -labelHeight - space / kRcsCommonButtonAverageValue, -labelWidth);
          labelEdgeInsets = UIEdgeInsetsMake(-imageHeight - space / kRcsCommonButtonAverageValue, -imageWidth, 0, 0);
      }
          break;
          
      case XXYButtonEdgeInsetsStyleRight:
      {
          imageEdgeInsets = UIEdgeInsetsMake(0, labelWidth + space / kRcsCommonButtonAverageValue, 0, -labelWidth - space / kRcsCommonButtonAverageValue);
          labelEdgeInsets = UIEdgeInsetsMake(0, -imageWidth - space / kRcsCommonButtonAverageValue, 0, imageWidth + space / kRcsCommonButtonAverageValue);
      }
          break;
          
      default:
          break;
    

    }
    //5. 赋值
    self.titleEdgeInsets = labelEdgeInsets;
    self.imageEdgeInsets = imageEdgeInsets;
    }
    这篇文章确实也挺好的 http://www.cnblogs.com/Phelthas/p/4452235.html

相关文章

  • iOS-button标题和图片位置的摆放

    项目中我们经常会有这样的需求,button中图片左标题右,图片上标图下,图片下标题上,图片右标题左;感觉挺简单的是...

  • 2019-01-20

    图片的大小,摆放的位置都可以改变。 视频的大小可以改变。 问题:图片和视频放在什么地方?

  • beamer 在确定的位置摆放图片

    latex中在确定的位置放置对象,诀窍是使用图片环境,然后给对象提供坐标。可以使用LaTeX2e自带的pictur...

  • iOS Button的图标文字排版方式

    图片和标题 间距 self.titleEdgeInsets;改变标题在按钮中的位置 self.imageEdgeI...

  • swift 修改button图片和标题的位置

    可以重新构建一个继承于UIbutton的类,然后重写布局方法 import UIKit class RightIm...

  • UIButton 设置文字标题和图片的位置

    Button的标题和图片可以同时设置,谁左谁右,谁上谁下,我们自己说了算,虽然默认是图片左标题右。 如果只单独设置...

  • jquery 瀑布流

    瀑布流布局的特点: 【1】展示的图片元素都是等宽不等高,图片的位置用position:absolute定位来摆放。...

  • iOS 小常识4--按钮的图与标题位置调整二

    4:按钮的图与标题位置调整二 之前,写过利用按钮的图片,标题边缘设置属性()来控制图片与文字的位置,网上,也有很多...

  • 聚宝盆摆放位置

    1.摆放到财位 在财位这个地方摆放聚宝盆是最合适的,不管是明财位还是暗财位,本身都是财气聚集的地方,只要在这个地方...

  • 神位的摆放位置

    一般来说,家中的神位最好就是摆放在吉方,这个吉方可以是住宅点吉方,也可以是自己本命的吉方。一般来说,把神位摆放在吉...

网友评论

      本文标题:iOS-button标题和图片位置的摆放

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