通用 iOS 应用程序 - UIButton 和 UITableView 大小

Posted 2023-03-15

【中文标题】通用 iOS 应用程序 - UIButton 和 UITableView 大小

【英文标题】：Universal iOS app - UIButton and UITableView sizes

【发布时间】：2013-12-18 23:24:49

【问题描述】：

我正在使用 XCode 5.0.2 和 ios 7 开发我的第一个通用 iOS 应用程序，我对 iPhone 和 iPad（包括 Mini）之间的屏幕尺寸差异有一些疑问。

如果应用程序包含带有自定义.png 图像的UIButtons，在为iPad 开发时是否需要增加UIButtons 的大小以及更大尺寸的图像？我已经完成了 iPhone 应用程序的一半，而不是使用故事板，而是使用 IB 来创建 NIB。我尝试在 iPad NIB 上使用相同的 iPhone UIButton 尺寸，它看起来很小。这是为这两种不同设备设置更大尺寸的UIButtons 以及自定义尺寸的 png 图像文件的正确方法吗？

同样的问题也出现在 UITableViews 上。我需要在 iPad 上有更大的吗？ iPhone 在 iPad 上看起来更小。另外，请注意，我添加了一个新的 iPad 特定 NIB，但将相同的 UITableView 控件从 iPhone 特定 NIB 复制到了 iPad NIB。

我还在 AppCoda 上阅读了this article，当我使用 XCode 5 打开示例项目时使用了自定义按钮大小。

Another article 来自 Ray Wenderlich 的网站（虽然 3 岁）谈论自动调整大小。

哪种方法最好？有什么我需要知道的吗？

【参考方案1】：

1.关于布局：

Autoresizing Masks 和 Layout Constraints（又名Auto Layout）都解决了“鉴于这种不同的视图大小会发生什么？”的问题。与您创建的 nib 相比（即，如果视图的方向发生变化或在不同的屏幕尺寸上运行）。

您应该在每个用户界面组件（UIButton、UITableView 等）上设置Autoresizing Masks 或Layout Constraints，以告诉他们应该如何调整它们的大小。

如果您只是针对 iOS 6.0+，您可以使用Layout Constraints（最新的、推荐的调整大小的方法）。但是，如果您对Autoresizing Masks 更满意，您仍然可以根据需要使用它们（您只需关闭笔尖上的Auto Layout 即可这样做）。

这是来自 Ray Wenderlich 网站的 good article，用于对 Auto Layout 的介绍。

2。关于背景图片：

正如您所提到的，您使用 .png 图像作为按钮背景，您应该确保包含的图像适用于您的 UIButtons 的所有可能尺寸（包括retina 和 non-retina 图片）。

理想情况下，您将背景图片设计为可以拉伸并使用UIImage 的方法resizableImageWithCapInsets:resizingMode: 为背景图片创建UIImage。

这里有一个 tutorial on designing iOS button backgrounds，应该也会有帮助。

查看UIImage（Google it-> Apple 的链接更改太频繁）和resizableImageWithCapInsets:resizingMode: 方法的文档可能也会使您受益。

【讨论】：

我查看了这些文章，这些文章都很棒。在我的情况下，我的应用程序将仅在 iPhone/iPod 和 iPad 变体上处于纵向模式。我还查看了有关自动布局功能的视频 (nsscreencast.com/episodes/87-xcode-5-autolayout-improvements)。它再次显示具有 3.5 和 4 英寸 iPhone 屏幕的纵向/横向模式，但在 iPad 上没有。我的基本问题是，如果我有一个尺寸针对 iPhone/iPod 的 UIButton，它在 3.5 英寸和 4 英寸屏幕上的尺寸应该是多少，iPad 也是如此，因为它有更大的屏幕。自动布局在这里有帮助吗？谢谢。

【参考方案2】：

对于按钮的图像，您将需要视网膜和非视网膜的不同尺寸。如果您决定在 iPad 上需要更大的按钮，那么您当然需要更大的图像。对于 UITableViews，它取决于你想用它们做什么。如果您希望 UITableViews 填满整个屏幕，那么它会更大（尽管自动布局或布局约束可以为您处理）。