Wie verwende ich UIVisualEffectView, um Bilder zu verwischen?

Könnte jemand ein kleines Beispiel für das Anwenden der Unschärfe auf ein Bild geben? Ich habe jetzt schon eine Weile versucht, den Code herauszufinden :( noch neu bei obj c!

Das UIVisualEffectViewbietet eine einfache Abstraktion über komplexe visuelle Effekte. Abhängig vom gewünschten Effekt können sich die Ergebnisse auf Inhalte auswirken, die hinter der Ansicht liegen, oder auf Inhalte, die der Inhaltsansicht der Ansicht hinzugefügt wurden.

Wenden Sie a UIVisualEffectViewauf eine vorhandene Ansicht an, um einen Unschärfe- oder Vibrationseffekt auf die verlassene Ansicht anzuwenden. Nachdem Sie die UIVisualEffectView zur Ansichtshierarchie hinzugefügt haben, fügen Sie der contentView der Unteransichten hinzu UIVisualEffectView. Fügen Sie keine Unteransichten direkt zu sich UIVisualEffectViewselbst hinzu.

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

Fügen Sie diese Unschärfeansicht einfach in die Bildansicht ein. Hier ist ein Beispiel in Ziel-C:

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

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

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

und Swift:

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

visualEffectView.frame = imageView.bounds

imageView.addSubview(visualEffectView)

Hier erfahren Sie, wie Sie UIVibrancyEffect und UIBlurEffect mit UIVisualEffectView verwenden

Ziel c:

// 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];

Swift 4:

    // 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)

Sie können den Interface Builder auch verwenden, um diese Effekte für einfache Situationen einfach zu erstellen. Da die Z-Werte der Ansichten von der Reihenfolge abhängen, in der sie in der Dokumentgliederung aufgeführt sind, können Sie a UIVisualEffectViewvor der Ansicht, die Sie verwischen möchten, auf die Dokumentkontur ziehen. Dadurch wird automatisch eine Verschachtelung erstellt UIView, die die contentViewEigenschaft der angegebenen ist UIVisualEffectView. Verschachteln Sie Dinge in dieser Ansicht, die über der Unschärfe angezeigt werden sollen.

Sie können auch die Lebendigkeit leicht nutzen UIVisualEffect, wodurch automatisch eine weitere UIVisualEffectViewin der Dokumentkontur verschachtelte Lebendigkeit erstellt wird , wobei die Lebendigkeit standardmäßig aktiviert ist. Sie können dem verschachtelten Element UIView(wieder die contentViewEigenschaft von UIVisualEffectView) eine Beschriftung oder Textansicht hinzufügen , um den gleichen Effekt zu erzielen wie das UI-Element "> Folie zum Entsperren".

Ich bevorzuge das Erstellen von visuellen Effekten über Storyboard - kein Code zum Erstellen oder Verwalten von UI-Elementen. Es gibt mir auch volle Unterstützung für die Landschaft. Ich habe eine kleine Demo der Verwendung von UIVisualEffects mit Unschärfe und auch Vibrancy gemacht.

Demo auf Github

Wenn jemand die Antwort in Swift möchte:

var blurEffect = UIBlurEffect(style: UIBlurEffectStyle.Dark) // Change .Dark into .Light if you'd like.

var blurView = UIVisualEffectView(effect: blurEffect)

blurView.frame = theImage.bounds // 'theImage' is an image. I think you can apply this to the view too!

Update:

Ab sofort ist es unter dem IB verfügbar, sodass Sie nichts dafür codieren müssen :)

-(void) addBlurEffectOverImageView:(UIImageView *) _imageView
{
    UIVisualEffect *blurEffect;
    blurEffect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleDark];

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

    visualEffectView.frame = _imageView.bounds;
    [_imageView addSubview:visualEffectView];
}

Dies wird verwendet, um helle oder dunkle Hintergründe zu verwischen, damit Text leichter überlagert werden kann. Sie können optional die Lebendigkeit aktivieren, wodurch der Text neben der Unschärfe in einer hellen, kontrastierenden Farbe gerendert wird.