在钟面上添加数字？

Question

我在objc.io上看到了这个时钟示例，我想将这些数字添加到钟面上。

http://www.objc.io/issue-12/animating-custom-layer-properties.html

因此，在 - （id）init {}方法中，我使用我在Internet上找到的公式添加了此代码：

    float Cx = self.bounds.size.width / 2;
    float Cy = self.bounds.size.height / 2;
    float Rx = 100;
    float Ry = 100;

    for (int i=1; i<=12; i++) {
        float theta = i / 12.0 * 2.0 * M_PI;
        float X = Cx + Rx * cos(theta);
        float Y = Cy + Ry * sin(theta);

        CATextLayer *aTextLayer = [[CATextLayer alloc] init];

        [aTextLayer setFont:@"Helvetica-Bold"];
        [aTextLayer setFontSize:20];
        [aTextLayer setFrame:CGRectMake(X, Y, 50, 20)];
        [aTextLayer setString:[NSString stringWithFormat:@"%d", i]];
        [aTextLayer setAlignmentMode:kCAAlignmentCenter];
        [aTextLayer setForegroundColor:[[UIColor greenColor] CGColor]];
        [self addSublayer:aTextLayer];

    }

出于某种原因，我的12点已经转移到3点。

有人能发现我做错了吗？

Answer 1

三角函数从正x轴向正y轴旋转。在CALayer中，正y是向下的，所以你的循环开始是3点钟，并且角度顺时针进行，这就是你想要它的时钟，与标准的工作方式相反（+ y == UP）笛卡尔飞机。

接下来需要注意的是，循环12个位置0..11并计算位置的小时和角度更简单。

最后，标签的框架设置为@ {50,20}的任意大小，文本居中，这可能是x偏移的原因。你希望计算出的x，y是标签的中心，所以你需要稍微捏一下这个来源......

for (int position=0; position <12; position ++) {
    int hour = (position+3) % 12;
    float theta = position / 6.0 * M_PI;

    float X = Cx + Rx * cos(theta);
    float Y = Cy + Ry * sin(theta);

    // X,Y calculated as you have done here should be the center of the layer
    // the quick fix is to subtract half the width and height to get the origin
    CGRect frame = CGRectIntegral(CGRectMake(X-25, Y-10, 50, 20));

    CATextLayer *aTextLayer = [[CATextLayer alloc] init];

    [aTextLayer setFont:@"Helvetica-Bold"];
    [aTextLayer setFontSize:20];
    [aTextLayer setFrame:frame];
    // note that we use "hour" here...
    [aTextLayer setString:[NSString stringWithFormat:@"%d", hour]];
    [aTextLayer setAlignmentMode:kCAAlignmentCenter];
    [aTextLayer setForegroundColor:[[UIColor greenColor] CGColor]];
    [self addSublayer:aTextLayer];
}

您可能会发现使用半径来定位这些标签会有所帮助，这些标签与用于绘制圆的半径不同。要将数字放在里面，请使用较小的半径，或使用较大的数字将它们绘制在填充的表盘之外。

Answer 2

从你的公式看起来，如果你交换了Cos和Sin然后否定了Cos术语，你可能会得到你正在寻找的东西。

编辑：意味着包括这个。我注意到他们也在你发布的一个代码行中的链接上做了这个，他们画了时钟指针是这样的：

CGContextAddLineToPoint(ctx, center.x + sin(angle) * 80, center.y - cos(angle) * 80);

看起来他们也交换了cos和罪，否定了cos术语