How To Make Part of Web View Slightly Translucent?

问题

In Objective-C with Mac OSX Cocoa, is there any way to make a DIV on a WebView slightly translucent so that the desktop applications behind the window bleed through slightly, but only on that DIV and not the rest of the WebView?

Or perhaps I can make the whole WebView translucent, but turn it off for all DIVs except one DIV?

I have a WebView loading a web page. In the web page, I have a sidebar on the left, and then an IFRAME on the right. I click items on the sidebar and they change the IFRAME pages on the right. It's this sidebar that I want to make slightly translucent.

In my AppDelegate.m, I have this so far, and my HTML and BODY tags are set to background:none, and my sidebar is set to background:rgba(0,0,0,0.5), but all I end up seeing is a grey sidebar background. It's like the webview itself wants to ensure that it's background is set to a color other than clear.

- (void)applicationDidFinishLaunching:(NSNotification *)aNotification
{
  // note that _window and _wv are outlet properties to my window and webview widgets
  [_window setBackgroundColor:[NSColor clearColor]];
  [_window setOpaque:NO];

  [_wv.layer setBackgroundColor:[NSColor clearColor].CGColor];
  [_wv.layer setOpaque:NO];
}

回答1:

Yes, just set the drawsBackground property of your WebView instance to NO, then make sure to fill the parts of the page you want opaque using CSS.

回答2:

Setting up translucency:

Set the styleMask of your NSWindow subclass to NSFullSizeContentViewWindowMask (so that the translucency will also be visible in the titlebar area, leave this out and the titlebar area will be blank)
Set the self.titlebarAppearsTransparent = true (hides the titlebar default graphics)
Add the code bellow to your NSWindow subclass: (you should now have a translucent window)

let visualEffectView = NSVisualEffectView(frame: NSMakeRect(0, 0, 0, 0))//<---the width and height is set to 0, as this doesn't matter. 
visualEffectView.material = NSVisualEffectMaterial.AppearanceBased//Dark,MediumLight,PopOver,UltraDark,AppearanceBased,Titlebar,Menu
visualEffectView.blendingMode = NSVisualEffectBlendingMode.BehindWindow//I think if you set this to WithinWindow you get the effect safari has in its TitleBar. It should have an Opaque background behind it or else it will not work well
visualEffectView.state = NSVisualEffectState.Active//FollowsWindowActiveState,Inactive
self.contentView = visualEffectView/*you can also add the visualEffectView to the contentview, just add some width and height to the visualEffectView, you also need to flip the view if you like to work from TopLeft, do this through subclassing*/

来源：https://stackoverflow.com/questions/34504699/how-to-make-part-of-web-view-slightly-translucent

标签

objective-c