Search code examples
iosobjective-cuiviewuivisualeffectviewuiblureffect

How can I add a vibrancy effect to a subview?


The code below works fine for a simple:

UIVisualEffectView *blurView

But, when I try to add a label to it that has a vibrancy effect it breaks down in tears and errors. :(

    UIBlurEffect * effect = [UIBlurEffect effectWithStyle:UIBlurEffectStyleLight];

    _blurView = [[UIVisualEffectView alloc] initWithEffect:effect];
    _blurView.backgroundColor = [UIColor colorWithWhite:0.8 alpha:0.5];
    [self addSubview:_blurView];

    UIVisualEffectView * vibrancyView = [[UIVisualEffectView alloc] initWithEffect:effect];

    [_blurView.contentView addSubview:vibrancyView];

    _titleLabel = [[UILabel alloc] init];
    _titleLabel.font = [UIFont boldSystemFontOfSize:17.0];
    _titleLabel.textColor = [UIColor colorWithWhite:0.1 alpha:0.5];
    _titleLabel.text = @"TITLE";

    [vibrancyView.contentView addSubview:_titleLabel];

Custom set frame method:

#pragma mark -

- (void)setFrame:(CGRect)frame
{
    [super setFrame:frame];

    _blurView.frame = CGRectMake(0, 0, frame.size.width, frame.size.height);

    _titleLabel.frame = CGRectMake(16, 16, 200, 30);
}

The label doesn't show on the screen, but it does show up if I add it as a simple subview to the blurView.

[_blurView addSubview:_titleLabel];

I'm using the code in the initialization method, could that be the cause of the problem?

- (instancetype)init
{
    self = [super init];

    if (self) {

        // Code...
    }

    return self;
}

I need it to be in the initialization method in order to be consistent with how I write code.

Source

EDIT 1:

The vibrancyView should also have its frame set.

vibrancyView.frame = CGRectMake(0, 0, _blurView.frame.size.width, _blurView.frame.size.height);

Turns out the example in the source is incomplete.

EDIT 2:

The label does show up but it has no vibrancy effect.

Help!


Solution

  • You are missing the creation of the vibrancy effect:

    UIVibrancyEffect * vibrancyEffect = [UIVibrancyEffect effectForBlurEffect:effect];
    

    Later you should pass it to the vibrancy view:

    UIVisualEffectView * vibrancyView = [[UIVisualEffectView alloc] initWithEffect: vibrancyEffect];
    


    I've made a class available on github that simplefy all the boiler code needed to create a UIVisualEffectView.