UIButton内有两个控件titleLabel和imageView,可以用来显示一个文本和图片,这里的图片区别于背景图片。给UIButton设 置了title和image后,它们会图片在左边,文本在图片右边显示。它们两个做为一个整体依赖于button的 contentHorizontalAlignment居左居右或居中显示。

1.当button.width < image.width时,只显示被压缩后的图片,图片是按fillXY的方式压缩。

        2.当button.width > image.width,且 button.width < (image.width + text.width)时,图片正常显示,文本被压缩。

        3.当button.width > (image.width + text.width),两者并列默认居中显示,可通过button的属性contentHorizontalAlignment改变对齐方式。

4. 想两改变两个子控件的显示位置,可以分别通过setTitleEdgeInsets和setImageEdgeInsets来实现。需要注意的是,对 titleLabel和imageView设置偏移,是针对它当前的位置起作用的,并不是针对它距离button边框的距离的。我测试下来,当 button的contentHorizontalAlignment为居中时,偏移的距离和实际传的值有些偏差,没有发现规律,看不到源码也没在研究,但把button的contentHorizontalAlignment设为居左时,contentVerticalAlignment设为居上时,可以很方便的通过EdgeInsets改变两个子控件的位置。居左时,运行结果如图1.

前提:UIButton: width=220, height=100,  image: width=height=36    text width=62

想要让图片和文本上下排列,需要让image向下偏移10(距离上边间隙),然后向右偏移92( button.width - image.width / 2),计算下来为 [btn setImageEdgeInsets:UIEdgeInsetsMake(5, 92, 0, 0)],它的偏移是针对它图1时的位置,如果想向上偏移传的为负值。

下面要计算机文本偏移了,向下偏移46 (36+10 图片的高度+间隙),向右偏移44 ( (button.width - text.width) / 2  -  image.width );因为文本本身起始x方向位置是从image.width开始的,所以算偏移时,要减掉这个宽度。计算结果为[btn setTitleEdgeInsets:UIEdgeInsetsMake(46, 44, 0, 0)];

UIButton中setTitleEdgeInsets和setImageEdgeInsets的使用的更多相关文章

  1. 格而知之1:UIButton中imageView和titleLabel的位置调整

    在使用UIButton时,有时候需要调整按钮内部的imageView和titleLabel的位置和尺寸.在默认情况下,按钮内部的imageView和titleLabel的显示效果是图片在左文字在右,然 ...

  2. ios开发之--UIButton中imageView和titleLabel的位置调整

    在使用UIButton时,有时候需要调整按钮内部的imageView和titleLabel的位置和尺寸.在默认情况下,按钮内部的imageView和titleLabel的显示效果是图片在左文字在右,然 ...

  3. UIButton中的**EdgeInsets是做什么用的?

    UIButton中的**EdgeInsets是做什么用的? UIEdgeInsetsMake Creates an edge inset for a button or view.An inset i ...

  4. UIButton中的三个UIEdgeInsets属性

    接着昨天的 UIButton中的三个UIEdgeInsets属性 ,今天我们具体谈谈UIButton的contentEdgeInsets.titleEdgeInsets.imageEdgeInsets ...

  5. 设置UIButton中的文字和图片,设置UILabel的文在显示不同颜色

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

  6. iOS小知识:使UIButton中的图片和文字实现左对齐

    UIButton setImage 和 setTitle之后,默认的 image和title 对齐方式是居中, 由于 title 长度不固定,所以如果要几个这样有image有title的按钮纵向排列对 ...

  7. 关于UIButton中的ContentEdgeInsets的深入研究

    UIButton的contentEdgeInsets属性的深入研究 由于用UIButton这个属性做过一些东西,但是对它的规律始终不太了解,虽然苹果官方文档的解释大体上可以理解为,这个属性设置的是内边 ...

  8. MEMO:UIButton 中的图片和标题 左对齐

    UIButton setImage 和 setTitle之后.默认 image和title 对齐居中, 因为 title 长度不固定. 所以假设要几个这样有image有title的button纵向排列 ...

  9. UIButton 中高亮取消

    1.图片 取消高亮方法 a.第一种方法 [withdrawalBtn setAdjustsImageWhenHighlighted:NO]; b.第二种方法 [withdrawalBtn setIma ...

随机推荐

  1. 基于Material Design(转载)

    SeeNewsV2新闻Android客户端 基于Material Design http://www.codesocang.com/gn/xiangmu/33630.html 直接拿来用!十大Mate ...

  2. Request.ServerVariables

    APPL_MD_PATH-->APPL_PHYSICAL_PATH-->C:\Users\TomZhang\Desktop\GAP\后台修改\UMS\UMSSite\AUTH_TYPE-- ...

  3. 事实证明,abstract类除了不能用new实例化和类没什么区别

    abstract类是抽象类,不能够实例化,大家都知道,abstract类往往和接口interface一块儿使用,针对接口中一些公共的方法进行实现,然后实体类去继承抽象类和接口.虽然abstract类不 ...

  4. javascript面向对象之一

    问题:怎么动态设置和读取一个对象的属性?   <script type="text/javascript"> function User(property){ for( ...

  5. poj 1806 Manhattan 2025

    点击打开链接 题目大意就是给定一个最大歩数,让你输出你在三维的空间中可以到达的位置的切片,注意当歩数大于9的时候就不需要输出了! #include<stdio.h> #include< ...

  6. rpm命令

    RPM 安装.卸载.升级.查询和验证. RPM 安装 命令: rpm -i 文件名 如: rpm -i example.rpm 安装 example.rpm 包: rpm -iv example.rp ...

  7. 习课省市区的三级联动(cxselect的使用)

    1,api:http://www.jq22.com/jquery-info32382,demo:http://blog.csdn.net/luo201227/article/details/38844 ...

  8. appium + maven +jenkins 基本入门之二 新建maven 的java项目

    1: 下载maven : 1.0 :设置maven的环境变量: 1.1: 设置maven本地仓库: 在下载好的maven文件夹找到 apache-maven-3.3.9/conf 文件夹下的setti ...

  9. 阿里云 esc 云服务器无缘无故的一次/usr/bin 目录丢失导致整个服务无法启动 # ./shutdown.sh ./shutdown.sh: line 41: dirname:command not found cannot find /catalina.sh the find /catalina.sh The file is absent or does not have execute

    总结上个星期服务器环境上的一个问题,一直再忙AR.防近视的项目没时间整理.刚好忙完项目认真回顾8月30发生的一个让人奇葩的问题. 早上把项目上的一些问题优化完,快到中午吃饭的时间频繁的启动导致/usr ...

  10. jquery操作复选框(checkbox)的12个小技巧总结

    1.获取单个checkbox选中项(三种写法)$("input:checkbox:checked").val()或者$("input:[type='checkbox']: ...