透明背景 WKWebView (NSView)答案

【问题标题】：Transparent background WKWebView (NSView)透明背景 WKWebView (NSView)
【发布时间】：2014-11-30 08:51:43
【问题描述】：

我正在使用 Swift 构建一个 Mac 应用程序。因此，我想让 WKWebView 透明，因此它显示加载的 HTML 的文本，但我的底层 NSWindow 的背景是可见的。我试过了

webView.layer?.backgroundColor = NSColor.clearColor().CGColor;

没有任何效果。 WKWebView继承自NSView，不知道有没有帮助。

另一种解决方案是插入一个 NSVisualEffectView 作为 WebView 的背景，但我也不知道如何实现！

【问题讨论】：

标签： macos swift appkit

【解决方案1】：

在 macOS 10.12 及更高版本中使用：

webView.setValue(false, forKey: "drawsBackground")

【讨论】：

这应该是公认的答案，因为它是唯一一个（在 Swift 中）在 10.15.4 上为我工作的答案。

【解决方案2】：

不支持，然后他们修复了它：

https://bugs.webkit.org/show_bug.cgi?id=134779

使其透明的方法是：

myWebView.opaque = false

【讨论】：

这对我来说是完美的解决方案。
NSView 只有一个只读的“isOpaque”，所以这不起作用。这仅适用于 iOS。

【解决方案3】：

下面的代码非常适合我，默认情况下颜色设置为 clearColor。

[wkWebView setValue:YES forKey:@"drawsTransparentBackground"];

【讨论】：

SetValue:YES 不允许使用 ARC。 [NSNumber numberWithBool:YES] 应该使用。而且 WKWebView 也没有与键值编码兼容的 drawsTransparentBackground
所以当正确调用时，这确实工作：[wkWebView setValue:@(YES) forKey:@"drawsTransparentBackground"];（注意@(YES)；Inna 的[NSNumber numberWithBool:YES] 是等效的）。该视图至少在 10.11 上与该密钥的 KVC 兼容；它触发了内部方法_setDrawsTransparentBackground:。
另外，至少 WKWebView 的父视图必须是 layer-backed 或 layer-hosted。在非分层环境中，您会得到奇怪的结果（窗口完全透明，而 Web 视图是透明的；您看不到 Web 视图下方的视图）。

【解决方案4】：

我将它用于 macOS 10.12。在 OjbC 中没有问题：

[self.webView setValue:@YES forKey:@"drawsTransparentBackground"];

在 macOS 10.13.+ 下，我收到以下控制台警告消息：

-[WKWebView _setDrawsTransparentBackground:] 已弃用，不应使用

唯一可行的解决方案是：

[self.webView setValue:@(NO) forKey:@"drawsBackground"];

我在很多情况下尝试了以下方法，但没有成功：

给 webView 和 enclosingScrollView 一个图层并编辑它的属性（backgroundColor，isOpaque）
给 webView 和 enclosingScrollView 一个清晰的背景色
在 webview 中注入不带 setValue forKey: 的 javascript。

另外我确实使用过：

- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation
{
    if (self.isWebviewsBackgroundTransparent) {
        [self insertTransparentBackgroundTo:webView];
    }
}

- (void)insertTransparentBackgroundTo:(WKWebView *)webView
{
    NSString *transparentBackgroundJSSString = @"document.body.style = document.body.style.cssText + \";background: transparent !important;\";";
    [webView evaluateJavaScript:transparentBackgroundJSSString completionHandler:nil];
}

【讨论】：

【解决方案5】：

更新后的稍微好一点的解决方案（2021 年）。在WKWebViewConfiguration 上使用私有属性drawsBackground。它的属性已在macOS 10.14 中引入，因此不会消失。

//https://opensource.apple.com/source/WebKit2/WebKit2-7610.2.11.51.8/UIProcess/API/Cocoa/WKWebViewConfigurationPrivate.h.auto.html
@property (nonatomic, setter=_setDrawsBackground:) BOOL _drawsBackground WK_API_AVAILABLE(macos(10.14), ios(12.0));

let configuration = WKWebViewConfiguration()
var requiresDrawBackgroundFallback = false
if #available(OSX 10.14, *) {                         
    configuration.setValue(false, forKey: "sward".reversed() + "background".capitalized) //drawsBackground KVC hack; works but private
} else {
    requiresDrawBackgroundFallback = true
}
let webView = WKWebView(frame: .zero, configuration: configuration)
if requiresDrawBackgroundFallback {
    webView.setValue(false, forKey: "sward".reversed() + "background".capitalized) //drawsBackground KVC hack; works but private
}

【讨论】：