Fond Transparent pour WKWebView
dans mon application je souhaite faire le WKWebView avec fond transparent, de sorte que la vue derrière (une ImageView) peut montrer à travers comme image de fond.
webView!.opaque = false
webView!.backgroundColor = UIColor.clearColor()
le code ci-dessus fonctionne très bien avec UIWebView, mais si webView est WKWebView, un fond blanc s'affichera.
a également essayé de mettre la couleur transparente de fond dans CSS. Le résultat est le même, ne fonctionne qu'avec UIWebView mais pas avec WKWebView. Toute suggestion?
7 réponses
pour iOS 10+ en utilisant Swift:
self.webView = WKWebView()
self.webView!.isOpaque = false
self.webView!.backgroundColor = UIColor.clear
self.webView!.scrollView.backgroundColor = UIColor.clear
ce code pourrait vous aider. Mise à jour pour Swift 3+
self.webView = WKWebView()
self.webView.isOpaque = false
self.webView.backgroundColor = UIColor.clear
self.webView.scrollView.backgroundColor = UIColor.clear
le Code ci-dessous fonctionne pour moi:
[wkWebView setValue:YES forKey:@"drawsTransparentBackground"];
si vous chargez un PDF et que vous voulez une couleur de fond différente du gris standard, il semble qu'il soit nécessaire d'attendre jusqu'à ce que le document soit chargé, puis Effacer les fonds des aperçus. L'avantage d'utiliser un WKWebView un PDFView (iOS 11+), c'est que WKWebView s ont double-tap à zoom et un indicateur de compte de page intégré, et sont compatibles avec les versions plus anciennes de iOS.
il faut noter que ce n'est pas une bonne pratique de creuser dans des vues système comme celle-ci comme Apple peut changer la mise en œuvre à tout moment, ce qui pourrait casser la solution.
Voici comment j'ai implémenté un contrôleur de prévisualisation PDF avec un fond noir dans Swift 4:
class SomeViewController: UIViewController {
var observer: NSKeyValueObservation?
var url: URL
init(url: URL) {
self.url = url
super.init(nibName: nil, bundle: nil)
}
func viewDidLoad() {
super.viewDidLoad()
self.view.backgroundColor = UIColor.black
let webView = WKWebView()
webView.translatesAutoResizingMaskIntoConstraints = false
self.view.addSubview(webView)
NSLayoutConstraint.activate([
webView.topAnchor.constraint(equalTo: self.view.topAnchor),
webView.leftAnchor.constraint(equalTo: self.view.leftAnchor),
webView.rightAnchor.constraint(equalTo: self.view.rightAnchor),
webView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor)
])
self.observer = webView.observe(\.isLoading, changeHandler: { (webView, change) in
webView.clearBackgrounds()
})
webView.loadFileURL(self.url, allowingReadAccessTo: self.url)
}
}
extension UIView {
func clearBackgrounds() {
self.backgroundColor = UIColor.clear
for subview in self.subviews {
subview.clearBackgrounds()
}
}
}
N'ont pas encore travaillé avec WKWebView mais même UIWebView utilisé pour avoir ce problème et la solution était d'envelopper le contenu html à l'intérieur de quelque chose comme ceci:
<body style="background-color:transparent;"></body>
j'Espère que ça aide.
je sais que c'est une très vieille question. Mais j'ai eu du mal avec ça aujourd'hui. Je ne sais pas si c'est juste moi, mais webView.backgroundColor n'était pas défini dans WKWebView, et webView.opaque était en lecture seule. La seule façon pour moi de corriger cela était de définir la couleur de fond de la couche web views sur le CGColor clear
webview.wantsLayer = true
webView.layer?.backgroundColor = NSColor.clearColor().CGColor
et le contenant NSView de la même façon
webViewParent.layer?.backgroundColor = NSColor.clearColor().CGColor
C'est la seule chose qui a fonctionné pour moi, j'espère qu'elle pourra aider quelqu'un d'autre.