键盘弹出时WKWebView的约束问题

Question

键盘弹出时WKWebView的约束问题

21

当在WKWebView中输入框获取焦点时，会出现一个约束错误。 代码：

class ViewController: UIViewController {
    override func viewDidLoad() {
        super.viewDidLoad();
        let wv = WKWebView(frame: CGRect(x: 100, y: 100, width: 100, height: 100));
        wv.loadHTMLString("<input type='text'/>", baseURL: nil); // it also can be select, it makes no difference
        view.addSubview(wv);
    }
}

错误日志：

2017-11-05 00:26:28.861439+0700 achievator[20048:75393577] [LayoutConstraints] Unable to simultaneously satisfy constraints.    Probably at least one of the constraints in the following list is one you don't want.   Try this:       (1) look at each constraint and try to figure out which you don't expect;       (2) find the code that added the unwanted constraint or constraints and fix it.     (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)  (
    "<NSAutoresizingMaskLayoutConstraint:0x60c0000955e0 h=-&- v=-&- UIToolbar:0x7f8540419570.width ==
_UIInputViewContent:0x7f8540411830.width   (active)>",
    "<NSAutoresizingMaskLayoutConstraint:0x60c000095720 h=--& v=--& _UIInputViewContent:0x7f8540411830.width == 0   (active)>",
    "<NSLayoutConstraint:0x60800009a9a0 H:|-(0)-[_UIButtonBarStackView:0x7f854041b2d0]   (active, names: '|':_UIToolbarContentView:0x7f8540402de0 )>",
    "<NSLayoutConstraint:0x60800009a9f0 _UIButtonBarStackView:0x7f854041b2d0.trailing == _UIToolbarContentView:0x7f8540402de0.trailing + 8   (active)>",
    "<NSLayoutConstraint:0x608000099a00 _UIToolbarContentView:0x7f8540402de0.trailing == UIToolbar:0x7f8540419570.trailing   (active)>",
    "<NSLayoutConstraint:0x608000099aa0 H:|-(0)-[_UIToolbarContentView:0x7f8540402de0]   (active, names: '|':UIToolbar:0x7f8540419570 )>",
    "<NSLayoutConstraint:0x6040000981a0 H:|-(0)-[_UIModernBarButton:0x7f854050ef70]   (active, names: '|':_UIButtonBarButton:0x7f854050e7f0 )>",
    "<NSLayoutConstraint:0x6040000981f0 H:[_UIModernBarButton:0x7f854050ef70]-(>=8)-|   (active, names: '|':_UIButtonBarButton:0x7f854050e7f0 )>",
    "<NSLayoutConstraint:0x6040000999b0 H:|-(8)-[_UIModernBarButton:0x7f8540512450'Done']   (active, names: '|':_UIButtonBarButton:0x7f8540511660 )>",
    "<NSLayoutConstraint:0x604000099a00 H:[_UIModernBarButton:0x7f8540512450'Done']-(0)-|   (active, names: '|':_UIButtonBarButton:0x7f8540511660 )>",
    "<NSLayoutConstraint:0x60c000094690 'UISV-canvas-connection' UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide'.leading ==
_UIButtonBarButton:0x7f854050e7f0.leading   (active)>",
    "<NSLayoutConstraint:0x60c0000946e0 'UISV-canvas-connection' UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide'.trailing ==
_UIButtonBarButton:0x7f8540511660.trailing   (active)>",
    "<NSLayoutConstraint:0x60c000094780 'UISV-spacing' H:[_UIButtonBarButton:0x7f854050e7f0]-(0)-[UIView:0x7f854050f4c0]   (active)>",
    "<NSLayoutConstraint:0x60c000094960 'UISV-spacing' H:[UIView:0x7f854050f4c0]-(0)-[_UIButtonBarButton:0x7f854050ea30]   (active)>",
    "<NSLayoutConstraint:0x60c000094a00 'UISV-spacing' H:[_UIButtonBarButton:0x7f854050ea30]-(0)-[UIView:0x7f8540511480]   (active)>",
    "<NSLayoutConstraint:0x60c000094a50 'UISV-spacing' H:[UIView:0x7f8540511480]-(0)-[_UIButtonBarButton:0x7f8540511660]   (active)>",
    "<NSLayoutConstraint:0x60800009a6d0 'UIView-leftMargin-guide-constraint' H:|-(0)-[UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide'](LTR)  (active, names: '|':_UIButtonBarStackView:0x7f854041b2d0 )>",
    "<NSLayoutConstraint:0x60800009a770 'UIView-rightMargin-guide-constraint' H:[UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide']-(0)-|(LTR)  (active, names: '|':_UIButtonBarStackView:0x7f854041b2d0 )>" )

