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

Question

我想画两条不同颜色的1px线双色线.我有很多代码,所以我在尝试解释之后就把它放了.

如果我使用的UIView drawRect方法它,当我关掉抗锯齿工作正常但是当我使用层的drawLayerInContext,要么显示一个简单的线,或者与关闭抗锯齿2px的的或两个半透明线与antialising上2px的2个平原线行.

我通过使用自定义上下文创建一个可以指定比例的图像,设法获得了与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();
}

用我的drawRect方法UIView得到这个:

| 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 |

在使用drawInContext的CALayer中,我得到了这些结果

| 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 |

使用我的自定义上下文我得到这个:

| 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 |

drawRect实施守则:

- (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

我建议不要绘制线条，而只绘制所需大小的填充矩形。具有不同分辨率的棘手部分之一是线的起点和终点的位置。但绘制矩形要容易得多。

矩形的坐标始终是偶数，因为您的目标是像素的边缘而不是中心。