web-dev-qa-db-ja.com

ポイントを中心に画像を確実に回転させるにはどうすればよいですか?

私は以下を読みました 点の周りの回転のためのワンステップアフィン変換?

CGAffineTransform transform = CGAffineTransformMakeTranslation(x, y);
transform = CGAffineTransformRotate(transform, a);
transform = CGAffineTransformTranslate(transform,-x,-y);

ただし、これを行うと、変換された画像はマップ全体に表示され、画面全体に表示されることはめったにありません。

画像を配置するシステムを作るために少し試しました。ループを実行して複数の値を配置すると、スパイラルが表示されます。しかし、最終的には画像の回転と回転させたい点との関係を解くことができるかもしれませんが、「ここに画像があります。この点はその点だと思います。中心;中心を中心にこの量だけ回転させたいが、他の方法では移動させたくない。」

http://JonathansCorner.com/ancient-clock/ の変更されたポートを作成しようとしていますが、現在、時針を配置しようとしています。上記の歌と踊りを行い、その中心が目的の中心になるように翻訳しようとする試みはすべて失敗しました。

この時計の針について、「次の回転の針が欲しい」と言って、中央に適切に配置するにはどうすればよいですか?

-編集-

コメントに応じてレイヤーを使用するために編集されたこのコードの重要な部分は次のとおりです。

UIImage *hourHandImage = [UIImage imageNamed:@"hour-hand.png"];
UIImageView *hourHandView = [[UIImageView alloc] initWithImage:hourHandImage];
float hourRotation = .5;
hourHandImage = [UIImage imageNamed:@"hour-hand.png"];
hourHandView = [[UIImageView alloc] initWithImage:hourHandImage];
CGAffineTransform transform = CGAffineTransformMakeTranslation(centerX - 21, -centerY - 121);
// transform = CGAffineTransformRotate(transform, hourRotation);
// transform = CGAffineTransformTranslate(transform, 2 * centerX, 2 * centerY);
hourHandView.transform = transform;
hourHandView.layer.anchorPoint = CGPointMake(centerX, centerY);
hourHandView.layer.affineTransform = CGAffineTransformRotate(transform, hourRotation);
[self.view addSubview:hourHandView];

ありがとう、

-編集-

私は今、何かを減らしました。いくつかの指示に従うと、次のようになります。

CGAffineTransform transform = CGAffineTransformMakeTranslation(100 -21, 100 -121);
transform = CGAffineTransformRotate(transform, hour / 12.0 * M_PI * 2.0);
transform = CGAffineTransformTranslate(transform, -330, 330);
hourHandView.transform = transform;

それらの数字を出す作業をしたいのですが、これは9:00の時間が正しく表示されています。

あなたのすべての協力に感謝します!

11

この行:

CGAffineTransform transform = CGAffineTransformMakeTranslation(x, y);

画像をx、yだけ移動します。

(注-設定したコントロールポイントを中心に回転します)

この行:

transform = CGAffineTransformRotate(transform, a);

コントロールポイントを中心に回転させます。

コントロールポイントが左上隅(デフォルト)にある場合、コントロールポイントは左上隅を中心に回転します。

これを設定する必要があります:

[self layer].anchorPoint = CGPointMake(0.5, 0.5);

レイヤーの中心を中心に回転させます。

10
HalR

回転は常に(0,0)を中心に行われます。

ポイントを中心に移動するには、最初に回転ポイントを(0,0)に変換してから回転させてから、元に戻す必要があります。

したがって、次のようになります。

// cx, cy is center of screen
// move (cx,cy) to (0,0)  
CGAffineTransform transform = CGAffineTransformMakeTranslation(-cx, -cy);

// roate around (0,0)  
transform = CGAffineTransformRotate(transform, angleRadians);

// mov e (0,0) back to (cx,cy)  
transform = CGAffineTransformTranslate(transform,cx,cy);
12
AlexWien
hourImageView.layer.anchorPoint = CGPointMake(0.5f, 0.9f);
CGFloat angle = hour / 12.0 * M_PI * 2.0;
hourHand.transform = CGAffineTransformMakeRotation(angle);
7
Jano

アレックスの答えからのスウィフト5バージョン

回転は常に(0,0)を中心に行われます。

ポイントを中心に移動するには、最初に回転ポイントを(0,0)に変換してから回転させてから、元に戻す必要があります。

したがって、次のようになります。

// centerX, centerY is center of screen
// move (centerX,centerY) to (0,0)  
var myTransform = CGAffineTransform(translationX: -centerX, y: -centerY)

// rotate around (0,0)  
myTransform = myTransform.concatenating(CGAffineTransform(rotationAngle: angleInRadians))

// move (0,0) back to (cx,cy)  
myTransform = myTransform.concatenating(CGAffineTransform(translationX: centerX, y: centerY))

myView.transform = myTransform
1
Aaron Halvorsen