Autolayout issue with keyboard & UI element heights

限于喜欢 提交于 2019-12-11 14:59:57

问题


Swift 5, Xcode 10

The layout of my UIViewController:

I use this code to push the Server Text Field up when the keyboard is opened.

At first it pushed the bottom UIStackView into the top one, so I added the Server Stack View.top >= Username Stack View.bottom + 20 constraint and now it's keeping a proper distance.

BUT now it also automatically decreases the height of the Server Text Field when it's pushed up. Giving the Server Stack View a fixed height of 60.5 smushes the "Login" button, so I set the height of the Username Stack View to a fixed 110.5, which didn't change anything.

I tried changing the Vertical Content Compression Resistance Priority of multiple UI elements to 999 but there's always one UI element whose height is decreased.

As you can see in this screenshot, there's enough space above the keyboard:

How can I make auto layout use this space instead of "smushing" UI elements?

Edit:

I found out what this additional space is: It's the height of the "version" label and its constraint (30pts to the bottom of the screen in my case). Unfortunately I haven't been able to get rid of this yet - apart from removing the label, which still doesn't stop the "smushing".


回答1:


The additional empty space above the keyboard equals to the height of the "version" label and its constraint (30pts to the bottom of the screen in my case).

The "squishing" is somehow caused by the centerY - 120 constraint of the UIStackView and even changing the "Content Compression Resistance Priority" didn't work. Plus, if there's a surrounding UIScrollView, it complains about a missing constraint for the "y position" (even if the other constraints are set properly).

Unfortunately the only fix I've found so far that works for both problems is to remove the cause and change the layout. :/

What I ended up with:

A few things worth noting:

  • The Child View was added to always keep the "version" label at the bottom of the screen - even when the keyboard is active.
  • The Login View uses the KeyboardLayoutConstraint class for its "bottom" constraint. Without it the scrolling would be completely disabled.
  • The size of the Stack View is set through the labels and text fields inside.
  • The two extra UIStackView and UIViews (1x username, 1x server) had to be added to maintain a width of 200 for the UITextFields but still have the surrounding UIStackView and UIScrollView use leading/trailing constraints of 0pts. Without, positioning everything horizontally didn't stick, Xcode complained and the UIScrollView was pretty narrow, which also meant that it wasn't possible to scroll on the sides.
  • The "top + 100" constraint (Stack View) is visible even when the keyboard is up and the UIScrollView is scrollable. I'm aware it's not pretty but it's the only solution I've found that doesn't stick the text fields to the top of the view, since "middle - 100" doesn't work. It's probably possible to get rid of it by changing the KeyboardLayoutConstraint class.


来源:https://stackoverflow.com/questions/56833750/autolayout-issue-with-keyboard-ui-element-heights

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!