Question

我有以下屏幕：

enter image description here

当我点击获取更多按钮时，它将添加新的圆形按钮。我在UIView添加了Pan Gesture，其中添加了所有圆形按钮，然后仅从圆形按钮中绘制UIBezierPath。到目前为止，一切正常。

现在，我想要以下内容：

我有一个名为playGroundView的父UIView，其中包含所有圆形按钮。这将为所有这些按钮绘制Bezier路径。
为所有按钮绘制Bezier路径后，单击“移动按钮”立即为所有圆形按钮设置动画。
有一次，所有按钮都在Bezier路径的终点移动，然后我可以再次绘制Bezier路径（为圆形按钮添加更多步骤）连接到相同按钮的相同路径。
此后，“最终移动”按钮将同时为同一个按钮设置整体动画。

请参阅PlayGround UIView子类的以下代码：

@interface PlayGroundView : UIView
@property (nonatomic, weak) PlayGroundViewController *playViewController;
@end

#import "PlayGroundView.h"
#import "RoundedButton.h"
#import "PlayGroundViewController.h"

@interface PlayGroundView () {
    UIBezierPath *path;
    BOOL isDrawPointInside;
}

@end

@implementation PlayGroundView

#pragma mark - View Methods -
- (id)initWithCoder:(NSCoder *)aDecoder {
    if (self = [super initWithCoder:aDecoder])
        [self commonInit];
    return self;
}

- (id)initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame])
        [self commonInit];
    return self;
}

- (void)drawRect:(CGRect)rect {
    [[UIColor redColor] setStroke];
    [path stroke];
}

#pragma mark - Action Methods -
- (void)pan:(UIPanGestureRecognizer *)pan {
    CGPoint currentPoint = [pan locationInView:self];
    //    NSLog(@"currentPoint: %@", NSStringFromCGPoint(currentPoint));
    if (pan.state == UIGestureRecognizerStateBegan) {
        NSMutableArray *buttonAry = [NSMutableArray array];
        buttonAry = self.playViewController.rBtnOpponentPlayerList;
        [buttonAry addObjectsFromArray:self.playViewController.rBtnPlayerList];
        for (int i=0; i<buttonAry.count; i++) {
            UIButton *btn = [buttonAry objectAtIndex:i];
            CGRect nearByRect = CGRectMake(btn.frame.origin.x - 20, btn.frame.origin.y - 20, btn.frame.size.width + 40, btn.frame.size.height + 40);
            if (CGRectContainsPoint(nearByRect, currentPoint)) {
                isDrawPointInside = YES;
                [path moveToPoint:btn.center];
                //                NSLog(@"point is inside....");
            }
        }
    }
    if (pan.state == UIGestureRecognizerStateChanged) {
        if (isDrawPointInside) {
            [path addLineToPoint:currentPoint];
            [self setNeedsDisplay];
        }
    }

    if (pan.state == UIGestureRecognizerStateEnded) {
        isDrawPointInside = NO;
        //        NSLog(@"pan ended");
    }
}

#pragma mark - Helper Methods -
- (void)commonInit {
    path = [UIBezierPath bezierPath];
    path.lineWidth = 3.0;

    // Capture touches
    UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(pan:)];
    pan.maximumNumberOfTouches = pan.minimumNumberOfTouches = 1;
    [self addGestureRecognizer:pan];

    // Erase with long press
    [self addGestureRecognizer:[[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(erase)]];
}

- (void)erase {
    path = [UIBezierPath bezierPath];
    path.lineWidth = 3.0;

    [self setNeedsDisplay];
}

@end

我仍然无法管理所有Rounded Button状态。让我知道在移动时管理圆形按钮的所有步骤的最佳方法。

我提到过：http://nachbaur.com/blog/core-animation-part-4

我的完整演示代码位于：https://www.dropbox.com/s/f0ri0bff8ioxtpz/FreeHandDrawingDemo%202.zip?dl=0

Answer 1

我假设，当你说'＃34;管理所有圆形按钮状态＆＃34;时，你的意思是你想要知道视图已经开始制作动画，比如{{1} }回调:)如果是这样的话，据我所知，CA框架中没有实现的方法。但是，请看一下这个问题：Core animation progress callback这是一种方法，可以做一个看起来很漂亮的解决方法，也许你可以从这里开始做一些工作。

哦，有一件事。我看到你正在使用Pan手势识别器。我只是浏览了你的代码和目标。（另一个线程中的人;））但我认为他正在使用viewHasMovedABitAutomatically来检查正在绘制的图层。如果您的视图是可拖动的，这也可能会触发，如果是这种情况，请考虑在pan方法上使用一些drawInContext标志，并在回调中检查它。

编辑：对不起，这似乎与您的实际问题无关。我明白你的意思是控制动画速度，以便它们都相应地移动。让我们详细说明一下。

据我所知，没有像动画这样的东西＆＃34; step＆＃34;。动画图像将其向左移动20个像素并不一定意味着图像将被重绘20次。图像将根据需要进行多次渲染，因此我们无法依靠渲染方法来计算图像。据我所知，控制动画速度的唯一方法是通过viewIsBeingDragged的{{1}}参数。你不知道持续时间，你想让速度保持不变，所以持续时间就是它所需要的。

