如何在窗口标题栏中使用NSVisualEffectView?

时间:2014-06-25 16:53:54

标签: macos osx-yosemite titlebar

在OS X Yosemite中,Apple引入了一个新类NSVisualEffectView。目前,此类未记录,但我们可以在Interface Builder中使用它。

如何在窗口标题栏中使用NSVisualEffectView

以下是示例:在Safari中,当您滚动时,内容会显示在工具栏和标题栏下方,并带有振动和模糊效果。

enter image description here

3 个答案:

答案 0 :(得分:19)

@ sgonzalez的回答迫使我去探索我找到NSWindow.h财产的titlebarAppearsTransparent文件。

所以我们得到:

class BluredWindow: NSWindow {

    override func awakeFromNib() {

    let visualEffectView = NSVisualEffectView(frame: NSMakeRect(0, 0, 300, 180))
    visualEffectView.material = NSVisualEffectView.Material.dark
    visualEffectView.blendingMode = NSVisualEffectView.BlendingMode.behindWindow
    visualEffectView.state = NSVisualEffectView.State.active

    self.styleMask = self.styleMask | NSFullSizeContentViewWindowMask
    self.titlebarAppearsTransparent = true
    //self.appearance = NSAppearance(named: NSAppearanceNameVibrantDark)



    self.contentView.addSubview(visualEffectView)

    self.contentView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "V:|-0-[visualEffectView]-0-|", 
                                                                   options: NSLayoutConstraint.FormatOptions.directionLeadingToTrailing,
                                                                   metrics: nil, 
                                                                   views: ["visualEffectView":visualEffectView]))

    self.contentView.addConstraints(NSLayoutConstraint.constraints(withVisualFormat: "H:|-0-[visualEffectView]-0-|",
                                                                   options: NSLayoutConstraint.FormatOptions.directionLeadingToTrailing, 
                                                                   metrics: nil, 
                                                                   views: ["visualEffectView":visualEffectView]))

您也可以在IB中设置NSVisualEffectView,它将在标题栏上展开。

答案 1 :(得分:17)

您需要修改窗口的样式掩码以包含NSFullSizeContentViewWindowMask,以便其内容视图可以“溢出”到其中。

您可以通过将此行添加到AppDelegate来轻松完成此操作:

self.window.styleMask = self.window.styleMask | NSFullSizeContentViewWindowMask;

如果你希望它看起来很暗,就像在FaceTime中一样,你还需要添加这行代码:

self.window.appearance = NSAppearance(named: NSAppearanceNameVibrantDark)

答案 2 :(得分:9)

分步教程示例:

http://eon.codes/blog/2016/01/23/Chromeless-window/

设置半透明度:

  1. 将NSWindow子类的styleMask设置为NSFullSizeContentViewWindowMask(以便在标题栏区域中显示半透明效果,将其保留,标题栏区域将为空白)
  2. 设置self.titlebarAppearsTransparent = true(隐藏标题栏默认图片)
  3. 将下面的代码添加到您的NSWindow子类:(您现在应该有一个半透明的窗口)
  4. 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*/
    

    enter image description here

    还允许您创建半透明的无铬窗口:

    enter image description here