[UIImage resizableImageWithCapInsets:]使用注意

简介:

转自:http://www.cnblogs.com/scorpiozj/p/3302270.html

最近在sae上搭建了个wp,因为深感自己前端的东西缺乏,所以想依次为契机,学习一下。本文是从个人的sae版wp转载过来。

原文见此

 

本篇也是在实现微博过程中遇到的问题。原先以为很简单的东西,到了实际做的时候,才发现这里出错那里不对。浪费很多时间,究根结底,还是没有弄清楚文档。

在iOS5, UIImage添加了可以拉伸图片的函数,即:

[UIImage resizableImageWithCapInsets:]

它带参数: UIEdgeInsets,这是一结构体,包含 上/左/下/右四个参数。函数的作用我们看下文档:

Creates and returns a new image object with the specified cap insets.

Discussion

You use this method to add cap insets to an image or to change the existing cap insets of an image. In both cases, you get back a new image and the original image remains untouched.

During scaling or resizing of the image, areas covered by a cap are not scaled or resized. Instead, the pixel area not covered by the cap in each direction is tiled, left-to-right and top-to-bottom, to resize the image. This technique is often used to create variable-width buttons, which retain the same rounded corners but whose center region grows or shrinks as needed. For best performance, use a tiled area that is a 1×1 pixel area in size.

上左下右4参数定义了cap inset,就是离四条边的距离。拉升时,cap到边的部分不会被拉升,其余部分则会被拉升。尤其需要注意的时,拉升的时候,是从左到右,从上到下的方向。通俗点说,拉升不是全方向的拉升,而是垂直和水平拉升的叠加。

以我遇到的问题为例,我的图片是170×50, 需要填充到240×140,但是四周的圆角以及小箭头保持原样,如图:

popover_background_left

 

开始我设置参数{20,10,10,10},在图上的位置大致:

imageWrong

 

这样拉升的结果:

屏幕快照 2013-09-04 10.31.48 PM

 

很奇怪是不是,为什么出现了两个箭头(红色部分是设置的背景色用语区分)?再回头看下文档,才恍然大悟:

  1. 拉升的时候,是按前文说的两个方向来拉升
  2. 拉升的部分,是以tiled方式,简单的说就是以镜像的方式

按照1的规则,拉升的时候,水平和垂直方向都需要拉升。这样在水平拉升的时候,箭头其实处于拉升的部分。而拉升的时候,先按照原有的尺寸添加进去,不足的地方再把中间不拉升的部分填充进去,周而复始,直到填充完毕。因此,就有上面的现象了。

要达到需要的效果,必须按照如下的设置:

imageRight

 

于是得到了我们需要的效果:

屏幕快照 2013-09-04 10.39.10 PM

 

Binggo~ 一切完毕。

 

说实话,这个函数在iOS5 beta的时候就知道了,可是一直是不正确的理解。直到今天需要用到的时候,才发现一直没理解对。于此同时,也发现自己 局限在工作相关的部分,工作以外的东西不是光知道就可以,还是需要去实践的。否则,就会遇到今天的情形,被个小问题,折磨了好久。




本文转自夏雪冬日博客园博客,原文链接:http://www.cnblogs.com/heyonggang/p/3482733.html,如需转载请自行联系原作者

目录
相关文章
|
开发者 iOS开发
【教程】无法验证 app 需要互联网连接以验证是否信任开发者
【教程】无法验证 app 需要互联网连接以验证是否信任开发者
|
存储
访问沙盒外文档UIDocumentPickerViewController
官方文档解析 官方文档:https://developer.apple.com/documentation/uikit/uidocumentpickerviewcontroller?language=objc UIDocumentPickerViewController有四种模式: Import an external document:用户选择一个外部文档,文档选择器拷贝该文档到应用沙盒,不会修改源文档。
5426 0
|
5天前
|
搜索推荐 编译器 Linux
一个可用于企业开发及通用跨平台的Makefile文件
一款适用于企业级开发的通用跨平台Makefile,支持C/C++混合编译、多目标输出(可执行文件、静态/动态库)、Release/Debug版本管理。配置简洁,仅需修改带`MF_CONFIGURE_`前缀的变量,支持脚本化配置与子Makefile管理,具备完善日志、错误提示和跨平台兼容性,附详细文档与示例,便于学习与集成。
305 116
|
20天前
|
域名解析 人工智能
【实操攻略】手把手教学,免费领取.CN域名
即日起至2025年12月31日,购买万小智AI建站或云·企业官网,每单可免费领1个.CN域名首年!跟我了解领取攻略吧~
|
7天前
|
数据采集 人工智能 自然语言处理
Meta SAM3开源:让图像分割,听懂你的话
Meta发布并开源SAM 3,首个支持文本或视觉提示的统一图像视频分割模型,可精准分割“红色条纹伞”等开放词汇概念,覆盖400万独特概念,性能达人类水平75%–80%,推动视觉分割新突破。
504 45
Meta SAM3开源:让图像分割,听懂你的话
|
14天前
|
安全 Java Android开发
深度解析 Android 崩溃捕获原理及从崩溃到归因的闭环实践
崩溃堆栈全是 a.b.c?Native 错误查不到行号?本文详解 Android 崩溃采集全链路原理,教你如何把“天书”变“说明书”。RUM SDK 已支持一键接入。
695 222
|
2天前
|
Windows
dll错误修复 ,可指定下载dll,regsvr32等
dll错误修复 ,可指定下载dll,regsvr32等
135 95