1

我想要的模式是汽车中的变速杆。它由大约 9 条 90 度角的直线组成,我需要用户沿着这些直线拖动 UIView。

我的第一种方法是检查视图中心的坐标,如果满足某些条件,则适当地启用/禁用 x/y。这导致了一个冗长复杂的 if 语句,维护起来会很麻烦。它在大多数情况下都有效 - 偶尔会卡住,但我知道我需要做些什么来修复它。

我的第二个想法是在我的路径周围构建一个非常简单的矩形集合,中间有一个足够宽的空间,以允许一个正方形,我将锚定到我想要移动的视图上。然后我就可以使用碰撞检测来保持沿路径的视图。这似乎适用于非常基本的块状路径,但不适用于更复杂的路径。

还有其他方法可以达到我想要的效果吗?

顺便说一句,这是我对第一个场景的超级粗略和低效的测试:

//  The reason we aren't using if else is because we want to allow both x and y movement if they are on a corner.
if(knob.center.x >= 218 && knob.center.x <= 240 && knob.center.y == 140) { 
    //  First line
    canMoveX = TRUE;
    if(translation.x + knob.center.x < 218) { 
        translation.x = knob.center.x - 218; 
    }
    else if(translation.x + knob.center.x > 240) { 
        translation.x = 240 - knob.center.x;
    }

}
if(knob.center.x == 240 && knob.center.y >= 140 && knob.center.y <= 230) { 
    //  Second Line
    canMoveY = TRUE;
    if(translation.y + knob.center.y < 140) { translation.y = knob.center.y - 140; }
    else if(translation.y + knob.center.y > 230) { translation.y = 230 - knob.center.y; }

}

if(knob.center.x >= 224 && knob.center.x <= 240 && knob.center.y == 230) { 
    //  Third Line
    canMoveX = TRUE;
    if(translation.x + knob.center.x < 224) { translation.x = knob.center.x - 224; }
    else if(translation.x + knob.center.x > 240) { translation.x = 240 - knob.center.x; }

} 

if(knob.center.x == 224 && knob.center.y >= 230 && knob.center.y <= 285) { 
    //  Fourth Line
    canMoveY = TRUE;
    if(translation.y + knob.center.y < 230) { translation.y = knob.center.y - 230; }
    else if(translation.y + knob.center.y > 285) { translation.y = 285 - knob.center.y; }

} 

if(knob.center.x >= 205  && knob.center.x <= 224 && knob.center.y == 285) { 
    //  Fifth Line
    canMoveX = TRUE;
    if(translation.x + knob.center.x < 205) { translation.x = knob.center.x - 205; }
    else if(translation.x + knob.center.x > 224) { translation.x = 224 - knob.center.x; }

}  

if(knob.center.x == 205 && knob.center.y >= 285 && knob.center.y <= 337) { 
    //  Sixth Line
    canMoveY = TRUE;
    if(translation.y + knob.center.y < 285) { translation.y = knob.center.y - 285; }
    else if(translation.y + knob.center.y > 337) { translation.y = 337 - knob.center.y; }

} 

if(knob.center.x >= 133 && knob.center.x <= 205 && knob.center.y == 337) { 
    //  Seventh Line
    canMoveX = TRUE;
    if(translation.x + knob.center.x < 133) { translation.x = knob.center.x - 133; }
    else if(translation.x + knob.center.x > 205) { translation.x = 205 - knob.center.x; }
}        

if(canMoveX) {
    [piece setCenter:CGPointMake([piece center].x + translation.x, [piece center].y)];
    [gesture setTranslation:CGPointZero inView:[piece superview]];
}
if(canMoveY) {
    [piece setCenter:CGPointMake([piece center].x, [piece center].y + translation.y)];
    [gesture setTranslation:CGPointZero inView:[piece superview]];
}
4

2 回答 2

2

是的,你可以在没有太多这些 if..elses 的情况下制作动画,你将不得不实现 Core Animation 的 CAKeyFrameAnimation 来描绘沿着 brezier path 的动画。

您将必须定义一条路径,并且为了查看我已经绘制了一条曲线来表示路径,然后是沿着路径动画的对象,最后是动画:-

     UIBezierPath *yourPath= [UIBezierPath bezierPath];
    [yourPath moveToPoint:P(x, y)];
    [yourPath addCurveToPoint:P(x1, y1) controlPoint1:P(x, y) controlPoint2:P(x, y)];
//You will have to use addCurveToPoint to add  next turn.

    CAShapeLayer *yourFollowPath= [CAShapeLayer layer];
    yourFollowPath.path = yourPath.CGPath;
    yourFollowPath.strokeColor = [UIColor redColor].CGColor;
    yourFollowPath.fillColor = [UIColor blackColor].CGColor;
    yourFollowPath.lineWidth = 50.0;
    [self.view.layer addSublayer:yourFollowPath];

    CALayer *moveObject= [CALayer layer];
    moveObject.bounds = CGRectMake(x, y, width, height);
    moveObject.position = P(objXPOs, objYPos);
    moveObject.contents = (id)([UIImage imageNamed:@"YouImageOfObjectToMove"].CGImage);
    [self.view.layer addSublayer:moveObject];

    CAKeyframeAnimation *animate = [CAKeyframeAnimation animationWithKeyPath:@"Animating"];
    animate .path = yourPath.CGPath;
    animate .rotationMode = kCAAnimationRotateAuto;
    animate .repeatCount = HUGE_VALF;
    animate .duration = 11;

[moveObjectaddAnimation:animate forKey:@"gogogo"];

这段代码仅供参考,给你一个想法,对于实际的程序,你必须给出坐标。

根据我们的讨论:-

您可以通过从对象处的用户获取接触点来实现上述代码的逻辑(因为您已经定义了路径)。您可以实现 UIGestureRecognizer 甚至 touchesBegan 或 UItouch 的 touchesEnded 以获取类似事件的拖动,然后动画如果用户仍在触摸 else 呼叫

[yourView.layer removeAllAnimations]; 

并获取最新的接触点,然后如果触摸恢复,则从该点创建另一个 brezierPath。

于 2012-05-17T11:46:04.073 回答
0

我无法找到完全解决我的问题的解决方案,所以我被迫使用条件和点。如果有人有更好的解决方案,我将非常乐意在未来将其标记为正确。

于 2012-05-30T02:11:30.400 回答