2010-02-02 3 views
4

Я создаю свой собственный UITableViewCells с градиентом фона. Я вся логика и рисунок работал, но одна вещь, которую я хочу, чтобы исправить это «chunkiness» по углам моей пользовательской ячейке:Сглаживание закругленного штриха в Core Graphics

alt text http://grab.by/27SM

Если вы увеличите по углам, вы можете увидеть о чем я говорю. Вот код, который я используя для создания ячейки:

CGContextRef c = UIGraphicsGetCurrentContext(); 
CGColorSpaceRef myColorspace = CGColorSpaceCreateDeviceRGB(); 
CGGradientRef myGradient = nil; 
CGFloat components[8] = TABLE_CELL_BACKGROUND; 
CGContextSetStrokeColorWithColor(c, [[UAColor colorWithWhite:0.7 alpha:1] CGColor]); 
CGContextSetLineWidth(c, 2); 
CGContextSetAllowsAntialiasing(c, YES); 
CGContextSetShouldAntialias(c, YES); 
CGFloat minx = CGRectGetMinX(rect) , midx = CGRectGetMidX(rect), maxx = CGRectGetMaxX(rect) ; 
CGFloat miny = CGRectGetMinY(rect) , maxy = CGRectGetMaxY(rect) ; 

CGMutablePathRef path = CGPathCreateMutable(); 
CGPathMoveToPoint(path, NULL, minx, miny); 
CGPathAddArcToPoint(path, NULL, minx, maxy, midx, maxy, kDefaultMargin); 
CGPathAddArcToPoint(path, NULL, maxx, maxy, maxx, miny, kDefaultMargin); 
CGPathAddLineToPoint(path, NULL, maxx, miny); 
CGPathAddLineToPoint(path, NULL, minx, miny); 
CGPathCloseSubpath(path); 

// Fill and stroke the path 
CGContextSaveGState(c); 
CGContextAddPath(c, path); 
CGContextClip(c); 

CGFloat locations[2] = { 0.0, 1.0 }; 
CGFloat mycomponents[8] = TABLE_CELL_BACKGROUND; 
CGColorSpaceRef myColorspace = CGColorSpaceCreateDeviceRGB(); 
myGradient = CGGradientCreateWithColorComponents(myColorspace, mycomponents, locations, 2); 
CGContextDrawLinearGradient(c, myGradient, CGPointMake(minx,miny), CGPointMake(minx,maxy), 0); 

CGContextRestoreGState(c); 
CGContextAddPath(c, path); 
CGContextStrokePath(c); 

Что я могу сделать, чтобы сгладить края при сохранении равномерной толщины края во всех клетках?

ответ

7

Ваша ширина линии установлена ​​в 2 точки. Что происходит, так это то, что ваш код вычисляет ваш ограничивающий прямоугольник, не понимая ширины линии. Результат состоит в том, что для каждого прямого сегмента вашей фигуры видна только половина ширины штриха. На дуге видна полная ширина хода.

Вот соответствующий сегмент кода из моего приложения Funring, чтобы рисовать игровые карты с закругленными углами, подобными тому, что у вас есть.

CGRect rect = [self bounds]; 
rect.size.width -= lineWidth; 
rect.size.height -= lineWidth; 
rect.origin.x += lineWidth/2.0; 
rect.origin.y += lineWidth/2.0; 

Добавим, что до вашего расчета для распутница, midx, Maxx и т.д., и штрихи для вашей формы должен быть однородным.

+1

Этот метод был более плавным, чем метод Петра: http://grab.by/2836 – coneybeare

+0

Какой прекрасный ответ. Улучшила мои строки сразу. Благодаря! – typeoneerror

1

Другой способ сделать такт последовательным - переместить вызовы AddPath и StrokePath над вызовом RestoreGState, то есть обводь во время обрезания.

Для поистине двухтактного хода с этим решением просто удвойте ширину линии, которую вы ввели в графическое состояние (т. Е. Установите ее на 4 pt), так как половина ее будет вырезана.

+0

Это сработало, но это было не так гладко, как метод Giao http://grab.by/2832 – coneybeare