ширина линии в другой угол

Question

рисую линии, как это:

- (void)drawRect:(CGRect)rect { 

    _lineColor = [UIColor blackColor]; 

    [_lineColor setStroke]; 
    [_lineColor setFill]; 

    CGContextRef c = UIGraphicsGetCurrentContext(); 
    CGContextClearRect(c, rect); 
    [[UIColor clearColor] setFill]; 
    CGContextAddRect(c, rect); 
    CGContextSetLineWidth(c, 1); 
    CGContextDrawPath(c, kCGPathFill); 
    CGContextBeginPath(c); 
    CGContextMoveToPoint(c, 0, 0); 
    CGContextAddLineToPoint(c, x1, y1); 
    CGContextStrokePath(c); 
} 

но моя линия имеют разную ширину, угол 90 или 45 градусов. Как я могу нарисовать линию с тем же шириной

Answer 1

я взбитое то, что может сделать эффект здесь более заметным. Вот код:

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

    // Get us a gray background 
    CGContextSetFillColorWithColor(c, [[UIColor grayColor] CGColor]); 
    CGContextFillRect(c, CGRectInfinite); 

    CGContextSetStrokeColorWithColor(c, [[UIColor blackColor] CGColor]); 

    CGContextSetLineWidth(c, 1.0); 
    CGContextBeginPath(c); 

    // Draw some lines at various angles 
    for (CGFloat i = -10.; i <= 10.; i += 1.0) 
    { 
     CGContextMoveToPoint(c, CGRectGetMidX(self.bounds), CGRectGetMidY(self.bounds)); 
     CGContextAddLineToPoint(c, CGRectGetMidX(self.bounds) + i * 10., CGRectGetMidY(self.bounds) + 100); 
    } 

    CGContextStrokePath(c); 
} 

Вот выход из этого кода на сетчатке устройства: (Это должно отображаться на 100% в стандартном формате StackOverflow, но вы можете посмотреть на него полный размер, чтобы убедиться)

Теперь вот часть, что взорван:

что вы видите здесь происходит сглаживание на работе. Для начала вертикальная линия - все равно 2.0 пикселя, без сглаживания (при условии, что вы нарисуете ее на границе пикселя). Теперь подумайте о 45-градусной линии, нарисованной с использованием той же сетки пикселей, и используйте теорему Пифагора. Вот еще одна схема,:

В это узкое (т.е. в измерении, перпендикулярном к самой линии), в 45 град появится линия 1.414px в ширину, так и на его самом широком непрозрачная часть (не считая основном прозрачным пиксель, который перекрывает пространство в неровных промежутках), он появится на 2.828px. Когда вы взорваетесь, вы можете увидеть, как работа, выполняемая с целью противодействия этим линиям, приводит к оптическому появлению линий.

Кто-то, вероятно, собираюсь прийти и предложить вам отключить сглаживание, но для справки, что делает оптический эффект еще хуже (потому что тогда растеризатор собирается сделать каждый пиксель с покрытием полностью непрозрачными) :

Короче говоря, это ожидаемое поведение, и если вам нужно настроить, как вы рисуете каждую линию, чтобы достичь какой-то желаемого оптических внешнего, что код сглаживания по умолчанию не предоставляет, то вам просто должны делать эту работу. В CoreGraphics нет «сделать все мои линии оптически подобными», они сделали все возможное для общего случая, и если вам нужно что-то более конкретное, это зависит от вас. FWIW, многие приложения просто используют значение по умолчанию, и люди, похоже, довольны результатами, поэтому вы можете спросить себя, действительно ли это место в вашем приложении, где вы хотите добавить кучу дополнительной работы.

Мне пришло в голову: я не уверен, что вам понравится эффект, но один из возможных подходов к достижению оптического сходства может заключаться в том, чтобы нарисовать вертикальные линии не на границах пикселей. Это заставит их появляться сглаженные тоже, которые (в зависимости от того, как вы смотрите на него) могут заставить их выглядеть более согласованными с угловыми, сглаженными линиями. Вот как это выглядит:

Что вы теряете делать это некий «ломкость» к линиям.Рисунок от пиксельных-границы могут наиболее легко быть достигнуто за счет перевода контекст 0.25pt в направлении Х (для сетчатки - для не-сетчатки, 0.5pt будет иметь такой же эффект), как это:

CGContextTranslateCTM(c, 0.25, 0); 

Надежда это помогает.