当前位置:   article > 正文

macOS 开发 - NSVisualEffectView

nsvisualeffectview


一、简介

NSVisualEffectView 是 macOS 10.10 后开放的一个类,继承自 UIView
提供一个模糊效果的视图


二、使用详解


blendingMode

值为 NSVisualEffectBlendingMode 枚举

  • NSVisualEffectBlendingModeBehindWindow,
  • NSVisualEffectBlendingModeWithinWindow,

Behind-window blending uses the content behind the window as the background for your visual effect view. Behind-window blending makes your entire window stand out above other windows and apps on the desktop. Sheets and popovers use behind-window blending.
In-window blending uses the window’s content as the background for your visual effect view. Typically, you use in-window blending with scrolling content, so that the scrolled content remains partially visible under other parts of your window chrome. Toolbars always use in-window blending.

Behind-window 会将窗口背后的内容,作为模糊效果的背景视图;弹窗和表单一般使用 Behind-Window 模式;
In-Window 会将窗体内容作为模糊的背景视图。当滚动窗口时,滚动的内容会在 visualView 下面模糊展示。工具栏 Toolbars 一般使用 In-Window 模式。

在这里插入图片描述


在这里插入图片描述


设置blendingMode 为 behindwindow,在当前窗口不显示半透明效果;

在这里插入图片描述


state

取值为 NSVisualEffectState

  • NSVisualEffectStateFollowsWindowActiveState //激活状态,可以显示半透明模糊;
  • NSVisualEffectStateActive, 非激活状态,显示不透明
  • NSVisualEffectStateInactive 窗口是激活状态,就是激活。

在这里插入图片描述


设置颜色

既然继承自 NSView,那么设置layer color 看看;
设置后,就没有模糊效果了。

在这里插入图片描述


创建 NSVisualEffectView 的子类,重写 drawRect

