简体繁体 English

Xcode 布局变化在模拟器上工作但在物理设备上消失

[英]Xcode Layout Variations Work on Simulator but Disappears on Physical Device

原文 2020-08-06 06:31:10 9 1 ios/ swift/ xcode/ uistoryboard

I used this answer ( XCode: How to change layout of views between landscape and portrait mode ) in order to create a storyboard that stacks an Image View and Table View on top of each other in portrait mode and side by side in landscape mode.我使用了这个答案（ XCode：如何在横向和纵向模式之间更改视图布局）来创建一个 storyboard，它在纵向模式下将图像视图和表格视图堆叠在一起，在横向模式下并排堆叠。 Everything works great in Xcode when I change the orientation.当我改变方向时，Xcode 一切正常。 Additionally, it works great on the simulator for an iPhone 11. However, when I install and run on my physical iPhone X, the portrait mode displays fine, but when going to landscape, the side by side display appears to fly off the screen and all I see is the navigation bar.此外，它在 iPhone 11 的模拟器上运行良好。但是，当我在物理 iPhone X 上安装并运行时，纵向模式显示正常，但在横向模式下，并排显示似乎飞离屏幕并且我看到的只是导航栏。 I've also reproduced this without the navigation bar.我也复制了这个没有导航栏。

I apologize in advance if the screenshots I'm including are insufficient to troubleshoot this issue and am happy to provide anything else.如果我包含的屏幕截图不足以解决此问题，我提前道歉，并且很乐意提供其他任何内容。

Below are the screenshots showing the varying constraints (and common ones) for each orientation.以下是显示每个方向的不同约束（和常见约束）的屏幕截图。

Steps to create were:创建步骤如下：

Add an image view to the View Controller of a new project.将图像视图添加到新项目的 View Controller。
In portrait orientation click "Vary for Traits", select both "Height" and "Width".在纵向点击“Vary for Traits”，select “Height”和“Width”。
Add leading, top, and trailing constraints and a height.添加前导、顶部和尾随约束以及高度。
Click "Done Varying"点击“完成变化”
Change orientation to landscape将方向更改为横向
In landscape orientation click "Vary for Traits", select both "Height" and "Width".在横向单击“Vary for Traits”，select “Height”和“Width”。
Add leading, top, and bottom constraints and a width.添加前导、顶部和底部约束以及宽度。
Click "Done Varying"点击“完成变化”
Works on storyboard and simulator适用于 storyboard 和模拟器
Doesn't work on physical device不适用于物理设备

1 个解决方案

So there ended up being a simple solution thanks to an article over at medium ( https://medium.com/swlh/how-to-create-adaptive-views-combining-uistackview-and-autolayout-902d5e1eab05 ).因此，最终有了一个简单的解决方案，这要归功于中等（ https://medium.com/swlh/how-to-create-adaptive-views-combining-uistackview-and-autolayout-902d5e1eab05 ）的文章。 The solution written as is did not work, but the concept of using a Stack View and adding a variation on its axis was perfect.按原样编写的解决方案不起作用，但使用堆栈视图并在其轴上添加变体的概念是完美的。 The only implementation change I had to make was to add the variation for a width of Any (not Regular) and a height of Compact.我必须做的唯一实现更改是添加任何宽度（不是常规）和紧凑高度的变化。 I'm not sure why adding width of regular to the variation wouldn't work.我不确定为什么将规则的宽度添加到变体中不起作用。 Any insight on that would be appreciated.对此的任何见解将不胜感激。