0

ホイールの周囲にある画像/ラベルを水平に保ち、ホイールと一緒に回転しないようにする必要があることを除いて、フォーチュンタイプのホイールのホイールを実装する方法の解決策を探していました(うまく機能しています)。以下を実装しましたが、ラベル (この場合は赤い楕円) が水平に保たれません。

ホイールがどこを回転しても、常にこのように見えるはずです。

ここに画像の説明を入力

画面に赤い楕円を作成するコードを同封しています。

CGFloat cita = 0;
for(int i = 1; i < 2; ++i)
{
    CGFloat smallCircleRadius = bigCircleRadius / 8.0;
    for (int i = 0; i < 8; i++)
    {

        CGPoint smallCircleCenter = CGPointMake(wheelCenter.x  + bigCircleRadius * cos(cita) - smallCircleRadius/2.0 , wheelCenter.y + bigCircleRadius * sin(cita) - smallCircleRadius / 2.0 );


        CGRect smallCircleRect = CGRectMake(smallCircleCenter.x,smallCircleCenter.y,smallCircleRadius * 2,smallCircleRadius);

        cita += M_PI / 4.0;

        CAShapeLayer *l = [CAShapeLayer layer];
        UIBezierPath * p1 = [UIBezierPath bezierPathWithOvalInRect:smallCircleRect];

        l.path = p1.CGPath;
        l.strokeColor = [[UIColor redColor] CGColor];
        l.fillColor = [[UIColor redColor] CGColor];
        l.lineWidth = 3.0;

        l.anchorPoint = CGPointMake(.5, .5);

        [self.emoticonsArray addObject:l];

        [self.baseWheel.layer addSublayer:l];

      }

   }

以下は、ホイールを回転させる関数です。ラベルのローテーションを行うコード行を作成しています - 明らかにここで何か間違ったことをしていますが、何が何なのかわかりません。どんなガイダンスでも大歓迎です。

-(void)spin:(double)delta
{
currentAngle = currentAngle + delta;

CATransform3D transform = CATransform3DMakeRotation(currentAngle, 0, 0, 1);

[self.baseWheel.layer setTransform:transform];

  // rotate the red labels here.
  for (CAShapeLayer * l in self.emoticonsArray)
  {

    CGPoint miniWheelCenter = [l convertPoint:l.position toLayer:self.baseWheel.layer.superlayer];


    // !! something wrong here!! but what? 
    CATransform3D t_l = CATransform3DMakeRotation(-currentAngle, miniWheelCenter.x/2, miniWheelCenter.y/2, 1);
    [l setTransform:t_l];
  }
}
4

3 に答える 3

0

この問題を解決する別の方法は、ホイールのサブビューとしてラベルを使用しないことです。ホイールの上に置くだけです。したがって、ホイールが回転すると、ラベルは同じ場所に配置されます。よくわからない場合はお知らせください

編集

問題の代替ソリューションを次に示します。完璧ではありませんが、考えるための新しい方向性を与えるかもしれません。

  1. 車輪の画像をpng形式で取得します。
  2. ホイールの背景を透明にします。（必要ありません..美化するだけです）
  3. ラベルを表示するホイールの位置に穴を開けます。（穴とは、その部分を透明にすることを意味していました）。
  4. 次に、ラベルをホイールの後ろに置きます。必要な回転角度に従って配置します。
  5. ホイールを正確な角度で回転させると、ラベルが表示されます。紙を2枚重ねたようなものです。

完璧ではない理由 ラベルはホイールで移動しません。したがって、特定の角度でのみラベルを見ることができます。

あなたの質問の要件の背後にある正確な目的はわかりませんが、このアプローチを使用してアプリのジョグダイヤルを作成しました..

于 2014-01-21T20:18:50.143 に答える