15

UIView の下の 2 つの角を丸くしようとしていますが、レイヤーの境界線も丸く表示されます。私は現在やっています:

UIRectCorners corners = UIRectCornerBottomLeft | UIRectCornerBottomRight;
CGSize radii = CGSizeMake(kThisViewCornerRadius, kThisViewCornerRadius);
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:myView.bounds
                                           byRoundingCorners:corners
                                                 cornerRadii:radii];

CAShapeLayer *maskLayer = [CAShapeLayer layer];
[maskLayer setPath:path.CGPath];
myView.layer.mask = maskLayer;

これは、通常のビューでは問題なく機能します。ただし、myViewのレイヤーにはborderColorandborderWidthが設定されており、スクリーンショットからわかるように、レイヤーの境界線は丸くなっていません。

問題のスクリーンショット

また、UIView をサブクラス化して[CAShapeLayer layer]から戻り、ビューのレイヤー+[Class layerClass]シェイプ レイヤーとして設定しようとしましたが、境界線がビューのサブビューの下になってしまいました。

ビューの角を丸くしたり、ビューのレイヤーの境界を丸めたり、サブビューをレイヤーの境界の下にクリップしたりすることはできますか?

これは、いくつかの角を丸くする方法と他の角を丸くする方法ではなく、ストロークを正しく動作させる方法に関するものであることに注意してください。

4

3 に答える 3

36

David Rönnqvistのコメントのおかげで、私はそれについて新しい考え方を見つけました。

角の丸みとストロークをすべて 1 つのレイヤーで実行しようとしていました。代わりに、2 つのレイヤーに分割しました。1 つはビューのレイヤーをマスクして角を丸くするためのもので、もう 1 つはビュー内にストロークを追加するためのものです。

UIView *containerView = [[UIView alloc] initWithFrame:someFrame];

UIRectCorners corners = UIRectCornerBottomLeft | UIRectCornerBottomRight;
CGSize radii = CGSizeMake(kThisViewCornerRadius, kThisViewCornerRadius);

UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:myView.bounds
                                           byRoundingCorners:corners
                                                 cornerRadii:radii];

// Mask the container view’s layer to round the corners.
CAShapeLayer *cornerMaskLayer = [CAShapeLayer layer];
[cornerMaskLayer setPath:path.CGPath];
containerView.layer.mask = cornerMaskLayer;

// Make a transparent, stroked layer which will dispay the stroke.
CAShapeLayer *strokeLayer = [CAShapeLayer layer];
strokeLayer.path = path.CGPath;
strokeLayer.fillColor = [UIColor clearColor].CGColor;
strokeLayer.strokeColor = [UIColor redColor].CGColor;
strokeLayer.lineWidth = 2; // the stroke splits the width evenly inside and outside,
                           // but the outside part will be clipped by the containerView’s mask.

// Transparent view that will contain the stroke layer
UIView *strokeView = [[UIView alloc] initWithFrame:containerView.bounds];
strokeView.userInteractionEnabled = NO; // in case your container view contains controls
[strokeView.layer addSublayer:strokeLayer];

// configure and add any subviews to the container view

// stroke view goes in last, above all the subviews
[containerView addSubview:strokeView];
于 2013-02-14T05:19:32.587 に答える