CODEWITHSUNDEEP
iphoneperformanceuiviewcore-graphicsuiviewanimation
arnoapp
arnoapp

Reputation: 2506

UIView Animations of custom view lagging

I created a UIView Subclass and are using drawing rounded rects with UIBezierpath and fill it with some gradient.

In short this is what the subclass draw rect looks like:

CGRect frame1 = //size of Frame 1

CGRect frame2 = //size of Frame 2



//gradientingStart
CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();

if (options == false) {
    self.color = [self createRandomColor];
}



NSArray *gradientColors = [NSArray arrayWithObjects:
                           (id)[UIColor colorWithHue:color saturation:saturationVal brightness:brightnessVal alpha:1].CGColor,
                           (id)[UIColor colorWithHue:color+0.04 saturation:saturationVal+0.15 brightness:brightnessVal-0.15 alpha:1].CGColor, nil];

CGFloat gradientLocations2[] = {0.25,1};
CGGradientRef gradient2 = CGGradientCreateWithColors(colorSpace, (__bridge CFArrayRef)gradientColors, gradientLocations2);
CGContextSaveGState(context);
//gradientingEnd

UIBezierPath *result =
[UIBezierPath bezierPathWithRoundedRect: frame1 cornerRadius:radius];
[result appendPath:
 [UIBezierPath bezierPathWithRoundedRect: frame2 cornerRadius:radius]];
[result setLineWidth:3];
[[UIColor blackColor]setStroke];
[result stroke];
[result fill];
[result addClip];
CGContextDrawLinearGradient(context, gradient2, CGPointMake(0, 0), CGPointMake(0, self.bounds.size.height), 0);

//important to prevent leaks
CGGradientRelease(gradient2);
CGColorSpaceRelease(colorSpace);
//-------
UIImage *texture = [UIImage imageNamed:@"texture2.png"];
[texture drawInRect:CGRectMake(self.bounds.origin.x, self.bounds.origin.y, self.bounds.size.width, self.bounds.size.height)];

Now I'm creating several instances of this in my view controller and trying the move them with animations like this:

[UIView animateWithDuration:0.5 delay:0 options:0 animations:^{
    costumview.alpha = 0;
    [costumview setFrame:CGRectMake(320,0,320,420)];
    [self reorderViewsFrom:costumview.intValue];
    overlay.alpha = 0;
}completion:^(BOOL finished){
}];

But unfortunately the animation is on a device very laggy and the more (5-10) costum views are display the worse it gets.

How can i improve the performance and provide smooth animations? I think changing the costum view is not an alternative because this would destroy the sense of the application. Are there any faster ways to animate the costum view?

Upvotes: 0

Views: 1091

Answers (2)

arnoapp
arnoapp

Reputation: 2506

I pointed out that using some CALayer transformation (rounding corners) causing the lag - unfournately this wasn't in the snippet I posted.

I avoided it by creating the rounded corners with a own uiview subclass. This makes the app a lot smoother. All these rasterization stuff didn't do it for me...

Upvotes: 0

brynbodayle
brynbodayle

Reputation: 6626

Your drawRect method is very intense. Drawing those gradients and rounded edges are performance heavy routines, and because your changing the frame of your image in the animation, your drawRect is getting called very often.

I would add an NSLog inside your draw rect and see how many times it gets called when you animate your custom view. You might be surprised.

You could try using: 

view.layer.shouldRasterize = YES

This way you render a bitmap of the custom view before you animate it. After animating the frame change again, you should invoke drawRect again and disable shouldRasterize.

Read more about shouldRasterize here:

https://developer.apple.com/library/mac/documentation/graphicsimaging/reference/CALayer_class/Introduction/Introduction.html#//apple_ref/occ/instp/CALayer/shouldRasterize

Upvotes: 1

Related Questions