UIButton backgroundImage stretchableImageWithLeftCapWidth:topCapHeight 问题答案

【问题标题】：UIButton backgroundImage stretchableImageWithLeftCapWidth:topCapHeight issueUIButton backgroundImage stretchableImageWithLeftCapWidth:topCapHeight 问题
【发布时间】：2011-08-11 14:33:57
【问题描述】：

我有一个指定宽度为 200 的UIButton。它的autoresizingMask 属性设置为UIViewAutoresizingFlexibleWidth。 UIImage 应用于此按钮的 backgroundImage 属性。这个UIimage定义如下：

[[UIImage imageNamed:@"buttonimage.png"] stretchableImageWithLeftCapWidth:10 topCapHeight:0]

buttonimage.png 的宽度为 400 像素（按钮宽度的 2 倍，因为视网膜分辨率）并表示一个圆角矩形。在纵向模式下，一切都很好。一旦用户旋转设备并且 iPhone 进入横向模式，UIButton 就会被拉伸。由于这种行为，图像的左圆角边框保持不变（stretchableImageWithLeftCapWidth:），但右上角也会被拉伸。是否有任何我忘记设置的属性来确保只有一个指定的像素（例如第十个）被拉伸而其他任何东西都保持它的尺寸？

提前致谢！

编辑：如果我使用已在纵向模式下拉伸的较小图像，则两个边框似乎都被扩展了。

解决了！ 如果您的图像名为“myImage.png”并且是视网膜版本，则只需将其命名为“myImage@2x.png”

【问题讨论】：

您应该提供非视网膜尺寸的buttonimage.png 和视网膜尺寸名称buttonimage@2x.png 的第二个版本。也许这可以解决您的问题。
这种行为发生在非视网膜和视网膜分辨率支持的设备上。如果我理解正确的话， buttonimage@2x.png 文件是唯一被具有视网膜分辨率的设备访问的文件，所以这没有什么区别。如果我错了，请纠正我。
正确。我尝试了一个简单的例子，并且有一个有趣的效果，当我将左帽设置为像 3px 这样的少量时，它会沿着整个按钮涂抹这部分，而其余部分则正确地与右侧对齐。景观看起来一样。我的按钮图像是 50x50，当我将左帽设置为 21px 时，正好在圆角之后，即使在横向上它看起来也不错。也许一些尝试和错误会做？
我现在添加了一个非视网膜版本的按钮，突然它就起作用了。谢谢。

标签： iphone objective-c uikit uibutton uiimage

【解决方案1】：

有没有我忘记设置的属性确保只有一个指定的像素（例如第十个）被拉伸并且还有什么可以保留它的尺寸吗？

并非如此，但考虑到图像的大小，您应该重新阅读 leftCapWidth 属性。

可拉伸图像的工作方式是：您提供左帽，下一个像素被拉伸，而带有width = (total width - left cap + 1) 的图像右侧保持不变。假设您将左上限设置为 10，而原始图像为 400，则您告诉 iOS 图像的右侧不可拉伸右侧是 400-10-1=389px。同样的事情也适用于垂直方向。检查您是否在名称上没有 @2x 的普通设备上使用 @2x 图像，或者 2x 版本是否没有恰好两倍的像素，或者存在大写/小写差异。您可以通过 nslogging 加载的图像大小找到这一点。

我不知道为什么你的图片右侧被拉伸了。鉴于您有height=0，如果按钮高度发生变化，整个图像可以垂直拉伸，但这不太可能导致仅右侧变形。

【讨论】：

我现在添加了一个非视网膜版本的按钮，突然它就起作用了。你引导我走上正确的道路。

【解决方案2】：

据我所知，您的代码没有任何问题，这应该会导致图像的右侧被裁剪。下面是我使用的确切代码，我知道它可以产生您正在寻找的相同效果。

UIButton *button=[[UIButton alloc] initWithFrame:CGRectMake(0, 0, 245, 51)];
button.autoresizingMask=UIViewAutoresizingFlexibleWidth;
[button setBackgroundImage:[[UIImage imageNamed:@"userbubble.png"] stretchableImageWithLeftCapWidth:40 topCapHeight:0] forState:UIControlStateNormal];
[self.view addSubview:button];

我的猜测是问题来自您正在使用的 png，或者可能来自您项目中的“压缩 PNG 文件”设置。另外，由于您使用的图像太大，请尝试将左帽进一步向外，例如 40 或 50 像素。

【讨论】：

这是我使用的确切代码。我只是用较小的图像尝试了它，奇怪的是，两个边框都略微拉伸了。（横向和纵向模式）
尝试给自己一个更大的左上限（比如图像的 50%），如果看起来仍然很奇怪，请检查应用目标和项目设置下的压缩 PNG 文件设置。把它关掉，看看是否有什么不同。
两个选项都试过了。还是没有区别。我上传了我的按钮图像。也许你发现你的 userbubble.png 和我的图片有什么不同。（笑）
我将您的按钮添加到我的 xcode 项目中，它工作得非常好，所以问题一定来自其他地方。 UIButton *button=[[UIButton alloc] initWithFrame:CGRectMake(10, 10, 91, 86)]; [button setBackgroundImage:[[UIImage imageNamed:@"buttonImage.png"] stretchableImageWithLeftCapWidth:40 topCapHeight:0] forState:UIControlStateNormal];
您只使用了@2x 按钮吗？诡异的。正如我在上面添加的，我现在使用我的按钮的非视网膜和@2x 版本，它可以工作。我感谢你的努力。非常感谢！