Ios iPhone自动布局图像排列问题

我想用自动布局在iPhone和iPad上排列3张图片

3幅图像应保留纵横比，且所有3幅图像的宽度应相同。 所有3幅图像的左右两侧空间相同

请参阅此链接上的示例图（图显示横向和纵向模式）：

肖像：

景观：

可以通过编程获得屏幕/视图的宽度和高度，但我想使用自动布局

在程序上：

//Inside this method
//- (void) didRotateFromInterfaceOrientation:
(UIInterfaceOrientation)fromInterfaceOrientation

//Main_View is the view in which the 3 images are kept
//ImageView1, ImageView2, ImageView3 are 3 image views

ImageView1.frame = CGRectMake(Main_View.frame.origin.x + 3, Main_View.frame.origin.y + 30, ((Main_View.frame.size.width / 3)-4), ((Main_View.frame.size.width / 3) - 4) * (82.0/75.0));


ImageView2.frame = CGRectMake(ImageView1.frame.size.width + 6, Main_View.frame.origin.y + 30, ((Main_View.frame.size.width / 3)-4), ((Main_View.frame.size.width / 3) - 4) * (82.0/75.0));


ImageView3.frame = CGRectMake(ImageView2.frame.size.width + ImageView1.frame.size.width + 9, Main_View.frame.origin.y + 30, ((Main_View.frame.size.width / 3)-4), ((Main_View.frame.size.width / 3) - 4) * (82.0/75.0));

主视图更改其大小（宽度、高度）。然后（ImageView1 width）是（Main_View width/3），它也保留了纵横比

从程序上讲，它工作得非常完美

• （无效）将旋转到接口方向：（UIInterfaceOrientation）到接口方向持续时间：（NSTimeInterval）持续时间{
  float viewWidth=[UIScreen mainScreen].bounds.size.width； 浮动视图高度=[UIScreen Main Screen].bounds.size.height
  if（toInterfaceOrientation==UIInterfaceOrientationGraphital）{ //你的肖像模式代码在这里 } 否则{ NSLog（@“边界为（%f，%f）”、视图高度、视图宽度）
  } }

---

在interfacebuilder中使用自动布局也很容易做到这一点。但是，在interface builder中使用autolayout时，可能需要牺牲的东西很少。您可能希望在序列图像板中排列项目。操作步骤如下所示：
• 向interface builder添加三个视图，如下所示
• 选择所有三张图片，并在interface builder中使用类似于|--|的按钮添加新约束，然后选择等宽和等高
• 然后，再次选择所有三个视图，然后从菜单中选择编辑器->对齐->顶边
• 选择最左边的视图并使其向左偏移
• 选择最右边的视图并向右偏移
• 选择一个视图，并在顶部和底部提供一些偏移
• 选择第二个视图控件并将其拖动到第一个视图，然后选择水平分隔，并给出一些常量值，然后对第二个和第三个视图执行相同的操作

• 现在，约束已完成。当您同时选择多个视图并添加一些约束时，可能会出现这样的情况，即该约束可能未添加到其中一个视图中。因此，如果我们添加的所有约束都存在，则可能必须解决此外观错误并查看视图的约束

• 您可以保留将视图与上页边距或下页边距分开的约束，并为其创建出口，然后根据需要进行更改，或者您可以在故事板本身中设置一些参数

这是我的ipad模拟器的水平方向截图
这是垂直方向

---

我希望我已经回答了你的问题。如果您对此有任何疑问，请务必告诉我。
您有什么问题吗？你现在做得怎么样？什么不起作用？感谢jrturton的重播让我进一步澄清答案1：我想使用情节提要自动布局约束（意味着在情节提要上使用自动布局来排列这些图像）。答2：当屏幕旋转时，它也将管理相同的间距，并调整设备屏幕的高度和宽度。答3：当我对这些图片施加限制时，它的高度和宽度不会根据设备进行调整。感谢Nitesh Borad的重播，但这是我两周前已经完成的图像的程序安排。我想知道这个布局是否可以在有约束的故事板上实现（自动布局）？您好，非常感谢您的逐步指导，它工作得很好，但现在的问题是，在这种情况下，当横向模式时，图像会拉伸。我更新了我的问题相关图片肖像：风景：我觉得很好。图像有什么问题。尝试正确地使用contentMode以适当地匹配内容。我已经按照您的步骤执行了很多次，每次都只会遇到一个问题，即三视图按需要正确排列，但三视图的高度或宽度不会随着横向模式中宽度的增加而增加。所以图像看起来像是在拉伸。是他们的任何其他约束，我需要的高度以外的同等高度。

// i assume here that you have three imageviews img1, img2, img3

img1.width = viewHeight/3; //i used "viewHeight" because of landscape mode
img2.width = viewHeight/3;
img3.width = viewHeight/3;
    // and then set centre of imageview according to your requirement