简体   繁体   中英

Animate UIView's frame and corner radius together

So I am trying to make a shrinking/growing circle with a UIView. I am using UIView.animateWithDuration... (blah blah blah) for the frame of the view and CABasicAnimation to animate the view's (layer's) corner radius. Both animate for the correct duration and end at the correct, circular values (corner radius = 1/2 width). The issue is that during the animation, CABasicAnimation and UIView.animateWithDuration seem to have different animation curves. How can I achieve a proper circle-size animation.

If the answer is to use CABAsicAnimation for the farm swell, please explain how to do that.

Thanks!


Code:

This code is in an extension for UIView.

//This is how it's being used to shrink the circle:

circleview.growByPixles(-10, seconds: 0.3, completion: {})
circleview.setCornerRadius(radius:(circleview.bounds.size.width - 10) / 2 seconds: 0.3)

//////

func morphToFrame(frame: CGRect, seconds: Double, completion: () -> ()) {
    UIView.animateWithDuration(seconds,
        animations: {
            self.frame = frame
        },
        completion: { _ in
            completion()
        })
}

//negative integers shrink
func growByPixels(pixels: CGFloat, seconds: Double, completion: () -> ()) {
    var f:CGRect = self.frame

    var newFrame:CGRect = CGRect(x: f.origin.x - pixels/2, y: f.origin.y - pixels/2,  width: f.size.width + pixels, height: f.size.height + pixels)

    self.morphToFrame(newFrame, seconds: seconds, completion: completion)
}

func setCornerRadius(radius: CGFloat, seconds: Double) {

    self.layer.masksToBounds = true

    var animation = CABasicAnimation(keyPath: "cornerRadius")
    animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionLinear)
    animation.fromValue = NSNumber(float: Float(self.layer.cornerRadius))
    self.layer.cornerRadius = radius
    animation.duration = seconds
    self.layer.addAnimation(animation, forKey: "cornerRadius")
}

I resizing my circle views like this:

- (void)resizeCircleView:(CGRect)frame {

    CGRect estimateFrame = frame;
    float duration = 1.0f;

    [UIView animateWithDuration:duration delay:0 options:UIViewAnimationOptionCurveLinear animations:^{
        [circle setFrame:estimateFrame];
    } completion:nil];

    CGFloat estimateCorner = estimateFrame.size.width / 2;
    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"cornerRadius"];
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    animation.fromValue = @(circle.layer.cornerRadius);
    animation.toValue = @(estimateCorner);
    animation.duration = duration;
    [circle.layer setCornerRadius:estimateCorner];
    [circle.layer addAnimation:animation forKey:@"cornerRadius"];
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM