Why is my VC displaced after changing the Simulator? AutoLayout

问题

Hey this is the code I use to set the constraints with auto layout for my View Elements:

TimeLabel.translatesAutoresizingMaskIntoConstraints = false
               
    NSLayoutConstraint.activate([
               TimeLabel.centerXAnchor.constraint(equalTo: view.centerXAnchor),
               TimeLabel.topAnchor.constraint(equalTo: view.topAnchor, constant: -30),
               TimeLabel.widthAnchor.constraint(equalToConstant: 300),
               TimeLabel.heightAnchor.constraint(equalToConstant: 300)
    
    ])

But it doesn't work! When I change the simulator from iPhone 11 to iPhone 11 Pro, I can't see some of my elements because the whole VC is displaced!

What can I do? Thanks in advance

回答1:

Particularly because you are, as you say, "really new at this area" - I strongly suggest that you spend some time learning about Auto-layout and adapting to screen sizes.

Start with Apple's docs, and then search for tutorials... you'll find an abundance of them.

But, to maybe help you start to understand, look at these two examples (you'll want to open them in new browser tabs/windows to get a good look):

Example 1

As you can see, I've given each UI element a Height constraint, and then, starting at the top, 40-pts of vertical space constraints between each.

Looks fine on an iPhone 11, but since an 11 Pro is shorter, the Fourth Label has been pushed off the bottom of the screen.

Example 2

The layout looks very similar, expect I embedded the UI elements in a UIStackView. I then constrained the stack view Top and Bottom, and set its Distribution property to Equal Spacing.

Now, with the shorter 11 Pro, the spacing between the elements is decreased, and we can still see the Fourth Label.

---

There is a whole lot more to it than this. For example, what happens when we rotate the device? What happens when we run on a 12.9" iPad Pro?

But, maybe, hopefully, this can give you a starting point.

来源：https://stackoverflow.com/questions/64470646/why-is-my-vc-displaced-after-changing-the-simulator-autolayout