似乎無法擺脫的git線在UIBezierPath

Question

OK，所以我需要一個圓角三角形。所以我所做的就是使用一種類似於我在其他矢量繪圖程序中使用的技術。繪製三角形並使用筆觸創建圓角。工作就像一個魅力太大，直到我需要減少用於填充和中風的UIBezierPath顏色的Alpha。出於某種原因，我不斷得到與填充和描邊顏色不同的插圖輪廓。不知何故阿爾法值沒有得到尊重。也許我在這裏忽略了一些愚蠢的東西，但嘗試我可能無法得到三角形所有顏色的alpha值低於1.這就是我得到的：

繼承人簡單的代碼：

- (void)drawRect:(CGRect)rect 
{ 
    UIBezierPath *path = [UIBezierPath bezierPath]; 
    [path moveToPoint: CGPointMake(63.5, 10.5)]; 
    [path addLineToPoint: CGPointMake(4.72, 119.5)]; 
    [path addLineToPoint: CGPointMake(122.28, 119.5)]; 
    [path addLineToPoint: CGPointMake(63.5, 10.5)]; 
    [path closePath]; 
    path.miterLimit = 7; 

    path.lineCapStyle = kCGLineCapRound; 

    path.lineJoinStyle = kCGLineJoinRound; 
    path.lineWidth = 8; 

    UIColor *whiteAlph5 = [UIColor colorWithWhite:0.6 alpha:0.5]; 

    [whiteAlph5 setFill]; 
    [whiteAlph5 setStroke]; 


    [path fill]; 
    [path stroke]; 
} 

我不明白爲什麼線會比其他任何東西「whiteAlpha5」如果這是唯一的顏色，我兩個填充和筆觸設置。我想我可以只畫圓角三角形出添加曲線到角落，但我只是好奇，爲什麼這happens.Thanks提前...

Answer 1

該行是因爲您的筆觸和填充正在繪製到相同的像素。由於筆畫和填充部分都是部分透明的，顏色會累積。

解決此問題的一種方法是隻創建一個概述您的圓角三角形的路徑，並填充它而不用撫摸它。

下面是創建概述了圓角多邊形的路徑類別接口：

@interface UIBezierPath (MyRoundedPolygon) 

+ (UIBezierPath *)my_roundedPolygonWithSides:(int)sides center:(CGPoint)center 
    vertexRadius:(CGFloat)vertexRadius cornerRadius:(CGFloat)cornerRadius 
    rotationOffset:(CGFloat)rotationOffset; 

@end 

這裏的實現：

@implementation UIBezierPath (MyRoundedPolygon) 

static CGPoint vertexForPolygon(int sides, CGPoint center, CGFloat circumradius, CGFloat index) { 
    CGFloat angle = index * 2 * M_PI/sides; 
    return CGPointMake(center.x + circumradius * cosf(angle), 
     center.y + circumradius * sinf(angle)); 
} 

+ (UIBezierPath *)my_roundedPolygonWithSides:(int)sides center:(CGPoint)center 
    vertexRadius:(CGFloat)vertexRadius cornerRadius:(CGFloat)cornerRadius 
    rotationOffset:(CGFloat)rotationOffset 
{ 
    CGFloat circumradius = vertexRadius + cornerRadius; 
    CGPoint veryLastVertex = vertexForPolygon(sides, center, circumradius, rotationOffset - 1); 
    CGPoint currentVertex = vertexForPolygon(sides, center, circumradius, rotationOffset); 
    CGMutablePathRef cgpath = CGPathCreateMutable(); 
    CGPathMoveToPoint(cgpath, NULL, (veryLastVertex.x + currentVertex.x)/2, 
     (veryLastVertex.y + currentVertex.y)/2); 
    for (CGFloat i = 0; i < sides; ++i) { 
     CGPoint nextVertex = vertexForPolygon(sides, center, circumradius, 
      i + 1 + rotationOffset); 
     CGPathAddArcToPoint(cgpath, NULL, currentVertex.x, currentVertex.y, 
      nextVertex.x, nextVertex.y, cornerRadius); 
     currentVertex = nextVertex; 
    } 
    CGPathCloseSubpath(cgpath); 
    UIBezierPath *path = [self bezierPathWithCGPath:cgpath]; 
    CGPathRelease(cgpath); 
    return path; 
} 

@end 

這裏是你如何使用它：

@implementation MyView 

- (void)drawRect:(CGRect)rect 
{ 
    CGRect bounds = self.bounds; 
    CGPoint center = CGPointMake(CGRectGetMidX(bounds), CGRectGetMidY(bounds)); 
    UIBezierPath *path = [UIBezierPath my_roundedPolygonWithSides:3 center:center 
     vertexRadius:70 cornerRadius:8 rotationOffset:0.25]; 
    [[UIColor colorWithWhite:0.6 alpha:0.5] setFill]; 
    [path fill]; 
} 

@end 

結果如下：

請注意，將rotationOffset設置爲0.25會將三角形旋轉四分之一圈。將它設置爲零將會給你一個正確的三角形。

Answer 2

如果你必須有中風，改變你的調用[UIBezierPath stroke]像這樣：

[path fill]; 
[path strokeWithBlendMode:kCGBlendModeCopy alpha:1.0]; 

這應該達到你想要的效果（我認爲 - 一直無法對其進行測試）

這是一個有點猜測，但我認爲你看到的這裏基本上是兩層半透明的白色，一個在另一個上面繪製。當三角形剛剛填滿時，這就是你所期望的。當你中風，它的繪圖相同的顏色 - 但它增加它的現有顏色的頂部，而不是取代它，這就是如果你在油漆方案或類似的這樣做之前你所期望的效果。因此，在中風和填充重疊的地方，你會變得比以前更強烈的白色。只用自己填充可以解決這個問題，但是可能不會達到你想要的效果。

如果你需要我的意思可視化演示，您可以在Photoshop中做到這一點。創建一個黑色背景的新圖像，並在其上創建一個新圖層，設置爲50％不透明度。在它上面畫一個白色方塊（由於不透明度，它會顯得灰色）。然後，不改變圖層，通過它畫一條線。您不會看到該行，因爲它正在替換現有的顏色 - 這是您希望在您的代碼中發生的事情。然後，在其上添加另一個圖層，並將其設置爲50％不透明度。通過正方形在此圖層上畫一條線。你會看到這條線是更明亮的灰色。這是添加劑，兩個圖層上的白色重疊 - 您的代碼創建的效果。