mistic
mistic

Reputation: 56

Animate creating of cgrect on drawRect not working

I have a scene of storyboard with a UIVIewcontroller. Inside this scene i have a UIImageview that contains the background image, an UIButton, and an UIView.

This UIView have a overrided drawRect method with:

- (void)drawRect:(CGRect)rect
{

    CGFloat height = self.bounds.size.height-15; // - 15 for text space

    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextClearRect(context, rect);

    UIColor *barColor = [UIColor colorWithRed:226.0/255.0 green:178.0/255.0 blue:39.0/255.0 alpha:1.0];

    CGContextSetFillColorWithColor(context, barColor.CGColor);
    CGFloat barWidth = 37.5;
    [UIView animateWithDuration:1.0 animations:^{
        int count = 0;
        NSArray *values = [NSArray arrayWithObjects:@1, @0.5, @0.2, @0.7, nil];
        for (NSNumber *num in values) {

            CGFloat x = count * (barWidth + 18);
            CGFloat startY = (height - ([num floatValue] * height));
            CGRect barRect = CGRectMake(x, startY+15, barWidth, [num floatValue] * height);
            CGContextAddRect(context, barRect);
            // save context state first
            CGContextSaveGState(context);
            [self drawWords:[NSString stringWithFormat:@"%@%%",num] AtPoint:CGPointMake(x + (barWidth/2)-10 , startY) color:[UIColor whiteColor]];
            count++;
            // restore context state first
            CGContextRestoreGState(context);

        }
    }];
    CGContextFillPath(context);
}

I've tried animate the grow up of bars but not work..my question is: how can i make this work?

Regards

----UPDATED WITH NEW CODE BUT NOT WORKING ALREADY

---CODE OF GRAPHVIEW

- (void) initHelper {
    height=0;
    graphBars = [[NSMutableArray alloc] initWithCapacity:0];
     [self performSelector:@selector(animateBars) withObject:NULL afterDelay:0.5];
}

- (void) animateBars
{
    for (GraphBar *bar in graphBars)
    {
        bar.bottom+=bar.height;
    }

    CGFloat barWidth=37.5;
    CGFloat rat = self.frame.size.height*0.95;

    [UIView animateWithDuration:1.0 animations:^{

        NSUInteger _index = 0;
        for (GraphBar *bar in graphBars)
        {
            bar.frame = CGRectMake(_index*(barWidth+18),  self.frame.size.height-roundf(bar.barValue*rat), barWidth, roundf(bar.barValue*rat));

            _index++;
        }
    }];
}

- (void) layoutSubviews
{
    [super layoutSubviews];

    CGFloat barWidth=37.5;
    CGFloat rat = self.frame.size.height*0.01;

    NSUInteger _index = 0;
    for (GraphBar *bar in graphBars)
    {
        bar.frame = CGRectMake(_index*(barWidth+18),  self.frame.size.height-roundf(bar.barValue*rat), barWidth, roundf(bar.barValue*rat));

        _index++;

    }

---CODE OF BAR VIEW

- (void)drawRect:(CGRect)rect
{

    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextClearRect(context, rect);

    UIColor *barColor = [UIColor colorWithRed:226.0/255.0 green:178.0/255.0 blue:39.0/255.0 alpha:1.0];

    CGContextSetFillColorWithColor(context, barColor.CGColor);

    CGContextAddRect(context, rect);

    CGContextFillPath(context);
}

}

Upvotes: 0

Views: 1751

Answers (1)

AliSoftware
AliSoftware

Reputation: 32681

Instead of simply using the +animateWithDuration:animations: convenience method, use the more detailed +animateWithDuration:delay:options:animations:completion: method which allows you to pass the UIViewAnimationOptionAllowAnimatedContent option. Then change the height of your view in the animations block to let the view and bars height grow during the animation.

This option is specially here to tell CoreAnimation to redraw your content during the animation (calling drawRect: at each step of the animation). Without it, the animation is done on a snapshot image.


From the UIView class Reference documentation:

UIViewAnimationOptionAllowAnimatedContent

Animate the views by changing the property values dynamically and redrawing the view. If this key is not present, the views are animated using a snapshot image.


Alternatively, you could instead use one UIView for each of your bar, and use +animateWithDuration:animations: to animate those bars frame, instead of drawing them using CoreGraphics (as UIView animation methods are meant for animating properties of the view (frame, alpha, …) and its subviews, not primarily to animate the drawing done with CoreGraphics)

Upvotes: 2

Related Questions