- (void)drawRect:(NSRect)dirtyRect {
    [super drawRect:dirtyRect];
    
    NSColor *bgColor = [[self colorWithHexString:@"4075F0"] colorWithAlphaComponent:0.9];
    [bgColor set];
    
    NSBezierPath *path = [NSBezierPath bezierPathWithRect:dirtyRect];
    [path fill];
    
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11

在这里插入图片描述


allowsVibrancy

当前这个类不会自动添加 vibrancy 到内容;
如果需要 vibrancy,需要创建类继承自 NSVisualEffectView,重写 allowsVibrancy 方法:

-(BOOL)allowsVibrancy{
    return YES;
}
  • 1
  • 2
  • 3

Appkit 会给适当的视图添加 vibrancy。比如 NSTextField, 会增加文字和背景的对比效果。
一般不要去修改标准视图和控件的 vibrancy 属性。


添加 textField 子空间后,如果设置了 Vibrancy 为 yes
在这里插入图片描述


没有设置时:
在这里插入图片描述

虽然设置了好像更糊,但更加融入这个 effectView,需要根据你的具体情况去判断。


material

对应的值为 NSVisualEffectMaterial 枚举。

黑色有两个值:NSVisualEffectMaterialUltraDark NSVisualEffectMaterialDark
偏白透明可设置为 NSVisualEffectMaterialMediumLight
目前测试,没有因为 10.14 系统的黑暗模式而改变

模糊的材料,不同的场景使用不同的材料;
简单测试看不出区别,用的时候可以多留意细节。


三、属性、方法总

属性

@property NSVisualEffectMaterial material;
@property (readonly) NSBackgroundStyle interiorBackgroundStyle; 
@property NSVisualEffectBlendingMode blendingMode;
@property NSVisualEffectState state;
@property (nullable, retain) NSImage *maskImage;
@property (getter=isEmphasized) BOOL emphasized NS_AVAILABLE_MAC(10_12);
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

枚举

NSVisualEffectState
typedef NS_ENUM(NSInteger, NSVisualEffectState) {
    /// Use the active look only when the containing window is active. 激活状态,可以显示半透明模糊;
    NSVisualEffectStateFollowsWindowActiveState,
    
    /// Use the active look always. 非激活状态,显示不透明
    NSVisualEffectStateActive,
    
    /// Use the inactive look always. 窗口是激活状态,就是激活。
    NSVisualEffectStateInactive,
} NS_AVAILABLE_MAC(10_10);
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10

NSVisualEffectMaterial
typedef NS_ENUM(NSInteger, NSVisualEffectMaterial) { 

  /// The material used by window titlebars. 
  NSVisualEffectMaterialTitlebar = 3, 

  /// The material used in some table views, menus, etc., to indicate selection. 
  NSVisualEffectMaterialSelection = 4, 

  /// The material used by menus. 
  NSVisualEffectMaterialMenu NS_ENUM_AVAILABLE_MAC(10_11) = 5, 

  /// The material used in the background of NSPopover windows. 
  NSVisualEffectMaterialPopover NS_ENUM_AVAILABLE_MAC(10_11) = 6, 

  /// The material used in the background of window sidebars. 
  NSVisualEffectMaterialSidebar NS_ENUM_AVAILABLE_MAC(10_11) = 7, 

  /// The material used in various in-line header or footer views (e.g., by NSTableView). 

  NSVisualEffectMaterialHeaderView NS_ENUM_AVAILABLE_MAC(10_14) = 10, 

  /// The material used as the background of sheet windows. 
  NSVisualEffectMaterialSheet NS_ENUM_AVAILABLE_MAC(10_14) = 11, 

  /// The material used by opaque window backgrounds. 
  NSVisualEffectMaterialWindowBackground NS_ENUM_AVAILABLE_MAC(10_14) = 12, 

  /// The material used as the background of heads-up display (HUD) windows. 
  NSVisualEffectMaterialHUDWindow NS_ENUM_AVAILABLE_MAC(10_14) = 13, 

  /// The material used as the background of full-screen modal UI. 
  NSVisualEffectMaterialFullScreenUI NS_ENUM_AVAILABLE_MAC(10_14) = 15, 

  /// The material used as the background of tool tips. 
  NSVisualEffectMaterialToolTip NS_ENUM_AVAILABLE_MAC(10_14) = 17, 

  /// The material used as the opaque background of content (e.g., by NSScrollView, NSTableView, NSCollectionView, etc.). 
  NSVisualEffectMaterialContentBackground NS_ENUM_AVAILABLE_MAC(10_14) = 18, 

  /// The material used under window backgrounds. 
  NSVisualEffectMaterialUnderWindowBackground NS_ENUM_AVAILABLE_MAC(10_14) = 21, 

  /// The material used as the background behind document pages. 
  NSVisualEffectMaterialUnderPageBackground NS_ENUM_AVAILABLE_MAC(10_14) = 22, 

  /// A default material appropriate for the view's effectiveAppearance.  You should instead choose an appropriate semantic material. 
  NSVisualEffectMaterialAppearanceBased NS_ENUM_DEPRECATED_MAC(10_10, API_TO_BE_DEPRECATED, "Use a specific semantic material instead.") = 0, 

  // Materials with specific looks.  You should instead choose an appropriate semantic material. 

  NSVisualEffectMaterialLight NS_ENUM_DEPRECATED_MAC(10_10, API_TO_BE_DEPRECATED, "Use a semantic material instead.  To force the appearance of a view hierarchy, set the `appearance` property to an appropriate NSAppearance value.") = 1, 

  NSVisualEffectMaterialDark NS_ENUM_DEPRECATED_MAC(10_10, API_TO_BE_DEPRECATED, "Use a semantic material instead.  To force the appearance of a view hierarchy, set the `appearance` property to an appropriate NSAppearance value.") = 2, 

  NSVisualEffectMaterialMediumLight NS_ENUM_DEPRECATED_MAC(10_11, API_TO_BE_DEPRECATED, "Use a semantic material instead.  To force the appearance of a view hierarchy, set the `appearance` property to an appropriate NSAppearance value.") = 8, 

  NSVisualEffectMaterialUltraDark NS_ENUM_DEPRECATED_MAC(10_11, API_TO_BE_DEPRECATED, "Use a semantic material instead.  To force the appearance of a view hierarchy, set the `appearance` property to an appropriate NSAppearance value.") = 9, 

} NS_AVAILABLE_MAC(10_10); 

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60

NSBackgroundStyle 枚举
typedef NS_ENUM(NSInteger, NSBackgroundStyle) { 

  /* The background reflects the predominant color scheme of the view's appearance. */ 

  NSBackgroundStyleNormal = 0, 

  /* The background is indicating emphasis (e.g. selection state) using an alternate color or visual effect. Content may alter its appearance to reflect this emphasis. */ 

  NSBackgroundStyleEmphasized,

  /* The background is intended to appear higher than the content drawn on it. Content might need to be inset. */ 

  NSBackgroundStyleRaised,

  /* The background is intended to appear lower than the content drawn on it. Content might need to be embossed. */ 

  NSBackgroundStyleLowered,
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18

方法

- (void)viewDidMoveToWindow NS_REQUIRES_SUPER;
- (void)viewWillMoveToWindow:(nullable NSWindow *)newWindow NS_REQUIRES_SUPER;
  • 1
  • 2
本文内容由网友自发贡献,转载请注明出处:【wpsshop博客】
推荐阅读
相关标签
  

闽ICP备14008679号