UIButton 图像在 IB 中看起来不错，但在应用程序上显示时会被拉伸

Posted 2023-03-21

【中文标题】UIButton 图像在 IB 中看起来不错，但在应用程序上显示时会被拉伸

【英文标题】：UIButton images look fine in IB but get stretched when displayed on app

【发布时间】：2013-05-14 21:01:47

【问题描述】：

我正在开发一个企业应用程序，用于跟踪公司车辆的里程和维护。我添加了图形按钮以使其更加时尚。这些按钮在 IB 中的 XIB 上看起来应该是这样，在 iPhone 上所有其他 UIView 看起来都是正确的，但在一个特定的 UIView 上，图形图像在垂直方向上被拉伸得不成比例。

下面的第一张图片显示了它的外观，底部有三个图形按钮。第二张图片显示了它在手机上的显示方式。此屏幕截图上的“帮助”按钮正常显示，但不能指望保持这种状态。

这也是不一致的。随时调用此视图可能会显示拉伸的图像，也可能根本不显示图像。它很少正常显示图像，就像下面的帮助按钮一样。

开发手机是4S，运行6.1.3。视图是为 Retina 3.5 屏幕设置的。 XCode 是最新的（不管它是什么）。

同样，只有在这一观点上才会出现问题。显示此 UIView 时，同一视图控制器上还有另一个 UIView 隐藏。另一个视图上的按钮图形看起来不错。所有其他视图和视图控制器在 UIButton 上使用相同的图形，没有任何问题。

【问题讨论】：

我不认为你正在为这个应用程序使用自动布局？

你在使用自动布局吗？如果是这样，您可能需要检查这些按钮的约束以确保它们是正确的。

请发布一些用于按钮的代码，我认为您正在使用约束。

我找到了可以取消选择 Autolayout 的位置，并且它恢复了正常。我不明白它是怎么做到的，特别是因为它没有在任何其他视图控制器上启用。但我想我点击了一些在我无知的情况下不应该点击的东西。

谁能向这位年迈的嬉皮士解释为什么这样做？

【参考方案1】：

在 Interface Builder (Xcode) 中，您使用 4.5 英寸的屏幕高度创建了视图。

但您看到问题的设备是 5 英寸屏幕。所以视图会调整大小以适应。

当它这样做时，Interface Builder 对这些子视图施加的自动布局约束会接管以确定它们的作用。。这些限制正在导致高度发生变化。

【讨论】：

另见***.com/questions/16552118/… 这个问题特别让你没有意识到窗口中最后一行的内容，Xcode 会为此自动生成一组非常特殊的自动布局约束。

【参考方案2】：

无需关闭自动布局。自动布局可能非常有用，但它似乎喜欢在重新定位 UIButtons 后将约束 "Align Baseline to:" 随机分配给它们。

只需在 Storyboard 中选择有问题的 UIButton/UIImageView，找到约束“Align Baseline to:”，点击齿轮图标并选择“Promote to User Constraint” ，然后再次点按并选择“删除”。这应该可以解决您的问题。

【参考方案3】：

针对这里的 cmets，我将回答我自己的问题：我为这个视图控制器关闭了 Autolayout，这解决了所有问题。这是自 XCode 开始为 iPhone 5 开发以来我编写的第一个应用程序，所以我不知道 Autolayout 功能。我需要了解它是如何工作的以及它为什么会这样做。

感谢您的帮助！