Возможно ли иметь собственный стиль выбора в WKWebView? - PullRequest
0 голосов
/ 04 апреля 2020

По умолчанию выделенный текст в WKWebView выглядит следующим образом:

enter image description here

Я изучаю, возможно ли подобное выделение в WKWebView : enter image description here

У меня есть фрагмент кода JS + css для такого выбора, он работает, но только в Safari + MacOS, а не в WKWebView + iOS.

Это css для этого html:

<style>
::selection {
    background-color: green;
    color: red;
}

body {
    background-color: powderblue;
    -webkit-text-size-adjust: none;
    -webkit-tap-highlight-color: rgba(0,255,0,50);
    -webkit-focus-ring-color: rgba(0,255, 0, 50);
}
</style>

Я обнаружил, что этот синий выделенный цвет является .tintColor свойством UIView (которое наследуется WKViewView) поэтому я установил его на прозрачный:

override func viewDidLoad() {
    super.viewDidLoad()

    webView.navigationDelegate = self
    webView.uiDelegate = self
    webView.tintColor = UIColor.clear

    let path = Bundle.main.path(forResource: "html_sample", ofType: "html")!
    webView.loadFileURL(htmlUrl, allowingReadAccessTo: URL(fileURLWithPath: path))
}

Но результат не будет ни прозрачным UIColor, ни моим css стилем: enter image description here


Пока я не уверен, возможно ли установить пользовательский выбор (цвет текста, фон, пунктирная рамка и т. Д. c) без , переопределяющего процесс выбора в JS:
1 используйте что-то вроде -webkit-user-select: none;
2. затем напишите JS конечный автомат для mouseDown/mouseDrag/mouseUp событий
3. затем пересчитайте некоторые «диапазоны выбора» в DOM

Я довольно нуб в JS, поэтому не могу быстро создать прототип:)

Итак, мои вопросы:

  1. Стоит ли переопределять процесс выбора, как я описал выше, или есть более простой подход?

  2. Почему, когда я устанавливаю tintColor в .clear, он отображается как без альфы?

Заранее спасибо!

...