web-dev-qa-db-ger.com

Wie verwende ich UIVisualEffectView, um ein Bild zu verwischen?

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

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

Wenden Sie ein UIVisualEffectView auf eine vorhandene Ansicht an, um einen Weichzeichner- oder Lebendigkeitseffekt auf die bestehende Ansicht anzuwenden. Nachdem Sie UIVisualEffectView zur Ansichtshierarchie hinzugefügt haben, fügen Sie der Inhaltsansicht von UIVisualEffectView alle Unteransichten hinzu. Fügen Sie keine Unteransichten direkt zum UIVisualEffectView selbst hinzu.

https://developer.Apple.com/documentation/uikit/uivisualeffectview#//Apple_ref/occ/instp/UIVisualEffectView/contentView

205
cNoob

Setzen Sie einfach diese Unschärfeansicht auf die Bildansicht. Hier ist ein Beispiel in Objective-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)
410
B.S.

So verwenden Sie UIVibrancyEffect und UIBlurEffect mit UIVisualEffectView

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)
133
Matt Rundle

Mit dem Interface Builder können Sie diese Effekte auch in einfachen Situationen problemlos erstellen. Da die Z-Werte der Ansichten von der Reihenfolge abhängen, in der sie in der Dokumentgliederung aufgeführt sind, können Sie ein UIVisualEffectView auf die Dokumentgliederung ziehen, bevor Sie die Ansicht verwischen möchten. Dadurch wird automatisch ein verschachteltes UIView erstellt, bei dem es sich um die contentView -Eigenschaft des angegebenen UIVisualEffectView handelt. Verschachteln Sie die Elemente in dieser Ansicht, die über der Unschärfe angezeigt werden sollen.

XCode6 beta5

Sie können auch auf einfache Weise die Lebendigkeit UIVisualEffect nutzen, wodurch automatisch eine weitere verschachtelte UIVisualEffectView in der Dokumentstruktur erstellt wird, wobei die Lebendigkeit standardmäßig aktiviert ist. Anschließend können Sie der verschachtelten UIView (wieder die contentView -Eigenschaft der UIVisualEffectView) eine Beschriftung oder eine Textansicht hinzufügen, um den gleichen Effekt zu erzielen, zu dem die "> Folie führt "UI-Element entsperren.

enter image description here

45
ohhh

Wenn jemand die Antwort in Swift:

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 der IB verfügbar, so dass Sie nichts dafür codieren müssen :)

9
Amit Kalra

Ich bevorzuge das Erstellen von visuellen Effekten über das 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 über die Verwendung von UIVisualEffects mit Blur und auch Vibrancy gemacht.

Demo auf Github

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

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

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

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

0
Xab Ion