Zoyt
Zoyt

Reputation: 4967

FXBlurView Background Lagging

I'm using FXBlurView for my background blurs on my UIViews. I'm using the default settings, which means that it updates every frame. However, for some reason, the background seems to lag a bit. Here is a GIF of the issue I'm having:
BlurGIF http://www.interdazzle.com/misc/forums/BlurGIF.gif If anyone could help, that would be wonderful. Thanks in advance!

Edit: I changed my code a bit to match what Nick suggested, and came up with this: When it is initialized:

   self.sidebar.blurRadius = 30;
    self.sidebar.dynamic = NO;
    self.sidebar.contentMode = UIViewContentModeLeft;
    [self.sidebar updateAsynchronously:YES completion:^{
        self.sidebar.frame = CGRectMake(0, 0, 250, [[UIScreen mainScreen] bounds].size.height);

    }];

When I animate it:

[UIView animateWithDuration:0.5 animations:^{
    BOOL open = self.sidebar.frame.size.width >= 250;
    self.sidebar.frame = CGRectMake(open? -250: 0, self.sidebar.frame.origin.y, open? 0: 250, self.sidebar.frame.size.height);
}];

However, it doesn't seem to update/position correctly. Thank you in advance!

Upvotes: 3

Views: 2158

Answers (2)

Zoyt
Zoyt

Reputation: 4967

Expanding on @NickLockwood's question:
When the FXBlurView is initiated, I run this code:

self.sidebar.blurRadius = 30;
self.sidebar.dynamic = NO;
self.sidebar.contentMode = UIViewContentModeRight;
self.sidebar.layer.contentsGravity = kCAGravityBottomLeft;
[self.sidebar setClipsToBounds:YES];
[self.sidebar updateAsynchronously:YES completion:^{
    // Whatever you want
}];

Then I simply animate the object like this:

[UIView animateWithDuration:0.5 animations:^{
        BOOL open = self.sidebar.frame.size.width > 125; // Over half way done
        self.sidebar.frame = CGRectMake(0,0, open? 0 : 250, [[UIScreen mainScreen] bounds].size.height);
    }];

Thanks!

Upvotes: 3

Nick Lockwood
Nick Lockwood

Reputation: 40995

FXBlurView can't always keep up if the size of the view is very large, or the underlying view is very complex.

There is a trick for doing this efficiently, where you only render the blur once and then adjust the visible area instead of redrawing it every frame. If you look at the sliding overlay example included with FXBlurView, you can see how this is done.

Upvotes: 1

Related Questions