Will attempt to recover by breaking constraint  <NSLayoutConstraint:0x6040000981f0 H:[_UIModernBarButton:0x7f854050ef70]-(>=8)-|   (active, names: '|':_UIButtonBarButton:0x7f854050e7f0 )>

Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger. The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKit/UIView.h> may also be helpful. 2017-11-05 00:26:28.863156+0700 achievator[20048:75393577] [LayoutConstraints] Unable to simultaneously satisfy constraints.     Probably at least one of the constraints in the following list is one you don't want.   Try this:       (1) look at each constraint and try to figure out which you don't expect;       (2) find the code that added the unwanted constraint or constraints and fix it.     (Note: If you're seeing NSAutoresizingMaskLayoutConstraints that you don't understand, refer to the documentation for the UIView property translatesAutoresizingMaskIntoConstraints)  (
    "<NSAutoresizingMaskLayoutConstraint:0x60c0000955e0 h=-&- v=-&- UIToolbar:0x7f8540419570.width ==
_UIInputViewContent:0x7f8540411830.width   (active)>",
    "<NSAutoresizingMaskLayoutConstraint:0x60c000095720 h=--& v=--& _UIInputViewContent:0x7f8540411830.width == 0   (active)>",
    "<NSLayoutConstraint:0x60800009a9a0 H:|-(0)-[_UIButtonBarStackView:0x7f854041b2d0]   (active, names: '|':_UIToolbarContentView:0x7f8540402de0 )>",
    "<NSLayoutConstraint:0x60800009a9f0 _UIButtonBarStackView:0x7f854041b2d0.trailing == _UIToolbarContentView:0x7f8540402de0.trailing + 8   (active)>",
    "<NSLayoutConstraint:0x608000099a00 _UIToolbarContentView:0x7f8540402de0.trailing == UIToolbar:0x7f8540419570.trailing   (active)>",
    "<NSLayoutConstraint:0x608000099aa0 H:|-(0)-[_UIToolbarContentView:0x7f8540402de0]   (active, names: '|':UIToolbar:0x7f8540419570 )>",
    "<NSLayoutConstraint:0x604000098560 H:|-(>=5)-[_UIModernBarButton:0x7f8540510b40]   (active, names: '|':_UIButtonBarButton:0x7f854050ea30 )>",
    "<NSLayoutConstraint:0x604000098650 H:[_UIModernBarButton:0x7f8540510b40]-(>=5)-|   (active, names: '|':_UIButtonBarButton:0x7f854050ea30 )>",
    "<NSLayoutConstraint:0x6040000999b0 H:|-(8)-[_UIModernBarButton:0x7f8540512450'Done']   (active, names: '|':_UIButtonBarButton:0x7f8540511660 )>",
    "<NSLayoutConstraint:0x604000099a00 H:[_UIModernBarButton:0x7f8540512450'Done']-(0)-|   (active, names: '|':_UIButtonBarButton:0x7f8540511660 )>",
    "<NSLayoutConstraint:0x60c000094690 'UISV-canvas-connection' UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide'.leading ==
_UIButtonBarButton:0x7f854050e7f0.leading   (active)>",
    "<NSLayoutConstraint:0x60c0000946e0 'UISV-canvas-connection' UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide'.trailing ==
_UIButtonBarButton:0x7f8540511660.trailing   (active)>",
    "<NSLayoutConstraint:0x60c000094780 'UISV-spacing' H:[_UIButtonBarButton:0x7f854050e7f0]-(0)-[UIView:0x7f854050f4c0]   (active)>",
    "<NSLayoutConstraint:0x60c000094960 'UISV-spacing' H:[UIView:0x7f854050f4c0]-(0)-[_UIButtonBarButton:0x7f854050ea30]   (active)>",
    "<NSLayoutConstraint:0x60c000094a00 'UISV-spacing' H:[_UIButtonBarButton:0x7f854050ea30]-(0)-[UIView:0x7f8540511480]   (active)>",
    "<NSLayoutConstraint:0x60c000094a50 'UISV-spacing' H:[UIView:0x7f8540511480]-(0)-[_UIButtonBarButton:0x7f8540511660]   (active)>",
    "<NSLayoutConstraint:0x60800009a6d0 'UIView-leftMargin-guide-constraint' H:|-(0)-[UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide'](LTR)  (active, names: '|':_UIButtonBarStackView:0x7f854041b2d0 )>",
    "<NSLayoutConstraint:0x60800009a770 'UIView-rightMargin-guide-constraint' H:[UILayoutGuide:0x6080001a9a00'UIViewLayoutMarginsGuide']-(0)-|(LTR)  (active, names: '|':_UIButtonBarStackView:0x7f854041b2d0 )>" )

Will attempt to recover by breaking constraint  <NSLayoutConstraint:0x604000098650 H:[_UIModernBarButton:0x7f8540510b40]-(>=5)-|   (active, names: '|':_UIButtonBarButton:0x7f854050ea30 )>

Make a symbolic breakpoint at UIViewAlertForUnsatisfiableConstraints to catch this in the debugger. The methods in the UIConstraintBasedLayoutDebugging category on UIView listed in <UIKit/UIView.h> may also be helpful.

- mnemon1ck

4个回答

3

我遇到了同样的问题。我正在运行一个干净的项目，基本设置，但是一旦webview键盘获得焦点，这个问题就会出现。这似乎是一个常见的问题，可能只是iOS 11中的一个bug。

另请参见：

WKWebView布局约束问题

- Yasper

2022年了，还有bug？！ - MartianMartian

2

当键盘打开时，一个或多个约束条件不能同时兼容。

尝试将约束条件设置到您的WKWebView中，而不是手动逐帧处理。

private func addWKWebView(){
    let wv = WKWebView()
    view.addSubview(wv);
    wv.translatesAutoresizingMaskIntoConstraints = false


    wv.widthAnchor.constraint(equalTo:   view.widthAnchor  ).isActive = true
    wv.heightAnchor.constraint(equalTo:  view.heightAnchor ).isActive = true
    wv.centerXAnchor.constraint(equalTo: view.centerXAnchor).isActive = true
    wv.centerYAnchor.constraint(equalTo: view.centerYAnchor).isActive = true
}

或者像这样：

private func addWKWebView(){
    let wv = WKWebView()
    view.addSubview(wv);
    wv.translatesAutoresizingMaskIntoConstraints = false


    wv.widthAnchor.constraint(equalToConstant:  100).isActive = true
    wv.heightAnchor.constraint(equalToConstant: 100).isActive = true
    wv.widthAnchor.constraint(equalToConstant:  100).isActive = true
    wv.heightAnchor.constraint(equalToConstant: 100).isActive = true
}

您需要调整约束条件，将WkWebView放置在所需位置。

- alegelos

2

都试过了，但都没有帮助。在这两种情况下，错误仍然弹出。 - mnemon1ck

还可以尝试将它们四个中的低优先级添加进去：让宽度等于wv.widthAnchor.constraint(equalToConstant: 100) width.isActive = true width.priority = .defaultLow - alegelos

2

它对iOS 13没有帮助。 - htafoya

2

一样的情况。iOS 14，仍在等待修复。 - Carl Hung

iOS 15.5也是一样的。有什么新消息吗？ - geohei

显示剩余5条评论

-1

当我需要弹出自定义键盘时，我也遇到了这个问题。最终，我所需要做的就是更改HTML输入元素的eventType：从"touchstart"更改为"click"。

原文：

    function setUpEvent(elem, eventType, handler) {
        return (elem.attachEvent ? elem.attachEvent("on" + eventType, handler)
            : ((elem.addEventListener) ? elem.addEventListener(eventType, handler, false) : null));
    }

    window.onload = function () {

        var input_ele = document.getElementById('YOUR_ELE_NAME');
        setUpEvent(input_ele, "touchstart", function (e) {

            //showKeyboard();//my personal function to show keyboard
        });
    }

它有效：

    function setUpEvent(elem, eventType, handler) {
        return (elem.attachEvent ? elem.attachEvent("on" + eventType, handler)
            : ((elem.addEventListener) ? elem.addEventListener(eventType, handler, false) : null));
    }

    window.onload = function () {

        var input_ele = document.getElementById('YOUR_ELE_NAME');
        setUpEvent(input_ele, "click", function (e) {//change here

            //showKeyboard();//my personal function to show keyboard
        });
    }

- stuartofmine

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Jim T · Accepted Answer

12

我猜测这是 iOS 11 的一个 bug。关于按钮栏中的组件，它们都使用操作系统设置的默认值，而用户都在抱怨这个问题。我在 iOS 9 和 iOS 10 上运行了同样的代码，没有出现任何错误信息。

- Jim T

3

有什么可行的解决方案吗？这个问题可以通过某种方式修复吗？在iOS 13 beta 5上也遇到了相同的问题。 - swalkner

如果您只想删除底部的空白：

NotificationCenter.default.addObserver(forName: 
UIResponder.keyboardWillHideNotification, object: nil, queue: nil) { (notification) in
            self.webView.scrollView.contentOffset.y = 0
}

@swalkner 如果偏移量不为0，则可以在 keyboardWillShowNotification 中获取内容偏移值，并在 keyboardWillHideNotification 中相应地设置它。 - mc_plectrum