iPhone自動布局圖像排列問題

Question

我想使用自動布局功能在iPhone和iPad上排列3張圖像。

3張圖像應保持縱橫比不變，所有3張圖像的寬度均應相同。 所有3張圖像左右兩側的空間相同。

請參閱此鏈接上的示例圖（該圖顯示了橫向和縱向模式）：

肖像： http ： //i.imgur.com/9KVXATE.png

風景： http ： //i.imgur.com/tDjj9K6.png

有可能以編程方式獲取屏幕/視圖的寬度和高度，但我想使用自動布局

編程方式：

//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));

Main_View更改其大小（寬度，高度）。 然后（ImageView1 width）是（Main_View width / 3），它也保留寬高比。

以編程方式它完美

Answer 1

使用interfacebuilder中的自動布局也很容易做到這一點。 但是，在界面生成器中使用自動布局時，您可能不得不犧牲一些事情。 您可能希望在情節提要中安排項目。 要做的步驟如下：

1. 像這樣向界面構建器添加三個視圖，

2. 選擇所有三張圖片，並使用| --- |這樣的按鈕在界面生成器中添加新約束，然后選擇相等的寬度和相等的高度。

3. 然后，再次選擇所有三個視圖，然后從菜單中選擇編輯器->對齊->上邊緣

4. 選擇最左側的視圖，並向左偏移一些，

5. 選擇最右邊的視圖，並向右偏移一些，

6. 選擇其中一個視圖，並在頂部和底部提供一些偏移。

7. 選擇第二個視圖控件，然后將其拖動到第一個視圖，然后選擇水平間距並給出一些常數，然后對第二個和第三個視圖執行相同操作。

8. 現在，約束已完成。 可能會發生，當您同時選擇多個視圖並添加一些約束時，可能未將其添加到其中一個視圖中。 因此，如果我們添加的所有約束都在那里，則可能必須解決此外觀錯誤並查看視圖的約束。

9. 您可以保留將視圖與頂部邊緣或底部邊緣分開，並為其創建出口，然后根據需要進行更改的約束，或者可以在情節提要面板中設置一些參數。

這是我的iPad模擬器中水平方向的屏幕截圖。

這是垂直方向

我希望我已經回答了你的問題。 如果您對此有疑問，請告訴我。

Answer 2

• （void）willRotateToInterfaceOrientation：（UIInterfaceOrientation）toInterfaceOrientation持續時間：（NSTimeInterval）duration {

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

  float viewWidth = [UIScreen mainScreen] .bounds.size.width; float viewHeight = [UIScreen mainScreen] .bounds.size.height;

  if（toInterfaceOrientation == UIInterfaceOrientationPortrait）{//您的縱向模式代碼在這里} else {NSLog（@“ bounds are（％f，％f）”，viewHeight，viewWidth）;

   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 

  }}