使用贝塞尔曲线将图像移动 90 度答案

【问题标题】：Move image 90 degree using Bezier curve使用贝塞尔曲线将图像移动 90 度
【发布时间】：2015-02-18 06:50:05
【问题描述】：

我是 iOS 新手，请有人帮助我使用贝塞尔曲线沿 90 度路径移动图像。我已经搜索过，但我的疑问还不清楚，所以请帮助我。

我已经尝试过这段代码，但我想使用贝塞尔曲线。

- (void)startApp {
  UIImageView *imageToMove =
      [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"man.jpg"]];
  imageToMove.frame = CGRectMake(10, 10, 100, 100);
  [self.view addSubview:imageToMove];

  // Move the image
  [self moveImage:imageToMove
         duration:1.0
            curve:UIViewAnimationCurveLinear
                x:70.0
                y:70.0];
}

- (void)moveImage:(UIImageView *)image
         duration:(NSTimeInterval)duration
            curve:(int)curve
                x:(CGFloat)x
                y:(CGFloat)y {
  // Setup the animation
  [UIView beginAnimations:nil context:NULL];
  [UIView setAnimationDuration:duration];
  [UIView setAnimationCurve:curve];
  [UIView setAnimationBeginsFromCurrentState:YES];

  // The transform matrix
  CGAffineTransform transform = CGAffineTransformMakeTranslation(x, y);
  image.transform = transform;

  // Commit the changes
  [UIView commitAnimations];
}

【问题讨论】：

stackoverflow.com/questions/1142727/… 看到这里已经回答了

标签： ios uiimageview uibezierpath cgaffinetransform

【解决方案1】：

您也可以使用CABasicAnimation 旋转（转换）视图。我为此做了一些计算。

- (void) rotateAnimation {

    CABasicAnimation *topAnimation = [CABasicAnimation animationWithKeyPath:@"transform"];
    topAnimation.autoreverses = NO;
    topAnimation.duration = 0.8;
    topAnimation.repeatDuration = 0;
    topAnimation.toValue = [NSValue valueWithCATransform3D:CATransform3DPerspect(CATransform3DMakeRotation(M_PI, 1, 0, 0), CGPointMake(0, 0), 400)];
    [image.layer addAnimation:topAnimation forKey:nil];
}

该轮换的支持方法如下：

CATransform3D CATransform3DMakePerspective(CGPoint center, float disZ)
{
    CATransform3D transToCenter = CATransform3DMakeTranslation(-center.x, -center.y, 0);
    CATransform3D transBack = CATransform3DMakeTranslation(center.x, center.y, 0);
    CATransform3D scale = CATransform3DIdentity;
    scale.m34 = -1.0f/disZ;
    return CATransform3DConcat(CATransform3DConcat(transToCenter, scale), transBack);
}

CATransform3D CATransform3DPerspect(CATransform3D t, CGPoint center, float disZ)
{
    return CATransform3DConcat(t, CATransform3DMakePerspective(center, disZ));
}

关于旋转是在相应层的 X 轴（水平）上。您可以在rotateAnimation 的下方将轴值更改为 Y 和 Z。

CATransform3DMakeRotation(M_PI, 1, 0, 0), CGPointMake(0, 0), 400)]

通过将上述代码中的1, 0, 0 值更改为0, 1, 0，将更改 Y 轴的旋转，Z 轴的旋转也类似。替换值并寻找您喜欢的旋转。

【讨论】：

【解决方案2】：

这是我的带有名为 drawPad 的 IBOutlet 的 UIImageView。

UIBezierPath *path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(150, 150)
radius:100
startAngle:0
endAngle:(22.0f/7.0f)
clockwise:YES];

UIGraphicsBeginImageContext(self.view.frame.size);

path.lineCapStyle = kCGLineCapRound;
path.lineWidth = 10.0f;

[[UIColor blackColor] setStroke];
[path stroke];

self.drawpad.image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

【讨论】：