UIButton 的 backgroundImage 和 image 的填充模式

UIButton 的 backgroundImage 和 image 的填充模式UIButton的backgroundImage和image的填充模式原创  2016年09月01日15:35:04标签:uibutton /contentMod3196UIButton的backgroundImage和image的填充模式在将UIButton当做图标按钮使用时,可以有两种方式给它设置

UIButton 的 backgroundImage 和 image 的填充模式

原创  
2016年09月01日 15:35:04

UIButton 的 backgroundImage 和 image 的填充模式

在将 UIButton 当做图标按钮使用时,可以有两种方式给它设置一张图片:setBackgroundImage:forState: 和 setImage:forState:。用这两种方式都可以把 UIButton 作为图片按钮使用,这在图片背景的比例和UIButton 的宽高比例相同时是没什么问题的,图片都不会因为被拉伸或者缩放而出现失真。但是当图片的比例和 Button 的尺寸比例不一样时,这两种方式设置图片的效果就不一样了,拿下图的例子来说: 
UIButton 的 backgroundImage 和 image 的填充模式 
图中 viewController 里 两个 UIButton 的大小都是 100×200,第一个是通过 setImage:forState设置图片,第二个是通过setBackgroundImage:forState:设置图片,这张图片的尺寸是 300×428,也就是 Button 和图片的比例不一致。 
UIButton 的 backgroundImage 和 image 的填充模式 
这时我们不做任何设置,直接运行的话,两个Button的图片都会被拉伸: 
UIButton 的 backgroundImage 和 image 的填充模式

这样的效果肯定不是我们想要的,对于setImage:forState:设置的图片可以给 UIButton 的 imageView设置对应的填充属性来解决缩放问题,注意不是直接设置 UIButton 的 contentModesetImage:forState: 会将 image 设置到 UIButton 中的 ImageView 图层,直接设置 UIButton 的 contentMode 是不起作用的。对于用 setBackgroundImage:forState: 方式设置的图片,无论怎么设置都不会有效果,这种方式会直接将图片拉伸至 Button 的边界,来填充满整个 Button。所以如果 图片和 Button的比例不一致时,只能使用 setImage:forState: 这种方式来保证图片不被压缩。 
但是,当 Button 的大小超过了图片的原始大小,并且比例也不一样时,这时候 Button 四周就可能会出现图片覆盖不上的空白,例如,现在将上面图中 第一个 Button 的宽度拉大,为了看出效果,这里还为 Button 设置了一个背景颜色: 
UIButton 的 backgroundImage 和 image 的填充模式

并且在 viewDidLoad 里加上这一句代码设置图片的填充模式 button1.imageView?.contentMode = .ScaleAspectFill,再运行看一下效果: 
UIButton 的 backgroundImage 和 image 的填充模式

可以发现,设置 button1.imageView?.contentMode = .ScaleAspectFill 的确会让图片不再变形,但是也只是按图片的原始尺寸显示了,两边的留白也是很不美观的。当然,这也是有解决办法的,UIControl 里提供了两个属性:contentHorizontalAlignment 和 contentVerticalAlignment 分别用来设置水平和竖直方向上内容的对齐方式,把 button1 的 contentHorizontalAlignment 设置为 Fill 就可以解决上面的问题,如果是竖直方向无法填满的话,设置 contentVerticalAlignment 就行了,最后来看一下最终的效果: 
UIButton 的 backgroundImage 和 image 的填充模式

/

UIButton 设置图片显示 contentmode

原创  
2015年11月17日 11:22:31

UIButton 设置图片显示contentmode

只设置contentmode是没有效果的


UIButton *button;

 button.contentEdgeInsets = UIEdgeInsetsMake(0000);

[[button imageViewsetContentMode:UIViewContentModeScaleAspectFill];


 button.contentHorizontalAlignmentUIControlContentHorizontalAlignmentFill;//水平方向拉伸

 button.contentVerticalAlignment = UIControlContentVerticalAlignmentFill;//垂直方向拉伸


今天的文章UIButton 的 backgroundImage 和 image 的填充模式分享到此就结束了,感谢您的阅读,如果确实帮到您,您可以动动手指转发给其他人。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
如需转载请保留出处:https://bianchenghao.cn/30119.html

(0)
编程小号编程小号

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用*标注