如何使CATextLayer中的文本清晰 [英] How to get text in a CATextLayer to be clear

查看:149
本文介绍了如何使CATextLayer中的文本清晰的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我使用添加的 CATextLayer 制作了 CALayer ,文字模糊不清。在文档中,他们谈论亚像素抗锯齿,但这对我来说并不重要。任何人都有一个代码片段,使用一些明确的文字制作 CATextLayer

I've made a CALayer with an added CATextLayer and the text comes out blurry. In the docs, they talk about "sub-pixel antialiasing", but that doesn't mean much to me. Anyone have a code snippet that makes a CATextLayer with a bit of text that is clear?

这是来自的文字Apple的文档:

Here's the text from Apple's documentation:


注意:CATextLayer在渲染文本时禁用子像素抗锯齿。
文本只能使用子像素抗锯齿来绘制,当
复合到现有的不透明背景中时,它会被
光栅化。
本身无法绘制亚像素抗锯齿文本,无论是图像还是图层,分别在
之前单独使用背景像素编织文本像素。将
图层的opacity属性设置为YES不会更改渲染
模式。

Note: CATextLayer disables sub-pixel antialiasing when rendering text. Text can only be drawn using sub-pixel antialiasing when it is composited into an existing opaque background at the same time that it's rasterized. There is no way to draw subpixel-antialiased text by itself, whether into an image or a layer, separately in advance of having the background pixels to weave the text pixels into. Setting the opacity property of the layer to YES does not change the rendering mode.

第二句暗示如果一个将 c>复制到现有的不透明背景,并且它被光栅化的话,就可以获得好看的文本。那很好,但我如何组合它,你如何给它一个不透明的背景,你如何光栅化它?

The second sentence implies that one can get good looking text if one composites it into an existing opaque background at the same time that it's rasterized. That's great, but how do I composite it and how do you give it an opaque background and how do you rasterize it?

他们在他们的例子中使用的代码Kiosk菜单是这样的:(它是OS X,而不是iOS,但我认为它有效!)

The code they use in their example of a Kiosk Menu is as such: (It's OS X, not iOS, but I assume it works!)

NSInteger i;
for (i=0;i<[names count];i++) {
    CATextLayer *menuItemLayer=[CATextLayer layer];
    menuItemLayer.string=[self.names objectAtIndex:i];
    menuItemLayer.font=@"Lucida-Grande";
    menuItemLayer.fontSize=fontSize;
    menuItemLayer.foregroundColor=whiteColor;
    [menuItemLayer addConstraint:[CAConstraint
         constraintWithAttribute:kCAConstraintMaxY
                      relativeTo:@"superlayer"
                       attribute:kCAConstraintMaxY
                          offset:-(i*height+spacing+initialOffset)]];
    [menuItemLayer addConstraint:[CAConstraint
         constraintWithAttribute:kCAConstraintMidX
                      relativeTo:@"superlayer"
                       attribute:kCAConstraintMidX]];
    [self.menuLayer addSublayer:menuItemLayer];
} // end of for loop 

谢谢!

编辑:添加我实际使用的代码会导致文本模糊。这是我发布的关于添加 UILabel 而不是 CATextLayer 的相关问题,而是获得了一个黑盒子。 http://stackoverflow.com/questions/3818676/adding-a-uilabels-layer-to-a-calayer-and-it-just-shows-black-box

Adding the code that I actually used that resulted in blurry text. It's from a related question I posted about adding a UILabel rather than a CATextLayer but getting a black box instead. http://stackoverflow.com/questions/3818676/adding-a-uilabels-layer-to-a-calayer-and-it-just-shows-black-box

CATextLayer* upperOperator = [[CATextLayer alloc] init];
CGColorSpaceRef space = CGColorSpaceCreateDeviceRGB();
CGFloat components1[4] = {1.0, 1.0, 1.0, 1.0};
CGColorRef almostWhite = CGColorCreate(space,components1);
CGFloat components2[4] = {0.0, 0.0, 0.0, 1.0};
CGColorRef almostBlack = CGColorCreate(space,components2);
CGColorSpaceRelease(space);
upperOperator.string = [NSString stringWithFormat:@"13"];
upperOperator.bounds = CGRectMake(0, 0, 100, 50);
upperOperator.foregroundColor = almostBlack;
upperOperator.backgroundColor = almostWhite;
upperOperator.position = CGPointMake(50.0, 25.0);
upperOperator.font = @"Helvetica-Bold";
upperOperator.fontSize = 48.0f;
upperOperator.borderColor = [UIColor redColor].CGColor;
upperOperator.borderWidth = 1;
upperOperator.alignmentMode = kCAAlignmentCenter;
[card addSublayer:upperOperator];
[upperOperator release];
CGColorRelease(almostWhite);
CGColorRelease(almostBlack);






编辑2:请参阅下面的答案解决了sbg。


EDIT 2: See my answer below for how this got solved. sbg.

推荐答案

简答 - 你需要设置内容缩放:

Short answer — You need to set the contents scaling:

textLayer.contentsScale = [[UIScreen mainScreen] scale];






前一段时间我了解到当你有自定义时绘图代码,您必须检查视网膜显示并相应地缩放图形。 UIKit 负责大部分工作,包括字体缩放。


A while ago I learned that when you have custom drawing code, you have to check for the retina display and scale your graphics accordingly. UIKit takes care of most of this, including font scaling.

使用 CATextLayer不是这样。

我的模糊来自于 .zPosition 并非零,是的,我有一个转换应用于我的父层。通过将此设置为零,模糊性消失,并被严重的像素化取代。

My blurriness came from having a .zPosition that was not zero, that is, I had a transform applied to my parent layer. By setting this to zero, the blurriness went away, and was replaced by serious pixelation.

搜索高低后,我发现你可以设置 .contentsScale 对于 CATextLayer ,您可以将其设置为 [[UIScreen mainScreen] scale] 匹配屏幕分辨率。 (我认为这适用于非视网膜,但我没有检查 - 太累了)

After searching high and low, I found that you can set .contentsScale for a CATextLayer and you can set it to [[UIScreen mainScreen] scale] to match the screen resolution. (I assume this works for non-retina, but I haven't checked - too tired)

包含这个为我的 CATextLayer 文字变得清脆。注意 - 父图层没有必要。

After including this for my CATextLayer the text became crisp. Note - it's not necessary for the parent layer.

模糊不清?当你在3D中旋转时它会回来,但是你没有注意到它,因为文本开始时是清晰的,当它处于运动状态时,你无法分辨。

And the blurriness? It comes back when you're rotating in 3D, but you don't notice it because the text starts out clear and while it's in motion, you can't tell.

问题解决了!

这篇关于如何使CATextLayer中的文本清晰的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