iphone - CALayer drawInContext 无法在视网膜显示器上绘制 1px 线

Question

我想用 2 种不同颜色的 1px 线条绘制双色线条。我有很多代码，所以我在尝试解释后将其放入。

如果我使用 uiview drawRect 方法，当我关闭抗锯齿时它工作正常，但是当我使用图层的 drawLayerInContext 时，它要么显示一条纯线，要么显示 2 条纯线关闭抗锯齿的 2px 或打开抗锯齿的两条 2px 半透明线。

我设法获得了与 UIView 的 drawRect 方法类似的行为，方法是创建一个带有自定义上下文的图像，我可以在其中指定比例:

UIGraphicsBeginImageContextWithOptions([self bounds].size, NO, 0.f); // 0.f for scale means "scale for device's main screen".

我只是想知道为什么我在 drawInContext 中没有得到相同的行为，以及是否有办法获得类似的行为。

这是绘制双色线的代码:

void DRAW_DOUBLE_LINE(CGContextRef ctx, CGPoint startPoint, CGPoint endPoint, UIColor* topColor, UIColor* bottomColor)
{
    UIGraphicsPushContext(ctx);

    UIBezierPath *topLine = [[UIBezierPath alloc] init];
    CGPoint topLineStartPoint = startPoint;
    CGPoint topLineEndPoint = endPoint;
    [topLine moveToPoint:topLineStartPoint];
    [topLine addLineToPoint:topLineEndPoint];
    [topColor setStroke];
    topLine.lineWidth = 0.5;
    [topLine stroke];

    UIBezierPath *bottomLine = [[UIBezierPath alloc] init];
    CGPoint bottomLineStartPoint = topLineStartPoint;
    bottomLineStartPoint.y +=0.5;
    CGPoint bottomLineEndPoint = topLineEndPoint;
    bottomLineEndPoint.y +=0.5;
    [bottomLine moveToPoint:bottomLineStartPoint];
    [bottomLine addLineToPoint:bottomLineEndPoint];
    [bottomColor setStroke];
    bottomLine.lineWidth = 0.5;
    [bottomLine stroke];

    UIGraphicsPopContext();
}

通过 UIView 的 drawRect 方法，我得到了这个:

| Points y coordinate | Antialiasing | Result                          || ------------------- | ------------ | ------------------------------- || 5                   | NO           | 2 lines of 1 px: Bingo!         || 5.25                | NO           | 2 lines of 1 px: Bingo!         || 5.5                 | NO           | 2 lines of 1 px: Bingo!         || 5                   | YES          | 3 half transparent lines of 1px || 5.25                | YES          | 2 lines of 1 px: Bingo!         || 5.5                 | YES          | 3 half transparent lines of 1px |

In a CALayer with drawInContext I get these results

| Points y coordinate | Antialiasing | Result                          || ------------------- | ------------ | ------------------------------- || 5                   | NO           | 2 lines of 2 px                 || 5.25                | NO           | 1 line of 2 px                  || 5.5                 | NO           | 1 line of 2 px                  || 5                   | YES          | 2 half transparent lines of 2px || 5.25                | YES          | 1 half transparent line of 2px  || 5.5                 | YES          | 2 half transparent lines of 2px |

Using my custom context I get this:

| Points y coordinate | Antialiasing | Result                          || ------------------- | ------------ | ------------------------------- || 5                   | NO           | 2 lines of 1 px: Bingo!        || 5.25                | NO           | 2 lines of 1 px: Bingo!        || 5.5                 | NO           | 2 lines of 1 px: Bingo!        || 5                   | YES          | 3 half transparent lines of 1px || 5.25                | YES          | 2 lines of 1 px: Bingo!        || 5.5                 | YES          | 3 half transparent lines of 1px |

Code for drawRect implementation:

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

    CGPoint startPoint = CGPointMake(0, 5);
    CGPoint endPoint = CGPointMake(CGRectGetMaxX(self.bounds),5);

    UIColor* topLineColor = [UIColor whiteColor];
    UIColor* bottomLineColor = [UIColor blackColor];

    DRAW_DOUBLE_LINE(context, startPoint, endPoint, topLineColor, bottomLineColor);
}

drawInContext 实现代码:

-(void)drawInContext:(CGContextRef)ctx{
    CGPoint startPoint = CGPointMake(0, 5);
    CGPoint endPoint = CGPointMake(CGRectGetMaxX(self.bounds),5);

    UIColor* topLineColor = [UIColor whiteColor];
    UIColor* bottomLineColor = [UIColor blackColor];

    DRAW_DOUBLE_LINE(ctx, startPoint, endPoint, topLineColor, bottomLineColor);
}

在 CALayer 的 display 方法中实现自定义上下文的代码:

-(void)display{

    if ([UIScreen instancesRespondToSelector:@selector(scale)]) {
        UIGraphicsBeginImageContextWithOptions([self bounds].size, NO, 0.f); // 0.f for scale means "scale for device's main screen".
    } else {
        UIGraphicsBeginImageContext([self bounds].size);
    }

    CGContextRef context = UIGraphicsGetCurrentContext();

    CGPoint startPoint = CGPointMake(0, 5.25);
    CGPoint endPoint = CGPointMake(CGRectGetMaxX(self.bounds),5.25);
    UIColor* topLineColor = [UIColor whiteColor];
    UIColor* bottomLineColor = [UIColor blackColor];

    DRAW_DOUBLE_LINE(ctx, startPoint, endPoint, topLineColor, bottomLineColor);

    UIImage *coloredImg = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    self.contents = (id)coloredImg.CGImage;
}

Answer 1

不要使用 0.5 作为宽度。

将 0.5 替换为 1.0/[UIScreen mainScreen].scale

当你在层上绘制时，你可以获得 1 像素宽的线。