CGAffineTransform을 사용한 이상한 결과

Question

CGAffineTransforms과 CGAffineTransformConcats을 사용하여 애니메이션을 함께 묶어 봅니다. 제가 이루고자하는 전반적인 목표는 이미지를 45도 회전시키고 50 픽셀 위로 이동 한 다음 다시 45도 회전시킵니다.

CGAffineTransform translateUp = CGAffineTransformMakeTranslation(0, -50); 
    CGAffineTransform firstSpin = CGAffineTransformMakeRotation(M_PI_4); 
    CGAffineTransform translateDown = CGAffineTransformMakeTranslation(0, 50); 
    CGAffineTransform secondSpin = CGAffineTransformMakeRotation(M_PI_4); 
    CGAffineTransform transform1 = CGAffineTransformConcat(translateUp, firstSpin); 
    CGAffineTransform transform2 = CGAffineTransformConcat(translateDown, secondSpin); 
    CGAffineTransform transformFull = CGAffineTransformConcat(transform1, transform2);  
    [UIView beginAnimations:@"MoveAndRotate" context:nil]; 
    [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; 
    [UIView setAnimationDuration:0.5]; 
    mainCharacterImage.transform = transformFull; 
    [UIView commitAnimations]; 

이제 모든 CG 관련성에 대해 처음 접해 보니 마음에 들지만 왜 이것이 작동하지 않는지 이해할 수 없습니다.

그러나 나는 이상한 부분으로 작동하지 않는다는 사실을 고려하지 않습니다. 제 질문은 주로 위의 코드가 내 이미지를 위로 이동시키고 회전시키지 않는 이유를 설명 할 수 있습니까? , 오른쪽으로 약 100 픽셀 이동하려면?

모든 의견을 보내 주시면 대단히 감사하겠습니다.

Answer 1

transformFull은 ((translateUp * firstSpin) * (translateDown * secondSpin))의 행렬 곱셈 결과입니다. 애니메이션이 될 일이 행렬 곱을 계산의 결과 시점에서 직접 진행한다 :

는

0, 1, 0 
-1, 0, 0 
50 - 25 * sqrt(2), 25 * sqrt(2), 1 

이 변환 행렬은 오른쪽으로 100 개 픽셀에 대해 항목을 이동 일어난다.

변환 매트릭스에는 히스토리가 없습니다. 그것은 그 단계에서 어떤 단계를 통해 그 가치를 얻었는지 알 수 없으며 그 단계를 따라 나아갈 수 없습니다. 대신 의도적으로 각 단계로 이동해야합니다. 이 애니메이션을 두 단계로 해보십시오. mainCharacterImage을 transform1으로 옮깁니다. 그런 다음 π/2의 회전 인 새로운 변환으로 이동하십시오.