¿Cómo utilizar UIVisualEffectView para desenfocar la imagen?

Resuelto cNoob asked hace 54 años • 6 respuestas

¿Alguien podría dar un pequeño ejemplo de cómo aplicar el desenfoque a una imagen? He estado tratando de descifrar el código por un tiempo :( ¡aún soy nuevo en obj c!

Proporciona UIVisualEffectViewuna abstracción simple sobre efectos visuales complejos. Dependiendo del efecto deseado, los resultados pueden afectar el contenido en capas detrás de la vista o el contenido agregado al contentView de la vista.

Aplique UIVisualEffectViewa una vista existente para aplicar un efecto de desenfoque o vitalidad a la vista existente. Después de agregar UIVisualEffectView a la jerarquía de vistas, agregue las subvistas a contentView de UIVisualEffectView. No agregue subvistas directamente a la UIVisualEffectViewmisma.

https://developer.apple.com/documentation/uikit/uivisualeffectview#//apple_ref/occ/instp/UIVisualEffectView/contentView

cNoob avatar Jan 01 '70 08:01 cNoob
Aceptado

Simplemente coloque esta vista borrosa en imageView. Aquí hay un ejemplo en Objective-C:

UIVisualEffect *blurEffect;
blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];

UIVisualEffectView *visualEffectView;
visualEffectView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];

visualEffectView.frame = imageView.bounds;
[imageView addSubview:visualEffectView];

y rápido:

var visualEffectView = UIVisualEffectView(effect: UIBlurEffect(style: .Light))    

visualEffectView.frame = imageView.bounds

imageView.addSubview(visualEffectView)
B.S. avatar Jun 06 '2014 14:06 B.S.

Aquí se explica cómo usar UIVibrancyEffect y UIBlurEffect con UIVisualEffectView

C objetivo:

// Blur effect
UIBlurEffect *blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleDark];
UIVisualEffectView *blurEffectView = [[UIVisualEffectView alloc] initWithEffect:blurEffect];
[blurEffectView setFrame:self.view.bounds];
[self.view addSubview:blurEffectView];

// Vibrancy effect
UIVibrancyEffect *vibrancyEffect = [UIVibrancyEffect effectForBlurEffect:blurEffect];
UIVisualEffectView *vibrancyEffectView = [[UIVisualEffectView alloc] initWithEffect:vibrancyEffect];
[vibrancyEffectView setFrame:self.view.bounds];

// Label for vibrant text
UILabel *vibrantLabel = [[UILabel alloc] init];
[vibrantLabel setText:@"Vibrant"];
[vibrantLabel setFont:[UIFont systemFontOfSize:72.0f]];
[vibrantLabel sizeToFit];
[vibrantLabel setCenter: self.view.center];

// Add label to the vibrancy view
[[vibrancyEffectView contentView] addSubview:vibrantLabel];

// Add the vibrancy view to the blur view
[[blurEffectView contentView] addSubview:vibrancyEffectView];

Rápido:

// Blur Effect
let blurEffect = UIBlurEffect(style: UIBlurEffectStyle.dark)
let blurEffectView = UIVisualEffectView(effect: blurEffect)
blurEffectView.frame = view.bounds
view.addSubview(blurEffectView)

// Vibrancy Effect
let vibrancyEffect = UIVibrancyEffect(blurEffect: blurEffect)
let vibrancyEffectView = UIVisualEffectView(effect: vibrancyEffect)
vibrancyEffectView.frame = view.bounds

// Label for vibrant text
let vibrantLabel = UILabel()
vibrantLabel.text = "Vibrant"
vibrantLabel.font = UIFont.systemFont(ofSize: 72.0)
vibrantLabel.sizeToFit()
vibrantLabel.center = view.center

// Add label to the vibrancy view
vibrancyEffectView.contentView.addSubview(vibrantLabel)

// Add the vibrancy view to the blur view
blurEffectView.contentView.addSubview(vibrancyEffectView)
Matt Rundle avatar Jun 14 '2014 23:06 Matt Rundle

También puedes utilizar el generador de interfaces para crear estos efectos fácilmente para situaciones simples. Dado que los valores z de las vistas dependerán del orden en que aparecen en el esquema del documento, puede arrastrar a UIVisualEffectViewal esquema del documento antes de la vista que desea desenfocar. Esto crea automáticamente un anidado UIView, que es contentViewpropiedad del dado UIVisualEffectView. Anide las cosas dentro de esta vista que desea que aparezcan encima del desenfoque.

XCode6 beta5

También puedes aprovechar fácilmente la vitalidad UIVisualEffect, que creará automáticamente otro esquema anidado UIVisualEffectViewen el documento con la vitalidad habilitada de forma predeterminada. Luego puede agregar una etiqueta o vista de texto al elemento de interfaz de usuario anidado UIView(nuevamente, la contentViewpropiedad de UIVisualEffectView), para lograr el mismo efecto que el elemento de interfaz de usuario "> deslizar para desbloquear".

ingrese la descripción de la imagen aquí

ohhh avatar Aug 18 '2014 19:08 ohhh

Prefiero crear efectos visuales a través del guión gráfico: no se utiliza código para crear o mantener elementos de la interfaz de usuario. También me brinda soporte horizontal completo. Hice una pequeña demostración del uso de UIVisualEffects con Blur y también Vibrancy.

Demostración en Github

Patrik Vaberer avatar Apr 14 '2015 09:04 Patrik Vaberer