iOS計算控制點為貝塞爾曲線路徑曲線動畫給出兩點

Question

我正在嘗試使用CGPathAddCurveToPoint為視圖的移動設置動畫並生成bezier路徑，但是我無法找出原點和destionation之間的控制點。 你們中的任何人都知道如何在給定UIView的起源和位置的情況下動態計算控制點？

例如（iPad），我試圖動畫一只鳥（UIView）從點（455,482）飛到（31,100）。 我想成為鳥類飛行而不是直線運動的曲線運動。 我真的很感謝你的幫助。

謝謝你的答案，但仍然想知道如何計算控制點。

Answer 1

你能澄清一下你正在尋找的效果嗎？ 控制點的選擇不僅是起始坐標和結束坐標的函數，而且還是您嘗試實現的效果的函數。 在過去，我想要一個想要“拾取和放下”視圖的幻覺的圖像視圖的運動動畫，我在控制點上在相同的方向上做了輕微的垂直偏移，這產生了比動態稍微更動態的運動。一個純粹的線性運動，但它完全取決於你想要做什么。 我也做了這個，同時動畫放大然后恢復到變換比例的法線，進一步豐富了拾取和放下動畫視圖的錯覺。

在您修改后的答案中，您說要顯示鳥的飛行。 現在，這是一個令人着迷的問題。 從側面觀察鳥類的視野，例如從一個分支起飛到另一個分支，在這種情況下，您的控制點可能都會直接指向一點以顯示鳥類起飛和降落。 或者，如果您正在嘗試模擬拍打動作，您可能還有臨時向上控制點，每個拍打一個。 或者它是從下方還是上方觀察鳥類，在這種情況下，輕微的“s”形狀的飛行模式可能就足夠了，所以你只需要一個控制器指向從飛行路徑指向的起飛位置45度，並且最后的另一個控制點，朝向起點指向45度，但指向另一個方向。 這一切都取決於你正在尋找的效果，因為應用程序的理論是鳥類和觀眾在3d空間中的關系。

您可能需要顯示場景的屏幕快照和鳥的圖像（是從側面，還是從上方或下方）。 您可能還想繪制一個您正在設想的飛行模式的示例，也許我們可以提出其他更具體的建議。

其他資源：

順便說一句，有一些有趣的動畫演示可能會有所幫助。 例如， Mike Nachbaur的這款賽車動畫在我拍攝第一部動畫時非常有用，向我展示如何繪制bezier路徑，如何沿着路徑旋轉圖像等等。我知道這不是鳥的飛行，而是它仍然是說明性的。 我相信在線還有其他很好的例子。 無論如何，這些類型的教程可以幫助您彌合您的應用程序願景與bezier路徑之間的差距。

Answer 2

//Draw points
UIBezierPath *aPath = [UIBezierPath bezierPath];
[aPath setLineWidth: LINE_SIZE];
for (int i=0; i<[results count]; i++) {
    CGPoint endPt = [[results objectAtIndex: i] CGPointValue];
    if (i == 0) {
        [aPath moveToPoint:endPt];
    } else {
        //Previous (start) point
        CGPoint startPt =[[results objectAtIndex: i-1] CGPointValue];

        //Default control points
        CGPoint cPt1, cPt2;
        if(ABS(startPt.x - endPt.x) > ABS(startPt.y - endPt.y)) {
            cPt1 = (CGPoint){(startPt.x + endPt.x) / 2, startPt.y};
            cPt2 = (CGPoint){cPt1.x, endPt.y};
        } else {
            cPt1 = (CGPoint){startPt.x, (startPt.y + endPt.y) / 2};
            cPt2 = (CGPoint){endPt.x, cPt1.y};
        }

        //Add curve to end point
        [aPath addCurveToPoint: endPt controlPoint1: cPt1 controlPoint2: cPt2];
    }
}
[aPath stroke];