Arhn - архитектура программирования

Странное поведение прокрутки WKWebView при длительном нажатии для выбора текста, если установлено значение contentInset

У меня проблема, что долгое нажатие и выбор текста в WKWebView случайным образом прокручивает веб-представление. Такое поведение происходит, когда я устанавливаю свойство contentInset.top представления прокрутки веб-представления.

[Снимок экрана]

  1. Длительное нажатие на текст. Зеленая область — это нативный UIView https://ibb.co/P4LqgBB.
  2. После перетаскивания текста WKWebView неожиданно прокручивается вниз https://ibb.co/r5KR4JB

Поскольку моему приложению необходимо отображать собственное представление над зельем веб-представления, такое поведение действительно расстраивает моих пользователей, когда им нужно копировать и вставлять текст из веб-представления.

Ниже приведен минимальный код, который можно использовать для воспроизведения проблемы. Я попробовал это на iPhone 8 iOS 12.2, используя Xcode 10.2. Проблема возникает, когда установлено webView.scrollView.contentInset.top = 100. Более того, если вы измените значение на что-то вроде 1000, где contentInset.top длиннее размера экрана телефона, длительное нажатие приведет к мгновенной прокрутке веб-представления.

 override func viewDidLoad() {
        super.viewDidLoad()

        // Create WKWebView
        let webView = WKWebView(frame: .zero)
        webView.translatesAutoresizingMaskIntoConstraints = false
        webView.scrollView.contentInsetAdjustmentBehavior = .never
        webView.clipsToBounds = false
        webView.scrollView.bounces = false

        // Create Native UIView
        let nativeView = UIView(frame: .zero)
        nativeView.translatesAutoresizingMaskIntoConstraints = false
        nativeView.backgroundColor = .green

        // Add WebView to the view
        view.addSubview(webView)

        webView.topAnchor.constraint(equalTo: view.topAnchor).isActive = true
        webView.leadingAnchor.constraint(equalTo: view.leadingAnchor).isActive = true
        webView.trailingAnchor.constraint(equalTo: view.trailingAnchor).isActive = true
        webView.bottomAnchor.constraint(equalTo: view.bottomAnchor).isActive = true

        // Set contentInset to give blank space for native view
        webView.scrollView.contentInset.top = 100

        // Add the native view as webView scrollView's child
        webView.scrollView.addSubview(nativeView)
        nativeView.leadingAnchor.constraint(equalTo: webView.leadingAnchor).isActive = true
        nativeView.trailingAnchor.constraint(equalTo: webView.trailingAnchor).isActive = true
        nativeView.topAnchor.constraint(equalTo: webView.scrollView.topAnchor,
                                        constant: -100).isActive = true
        nativeView.heightAnchor.constraint(equalToConstant: 100).isActive = true

        // Load the webpage
        let url = URL(string: "https://www.apple.com")!
        let request = URLRequest(url: url)
        webView.load(request)
    }

Я ожидаю, что долгое нажатие и прокрутка будут вести себя так, как если бы contentInset.top не было установлено.

Кто-нибудь знает, как решить эту проблему?

01.04.2019

Ответы:


1

Пожалуйста, добавьте первых делегатов UIScrollViewDelegate, WKNavigationDelegate, WKUIDelegate в свой контроллер представления и добавьте ниже делегатов.

// MARK: - Делегат WKWebView

private func webView(webView: WKWebView, didFailProvisionalNavigation navigation: WKNavigation!, withError error: NSError) {
    print(error.localizedDescription)
}

func webView(_ webView: WKWebView, didStartProvisionalNavigation navigation: WKNavigation!) {
  //  print("Strat to load")
}

func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
   // print("finish to load")
    let javascriptStyle = "var css = '*{-webkit-touch-callout:none;-webkit-user-select:none}'; var head = document.head || document.getElementsByTagName('head')[0]; var style = document.createElement('style'); style.type = 'text/css'; style.appendChild(document.createTextNode(css)); head.appendChild(style);"
    webView.evaluateJavaScript(javascriptStyle, completionHandler: nil)
}

// MARK: - UIScrollViewDelegate

func viewForZoomingInScrollView(scrollView: UIScrollView) -> UIView? {
    return nil
}

Я столкнулся с той же проблемой, и код выше работает нормально для меня. Надеюсь, это поможет вам. @Чуй

08.01.2020
  • Большое тебе спасибо. Однако я попытался и обнаружил, что этот код отключает возможность длительного нажатия для выбора текста в WKWebView. Хотя это может предотвратить неожиданное поведение прокрутки, это не может решить проблему, с которой я столкнулся. 10.01.2020
  • @Chui - я думаю, вы хотите дать пользователю возможность выбирать текст и копировать его из веб-просмотра, я прав? Если да, то, пожалуйста, попробуйте один раз ниже code func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) { // print(завершить загрузку) let javascriptStyle = var css = '*{-webkit-touch-callout:none}' ; var head = document.head || document.getElementsByTagName('head')[0]; var style = document.createElement('style'); style.type = 'текст/css'; style.appendChild (document.createTextNode (css)); head.appendChild (стиль); webView.evaluateJavaScript (стиль javascript, завершениеHandler: ноль) } 23.01.2020

  • 2

    WKWebView создает много проблем, если css недостаточно чистый.

    Я предлагаю вернуться к UIWebView, это должно решить все ваши проблемы.

    01.04.2019
  • UIWebView теперь не принимает Apple, потому что он устарел. 31.12.2019
  • Новые материалы

    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..