使用NSString drawInRect绘制旋转的文本 [英] Drawing rotated text with NSString drawInRect

问题描述

我找到了关于如何使用NSString drawInRect：绘制旋转文本的答案，但我不确定它是如何工作的，因为它只对我有用： https://discussions.apple.com/thread/1779814?start=0&tstart=0

I found this answer on how to draw rotated text with NSString drawInRect:, but I'm not sure how it works since it only sort of works for me: https://discussions.apple.com/thread/1779814?start=0&tstart=0

我的代码如下：

           CGContextSaveGState(context);
           CGContextDrawLinearGradient(context, gradient, CGPointMake(0, centY - halfWidth), CGPointMake(0, centY + halfWidth), 0);

            // Add text                
            CGContextSetFillColorWithColor(context, [UIColor whiteColor].CGColor); 
            NSString *str = @"some test string";

            CGAffineTransform transform1 = CGAffineTransformMakeRotation(M_PI/4);

            CGContextConcatCTM(context, transform1);
            CGContextTranslateCTM(context, 0, 0);
            UIFont *font = [UIFont systemFontOfSize:16.0];

            [str drawInRect:CGRectMake(0, 0, 200, 100) withFont:font lineBreakMode:UILineBreakModeWordWrap alignment:UIBaselineAdjustmentNone];

因此，当我使用它时，我看到文本被绘制在x轴下方45度处。我想沿着lineargradient垂直绘制文本。所以我认为我可以通过使用M_PI / 2 90度来做到这一点。我没看到我的文字。我已经为旋转尝试了不同的变换，只有一些似乎像M_PI / 4和M_PI / 8一样工作。我认为如果我使用-M_PI / 4，它将使文本在x轴上方45度，而M_PI / 2将在x轴下方90度。但两者都没有出现。

So when I use this, I see text being drawn 45 degrees below the x-axis. I want to draw the text vertically along my lineargradient. So I thought I could do that by using M_PI/2 for 90 degrees. I do not see my text though. I have tried different transforms for the rotation, and only some seem to work like M_PI/4 and M_PI/8. I would think that if I used -M_PI/4 it would have the text 45 degrees above the x-axis and M_PI/2 would be 90 degrees below the x-axis. But both turn up with nothing.

有什么想法吗？谢谢。

推荐答案

我认为发生的事情是你将文本旋转到视图之外的位置，因为它旋转了通过在原点上旋转来实现上下文。

I think what's happening is that you're rotating the text to a location outside of the view because it rotates the context by pivoting on the origin.

旋转后，您需要进行翻译以将上下文移回视图。在下面的示例中，我将上下文逆时针旋转90度。然后我翻译上下文的tx高度的距离。

After your rotation you need to do a translation to move the context back into the view. In the example below, I rotate the context counterclockwise 90 degrees. Then I translate the tx of the context the distance of the height.

- (void)drawRect:(CGRect)rect
{
    CGContextRef context = UIGraphicsGetCurrentContext(); 

    CGContextSaveGState(context);

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();

    // Create the gradient 
    CGColorRef startColor = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:1.0].CGColor; 
    CGColorRef endColor = [UIColor colorWithRed:200.0/255.0 green:200.0/255.0 blue:200.0/255.0 alpha:1.0].CGColor;
    NSArray *colors = [NSArray arrayWithObjects:(id)startColor, (id)endColor, nil];
    CGFloat locations[] = { 0.0, 1.0 };
    CGGradientRef gradient = CGGradientCreateWithColors(colorSpace, (CFArrayRef) colors, locations);
    CGContextDrawLinearGradient(context, gradient, CGPointMake(rect.origin.x + rect.size.width / 2, rect.origin.y), CGPointMake(rect.origin.x + rect.size.width / 2, rect.origin.y + rect.size.height), 0);

    // Create text              
    CGContextSetFillColorWithColor(context, [UIColor blackColor].CGColor); 
    NSString *string = @"some test string";
    UIFont *font = [UIFont systemFontOfSize:16.0];

    // Rotate the context 90 degrees (convert to radians)
    CGAffineTransform transform1 = CGAffineTransformMakeRotation(-M_PI_2);
    CGContextConcatCTM(context, transform1); 

    // Move the context back into the view 
    CGContextTranslateCTM(context, -rect.size.height, 0);

    // Draw the string 
    [string drawInRect:rect withFont:font lineBreakMode:UILineBreakModeWordWrap alignment:UITextAlignmentLeft];

    // Clean up 
    CGGradientRelease(gradient);
    CGColorSpaceRelease(colorSpace);

    CGContextRestoreGState(context);
}

请注意，您还可以获得字符串呈现方式的大小，这有助于计算文本的对齐方式。

Note that you can also get the size of how the string will be rendered, which can help in doing calculations for the alignment of the text.

    CGSize stringSize = [string sizeWithFont:font]; 

这篇关于使用NSString drawInRect绘制旋转的文本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！