macos - ver - ¿Cómo puedo crear una vista de estilo Yosemite con fondo translúcido/borroso?

restaurar iconos mac

Question

En Yosemite, las barras laterales tienen un fondo "vibrante" semitransparente. ¿Cómo puedo crear una vista así en 10.10 / Xcode 6?

¿Puedo dar alguna vista tal fondo? Descubrí que NSOutlineView se establecerá de manera predeterminada en ese fondo cuando le asigne un estilo de resaltado de "Lista de origen", pero la barra lateral de Calendar.app no ​​parece ser un NSOutlineView, así que me pregunto si existe una solución genérica para esto.

Answer 1

Con la introducción de la versión de Yosemite del sistema operativo OSX, Apple introdujo un nuevo modo llamado vibración , que es un desenfoque de difusión de la luz, en la ventana y los componentes de la ventana Cocoa. Es algo así como mirar a través de la puerta de la ducha, y usa el NSVisualEffectView . Apple explica este efecto aquí .

Yo uso esta categoría en NSView. Simplemente llame a la vista que desea hacer vibrante. También es compatible con versiones anteriores de Yosemite. (Si tienes un pre-Yosemite, no verás el efecto)

@implementation NSView (HS)

-(instancetype)insertVibrancyViewBlendingMode:(NSVisualEffectBlendingMode)mode
{
    Class vibrantClass=NSClassFromString(@"NSVisualEffectView");
    if (vibrantClass)
    {
        NSVisualEffectView *vibrant=[[vibrantClass alloc] initWithFrame:self.bounds];
        [vibrant setAutoresizingMask:NSViewWidthSizable|NSViewHeightSizable];
        // uncomment for dark mode instead of light mode
        // [vibrant setAppearance:[NSAppearance appearanceNamed:NSAppearanceNameVibrantDark]];
        [vibrant setBlendingMode:mode];
        [self addSubview:vibrant positioned:NSWindowBelow relativeTo:nil];

        return vibrant;
    }

    return nil;
}

@end

Las instrucciones detalladas de @Volomike siguen ...

Cómo utilizar

1. Agregue AppKit.framework a su Configuración de proyecto> Fases de compilación> Enlace binario con bibliotecas para que pueda reconocer NSVisualEffectView.

2. Haga un delegado de salida de la vista predeterminada de su ventana principal , no la ventana misma, a su archivo AppDelegate.m o AppDelegate.mm . (Si eres nuevo en eso, lee este tutorial ). Para los propósitos aquí, asumamos que mainview esto como mainview , que luego es direccionable en el código como _mainview .

3. Incluye la categoría en tu proyecto. Si eres nuevo en eso, agrega la categoría antes de cualquier línea de @implementation en tu archivo AppDelegate.m o AppDelegate.mm .

4. En su archivo AppDelegate.m o AppDelegate.mm , en su @implementation AppDelegate , dentro de su método de clase applicationDidFinishLaunching , agregue esta línea de código :

[_mainview insertVibrancyViewBlendingMode:NSVisualEffectBlendingModeBehindWindow];

5. Ahora necesita aprender cómo agregar algo de código para dar a los otros elementos en su ventana, así como a la ventana misma, la translucidez . Esa translucidez permitirá que este efecto se muestre a través de los componentes de su ventana según lo requiera. Esto se explica aquí .

El efecto neto ahora es que la ventana completa debajo de la barra de título, o solo las partes que desee (como una barra lateral), mostrarán este efecto de vibración.

Answer 2

Simplemente use un NSVisualEffectView . Puedes modificarlo aún más con sus campos así:

class MyFancyView: NSVisualEffectView {
    func myConfigureFunc() {

        // Use blendingMode to specify what exactly is blurred

        blendingMode = .behindWindow // [DEFAULT] ignores in-window content and only blurs content behind the window
        blendingMode = .withinWindow // ignores content behind the window and only blurs in-window content behind this view


        // Use material to specify how the blur draws (light/dark/etc.)

        material = .light           // The Vibrant Light look we see in countless Apple apps'' sidebars, Sierra notification center, etc.
        material = .dark            // The Vibrant Dark look we all know and love from HUDs, Launchpad, Yosemite & El Capitan notification center, etc.

        material = .appearanceBased // [DEFAULT] Automatically uses .light or .dark, depending on the view''s appearance field

        material = .titlebar        // The material the system uses in titlebars. Designed to be used with blendingMode = .withinWindow
        material = .selection       // A special material for selection. The material will vary depending on the effectiveAppearance, active state, and emphasized state.

        if #available(OSX 10.11, *) {

            // Materials introduced in 10.11 (El Capitan)

            material = .mediumLight // Not quite as light as .light
            material = .ultraDark   // Much darker than .dark

            material = .menu        // The material the system uses for menus
            material = .popover     // The material the system uses for popovers
            material = .sidebar     // The material the system uses for sidebars
        }


        // Use state to specify when the visual effect appears

        state = .active                   // Always show the visual effect
        state = .inactive                 // Never show the visual effect (behaves like a normal view)
        state = .followsWindowActiveState // [DEFAULT] Active when window is active, not when window is not
    }
}

Obtenga más información viendo el video oficial de Apple: WWDC 2014 Session 220

Answer 3

w00t! He encontrado un código de ejemplo que utiliza un tipo de vista aún no documentado:

1. Establecer el destino de despliegue de XIB a 10.10
2. NSVisualEffectView tu vista en NSVisualEffectView
3. En la configuración de Interface Builder para la vista, establezca el aspecto en "Vibrant Light / Dark". Hay otras opciones, como combinar "Detrás de una ventana" o "Dentro de una ventana" (esta última requiere capas).

También hay NSView método allowsVibrancy que allowsVibrancy la allowsVibrancy que puede anular para devolver YES , pero por razones aún no entiendo que esto no permitía la vibración en mi caso.