基本物理：持续时间等于距离除以速度，因此如果我们需要覆盖距离，我们可以轻松计算动画持续时间。起初我以为可能UIBezierPath有一个方法或属性来计算总长度，但我错了。但是，在这个线程Get CGPath total length中有一个通过数值积分计算它的代码，你应该测试它以查看它是否有效。一旦你拥有它，你可以做这样的事情（我没有测试它，我只是进入伪代码）

duration

像这样的东西。 animateWithDuration:是上述主题中的方法，假设它有效，#define SPEED_CALIBRATION 30.0 // or whatever -(void)animateView:(UIView*)view withBezierPath:(UIBezierPath*)path { CGFloat distance = [self getBezierPathDistance:path]; CGFloat duration = distance / SPEED_CALIBRATION; [self animateView:view withDuration:duration andBezierPath:path]; }是使用CA文档执行非线性动画的方法（我不记得所有细节，但我记得这是一段很长的代码;））。

如果答案有点模糊，我很抱歉，让我们希望它有所帮助！

Answer 2

为了实现这些目标，我使用了UIBezierPath + Points类别。除此之外，在我的代码中使用了以下类和逻辑：

在PlayGroundView中，我在drawRect方法中编辑了代码，其余代码相同：

- (void)drawRect:(CGRect)rect {
    [[UIColor redColor] setStroke];
    for (int i=0; i<[self subviews].count; i++) {
        RoundButton *tmpPlayerButton = [self.subviews objectAtIndex:i];
        for (UIBezierPath *bezierPath in tmpPlayerButton.allPathsOfPlayer) {
            [bezierPath strokeWithBlendMode:kCGBlendModeNormal alpha:1.0];
        }
    }
    [path stroke];
}

在我的ViewController类中，在下面的Get More Buttons中，代码为：

- (IBAction)getBallPressed:(id)sender {
    [self moveBalls];

//    self.playView.viewController = self;

    int xPos = self.view.frame.size.width-30;
    int yPos = self.view.frame.size.height-30;
    int btnXPos = arc4random_uniform(xPos);
    int btnYPos = arc4random_uniform(yPos);

    RoundButton *newButton = [[RoundButton alloc] initWithFrame:CGRectMake(btnXPos, btnYPos, 30, 30)];
    [newButton setBackgroundColor:[UIColor redColor]];
    newButton.layer.cornerRadius = newButton.frame.size.height/2;
    [newButton setTitle:[self randomStringWithLength:1] forState:UIControlStateNormal];

    UILongPressGestureRecognizer *longGesture = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(longGestureRecognized:)];
    [newButton addGestureRecognizer:longGesture];

    [self.playView.playerArray addObject:newButton];
    [self.playView addSubview:newButton];
}

- (void)moveBalls {
    for (int i=0; i<[self.playView subviews].count; i++) {
        RoundButton *playerButton = [self.playView.subviews objectAtIndex:i];
        if (playerButton.isEditPath) {
            id point = [[[playerButton.allPathsOfPlayer lastObject] points] lastObject];
            CGPoint lastPoint = [point CGPointValue];
            NSLog(@"lastPoint: %@", NSStringFromCGPoint(lastPoint));
            [playerButton setCenter:lastPoint];
        }
    }
}

在移动按钮中，下面的代码进入，这允许我同时移动我的所有圆形按钮，这是我的确切要求：

- (void)playAnimation {
    for (int i=0; i<self.playView.subviews.count; i++) {
        //Prepare the animation - we use keyframe animation for animations of this complexity
        CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:@"position"];
        //Set some variables on the animation
        pathAnimation.calculationMode = kCAAnimationPaced;

        //We want the animation to persist - not so important in this case - but kept for clarity
        //If we animated something from left to right - and we wanted it to stay in the new position,
        //then we would need these parameters
        pathAnimation.fillMode = kCAFillModeForwards;
        pathAnimation.removedOnCompletion = NO;
        pathAnimation.duration = 2.0;
        pathAnimation.repeatCount = 0;

        RoundButton *tmpRoundButton;
        UIBezierPath *path;

        tmpRoundButton = [self.playView.subviews objectAtIndex:i];

        for (int j=0; j<tmpRoundButton.allPathsOfPlayer.count; j++) {
            if (path)
                [path appendPath:[tmpRoundButton.allPathsOfPlayer objectAtIndex:j]];
            else
                path = [tmpRoundButton.allPathsOfPlayer objectAtIndex:j];

            //Now we have the path, we tell the animation we want to use this path - then we release the path
            pathAnimation.path = [path CGPath];
            [tmpRoundButton.layer addAnimation:pathAnimation forKey:@"moveTheSquare"];
        }
        [path moveToPoint:[[[path points] firstObject] CGPointValue]];
    }
    [self.playView setNeedsDisplay];
}

Answer 3

let playerController = AVPlayerViewController()
    playerController.delegate = self
    player = AVPlayer(url: url as URL)
    playerController.player = player
    self.addChildViewController(playerController)
    self.videoview.addSubview(playerController.view)
    playerController.view.frame = self.videoview.bounds
    player.play()

使用UIBezierPath的多个UIView动画

3 个答案: