WKWebView 约束弹出键盘时的问题

Question

当 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.

Answer 1

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

与其手动制作框架，不如尝试为您的 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。

Answer 2

我的假设是 ios 11 中的错误。投诉是关于键盘按钮栏中的组件，它们都使用 os 设置的默认值。我在 ios 9 和 ios 10 上都有运行相同的代码，没有收到任何错误消息。

Answer 3

有同样的问题。我是运行一个干净的项目，香草设置，一旦 webview 键盘获得焦点，这个问题就会出现。这似乎是一个常见问题，可能只是 iOS 11 中的一个错误。

另见：

Answer 4

当我需要弹出自定义键盘时，我也遇到了这个问题。最后，我需要做的就是将 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
        });
    }

WKWebView 约束弹出键盘时的问题

WKWebView constrains issue when keyboard pops up

ios

swift

wkwebview