Why are my lines getting fatter and fatter?

I am trying to draw multiple lines with different colors.

This code tries to draw two rectangles with 1px thin lines. However, the second rectangle is drawn with lines 2px wide, and the first one is drawn with 1px wide.

- (void)addLineFrom:(CGPoint)p1 to:(CGPoint)p2 context:(CGContextRef)context {  
    // set the current point
    CGContextMoveToPoint(context, p1.x, p1.y);

    // add a line from the current point to the wanted point
    CGContextAddLineToPoint(context, p2.x, p2.y);
}


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

    CGPoint from, to;



    // ----- draw outer black frame (left, bottom, right) -----
    CGContextBeginPath(context);

    // set the color
    CGFloat lineColor[4] = {26.0f * colorFactor, 26.0f * colorFactor, 26.0f * colorFactor, 1.0f};
    CGContextSetStrokeColor(context, lineColor);

    // left
    from = CGPointZero;
    to = CGPointMake(0.0f, rect.size.height);
    [self addLineFrom:from to:to context:context];

    // bottom
    from = to;
    to = CGPointMake(rect.size.width, rect.size.height);
    [self addLineFrom:from to:to context:context];

    // right
    from = to;
    to = CGPointMake(rect.size.width, 0.0f);
    [self addLineFrom:from to:to context:context];

    CGContextStrokePath(context);
    CGContextClosePath(context);



    // ----- draw the middle light gray frame (left, bottom, right) -----

    CGContextSetLineWidth(context, 1.0f);
    CGContextBeginPath(context);

    // set the color
    CGFloat lineColor2[4] = {94.0f * colorFactor, 94.0f * colorFactor, 95.0f * colorFactor, 1.0f};
    CGContextSetStrokeColor(context, lineColor2);

    // left
    from = CGPointMake(200.0f, 1.0f);
    to = CGPointMake(200.0f, rect.size.height - 2.0f);
    [self addLineFrom:from to:to context:context];

    // bottom
    from = to;
    to = CGPointMake(rect.size.width - 2.0f, rect.size.height - 2.0f);
    [self addLineFrom:from to:to context:context];

    // right
    from = to;
    to = CGPointMake(rect.size.width - 2.0f, 1.0f);
    [self addLineFrom:from to:to context:context];

    // top
    from = to;
    to = CGPointMake(1.0f, 1.0f);
    [self addLineFrom:from to:to context:context];

    CGContextStrokePath(context);
}

      

+2


a source to share


2 answers


If memory is being used, anti-aliasing is added by default, which can cause your drawing to affect more pixels than you intend. Disable anti-aliasing for yours CGContextRef

and see if that helps.

IOS:

CGContextRef context = UIGraphicsGetCurrentContext();
[context setShouldAntialias:NO];

      



Mac:

CGContextRef context = [NSGraphicsContext currentContext];
[context setShouldAntialias:NO];

      

+2


a source


The first one seems to be a single pixel, because you drew it around the perimeter of a dirty rectangle that UIView clipped for you, making it an internal bump. But essentially both rectangles have the same problem .



For another question, I wrote a full description of the real problem and real solutions . Turning off AA will be enough for straight lines, but you'll hate it as soon as you draw a twist or draw a diagonal.

+1


a source







All Articles