По умолчанию выделенный текст в WKWebView выглядит следующим образом:
Я изучаю, возможно ли подобное выделение в WKWebView :
У меня есть фрагмент кода 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
стилем:
Пока я не уверен, возможно ли установить пользовательский выбор (цвет текста, фон, пунктирная рамка и т. Д. c) без , переопределяющего процесс выбора в JS:
1 используйте что-то вроде -webkit-user-select: none;
2. затем напишите JS конечный автомат для mouseDown/mouseDrag/mouseUp
событий
3. затем пересчитайте некоторые «диапазоны выбора» в DOM
Я довольно нуб в JS, поэтому не могу быстро создать прототип:)
Итак, мои вопросы:
Стоит ли переопределять процесс выбора, как я описал выше, или есть более простой подход?
Почему, когда я устанавливаю tintColor
в .clear
, он отображается как без альфы?
Заранее спасибо!