2011-12-13 23 views
2

をパスを描く:CAShapeLayerは、次のように私はUIBezierPathを構築しています妙

UIBezierPath *path = [UIBezierPath bezierPath]; 
CGFloat yOrigin = 2; 
for (int i = 0; i < lines; ++i) { 
    [path moveToPoint:CGPointMake(0, yOrigin)]; 
    [path addLineToPoint:CGPointMake(width, yOrigin)]; 
    yOrigin += distance; 
} 
[path closePath]; 

私はその後、CAShapeLayerにそれを置く:

CAShapeLayer *shapeLayer = [[CAShapeLayer alloc] init]; 
[shapeLayer setFrame:aFrame]; 
[shapeLayer setPath:[bezierPath CGPath]]; 
[shapeLayer setStrokeColor:[[UIColor blackColor] CGColor]]; 
[shapeLayer setMasksToBounds:YES]; 

しかし、私のスクロールビューに追加されたときに、ここにあります結果:

Path Image

なぜそれがこれを行うのですか?最初の4行は灰色です。エイリアシングの問題のように見えますが、その経路はとても簡単です。

答えて

5

はいこれはアンチエイリアスの問題です。

使用するパスの幅は1ptです。上記の例では、CAShapeLayerの上位3つのインスタンスは、ポイント値全体に正確に中央に配置されています。 5.0の場合、下側のインスタンスは2つの点全体に配置されます。 14.5。

システムがレイヤーをスクリーンピクセルにレンダリングすると、最初の3つのラインをアンチエイリアシングして、50%透明度のタッチピクセルを両方とも描画します。下の線は完全にピクセル上にあるため、完全な黒で描画されます。

少しASCIIアートが理解を助けてくれることを願っています。

pt   upper lines       lower line 
5.0|---------          ------------------------------- 
    | pixel -------------------------------------- perfectly aligned center 5.5 
6.0|--------- line between pixels centered on 6.0 ------------------------------- 
    | pixel -------------------------------------- 
7.0|--------- 
+0

これは間違いありませんが、私のパスコードが実際にこれを行うのはなぜですか? "距離"は12.0のようなものと仮定します。それは全体のポイントになるはずです。 – DexterW

0

私は同じ状況になりました:縦と横の黒い線が灰色になります。

CALayerではなく、ピクセル上にUiViewの 'スナップ'座標があります。

この問題に対する私の解決策は、コーディネートに0.5を追加することです。

CGRect bounds_on_pixels(const CGRect& bounds) { 

    const float f = 0.5f; 
    return CGRectMake(bounds.origin.x+f, bounds.origin.y+f, bounds.size.width-1.f, bounds.size.height-1.f); 
} 

注:-1.fのサイズは通用です。 CAShapeLayerでの使用とUIBezierPath

CAShapeLayer* shape_layer = [CAShapeLayer layer]; 
// initialize shape_layer... 
shape_layer.path = 
[ 
UIBezierPath bezierPathWithRoundedRect:bounds_on_pixels(self.view.bounds) 
byRoundingCorners:UIRectCornerTopLeft | UIRectCornerTopRight 
cornerRadii:CGSizeMake(10.0, 10.0) 
].CGPath; 
// add shape_layer: [self.view.layer insertSublayer:shape_layer atIndex:0]; 

@tonklonの

例:アイデアのためのTHX!

関連する問題