为iPhone和iPad设计的静态表格单元格 [英] Layout static table cell for iPhone and iPad

问题描述

我是相当新到iOS开发和很新的故事板。我试图创建一个使用静态细胞一个UITableView和分组的风格基本形式。

I'm fairly new to iOS dev and very new to storyboards. I'm trying to create a basic form using a UITableView with static cells and a "grouped" style.

我希望做只有一个故事板，并使用它为iPhone和iPad，不知道这建议，但我真的没有和设计元素特定于任一设备所以会出现很多重复的，如果我保持一个单独的故事板两种器件系列。

I'm hoping to make only one storyboard and use it for both iPhone and iPad, not sure if this is recommended but I don't really have and design elements that are specific to either device so there'd be a lot of repetition if I maintain a separate storyboard for both device families.

于是我将一个标签到我的表格单元格的左侧和文本输入到右侧然后使用自动布局和设置一些约束：
- 标签拥有领先的空间的30上海华
- 文本字段有尾随空间的30上海华
- 标签和文本框之间的水平间距约束
- 标签上的固定宽度的限制

So I drag a label onto the left hand side of my table cell and a text input onto the right then I use auto-layout and setup some constraints: - Label has a leading space to superview of 30 - TextField has a trailing space to superview of 30 - Horizontal spacing constraint between the label and textfield - Fixed width constraint on label

它在iPhone上的伟大工程，但在iPad上的标签和文本框超出表格单元格的边缘。这是因为iPad拥有更宽边距的表格单元的左侧和右侧（比以前的30pt约束更宽）。

It works great on iPhone however on iPad the label and textfield extend beyond the edges of the table cell. This is because iPad has wider margins (wider than the 30pt constraints I used) on the left and right side of the table cells.

这是显而易见的，为什么它不工作。我想我的问题是，这是一个常见的​​场景，我怀疑有一个简单的解决方案。有兴趣听听建议。是有办法来约束标签和文本框的细胞，而不是表的边缘的边缘？如果我不应该：

It's obvious why it doesn't work. I guess my question is, that this is a common scenario and I suspect there's a simple solution. Interested to hear recommendations. Is there a way to constrain the label and textfield to the edges of the cell rather than the edges of the table? If not should I:

1. 复制iPhone和iPad
故事板

2. 使用表单库像QuickDialog


3. 添加并排列标签和文本框编程


4. 任何其他建议？

下面是显示了自动布局约束的截图：

Here's a screenshot showing the auto-layout constraints:

这是布局在iPad上的行为方式：

And this is how the layout behaves on iPad:

推荐答案

我有同样的问题。我通过为每个水平约束创建网点，然后根据当前设备是否是iPad或iPhone编程方式更改的不断解决它了很长的路。

I have the same problem. I solved it the long way by creating outlets for each horizontal constraint and then programmatically changing the constant depending if the current device is an iPad or iPhone.

头文件：

@property (weak, nonatomic) IBOutlet NSLayoutConstraint *myLabelHorizontalConstraint;

在viewDidLoad中子程序方法文件：

method file in the viewDidLoad subroutine:

if ([[UIDevice currentDevice] userInterfaceIdiom] == UIUserInterfaceIdiomPad) {
        myLabelHorizontalConstraint.constant = 60;
} else myLabelHorizontalConstraint.constant = 30;

您可以省略，如果在你的故事板场景布置的限制设置为30，它在我的情况是iPhone设置别人的一部分。我只是把它上面以显示一个完整的示例。

You can leave out the 'else' part if the constraint in your storyboard scene layout is set to 30 which in my case is the iPhone setting. I just put it in above in order to show a complete example.

我希望有一个更普遍的解决方案，如在故事板某处设置或单个resize命令。这似乎超过iPhone 30分左右iPad的静态电池组的布局缩进但在自动布局不补偿。也许我失去了一些东西的地方。

I wish there was a more universal solution such as a setting in Storyboard somewhere or a single resize command. It seems the iPad static cell group layout indents about 30 points more than iPhone but doesn't compensate for this in autolayout. Maybe I am missing something somewhere.

这篇关于为iPhone和iPad设计的静态表格单元格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！