7

UIView'コーナーを丸くすることについて、ここにはたくさんの質問があります。残念ながら、角度の付いたコーナーの作り方については何も見つかりません。UIView代わりに、角を45度の角度でカットする方法を教えてください。

個々のコーナーを斜めにカットする方法を教えていただければ、ボーナス（比喩的な）ゴールドスターを獲得することもできます。

編集：参考までに、このソリューションと同様の実装があると思われる質問へのリンクを次に示します。何を変えなければならないのかわからない。

4

3 に答える 3

7

まず、角が斜めになっているパスが必要です。

- (CGPathRef) makeAnglePathWithRect: (CGRect)rect withSize:(float) s {

    CGPoint one = CGPointMake( rect.origin.x +s, rect.origin.y);
    CGPoint two = CGPointMake( rect.origin.x + rect.size.width - s, rect.origin.y);

    CGPoint three = CGPointMake( rect.origin.x + rect.size.width, rect.origin.y +s);
    CGPoint four = CGPointMake( rect.origin.x + rect.size.width, rect.origin.y + rect.size.height -s);

    CGPoint five = CGPointMake( rect.origin.x + rect.size.width-s, rect.origin.y + rect.size.height);
    CGPoint six = CGPointMake(rect.origin.x+s, rect.origin.y + rect.size.height);

    CGPoint seven = CGPointMake(rect.origin.x, rect.origin.y + rect.size.height-s);
    CGPoint eight = CGPointMake(rect.origin.x, rect.origin.y + s);

    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path,NULL,one.x, one.y);
    CGPathAddLineToPoint(path,NULL,two.x, two.y);
    CGPathAddLineToPoint(path,NULL,three.x, three.y);
    CGPathAddLineToPoint(path,NULL,four.x, four.y);
    CGPathAddLineToPoint(path,NULL,five.x, five.y);
    CGPathAddLineToPoint(path,NULL,six.x, six.y);
    CGPathAddLineToPoint(path,NULL,seven.x, seven.y);
    CGPathAddLineToPoint(path,NULL,eight.x, eight.y);
    CGPathAddLineToPoint(path,NULL,one.x, one.y);

    return path;
}

次に、パスを使用してマスクを指定する必要があります。

CAShapeLayer *maskLayer = [CAShapeLayer layer];
CGRect bounds = CGRectMake(0.0f, 0.0f, 100, 100); //figure out your bounds

[maskLayer setFrame:bounds];
CGPathRef p = [self makeAnglePathWithRect:bounds withSize:20.0];
maskLayer.path = p;
_myview.layer.mask = maskLayer;

任意のコーナーから角度を削除する場合は、ポイント1〜8をいじって、「s」の値を削除します。sizeパラメータを使用して、角から切り取った三角形のサイズを変更できます。

于 2013-02-23T01:54:54.407 に答える
4

@nontからインスピレーションを得て、拡張子を使用して、次のスニペットを作成します。

extension UIView {

    public enum Corner: Int {
        case TopRight
        case TopLeft
        case BottomRight
        case BottomLeft
        case All
    }

    public func blendCorner(corner corner: Corner, length: CGFloat = 20.0) {
        let maskLayer = CAShapeLayer()
        var path: CGPathRef?
        switch corner {
        case .All:
            path = self.makeAnglePathWithRect(self.bounds, topLeftSize: length, topRightSize: length, bottomLeftSize: length, bottomRightSize: length)
        case .TopRight:
            path = self.makeAnglePathWithRect(self.bounds, topLeftSize: 0.0, topRightSize: length, bottomLeftSize: 0.0, bottomRightSize: 0.0)
        case .TopLeft:
            path = self.makeAnglePathWithRect(self.bounds, topLeftSize: length, topRightSize: 0.0, bottomLeftSize: 0.0, bottomRightSize: 0.0)
        case .BottomRight:
            path = self.makeAnglePathWithRect(self.bounds, topLeftSize: 0.0, topRightSize: 0.0, bottomLeftSize: 0.0, bottomRightSize: length)
        case .BottomLeft:
            path = self.makeAnglePathWithRect(self.bounds, topLeftSize: 0.0, topRightSize: 0.0, bottomLeftSize: length, bottomRightSize: 0.0)
        }
        maskLayer.path = path
        self.layer.mask = maskLayer
    }

    private func makeAnglePathWithRect(rect: CGRect, topLeftSize tl: CGFloat, topRightSize tr: CGFloat, bottomLeftSize bl: CGFloat, bottomRightSize br: CGFloat) -> CGPathRef {
        var points = [CGPoint]()

        points.append(CGPointMake(rect.origin.x + tl, rect.origin.y))
        points.append(CGPointMake(rect.origin.x + rect.size.width - tr, rect.origin.y))
        points.append(CGPointMake(rect.origin.x + rect.size.width, rect.origin.y + tr))
        points.append(CGPointMake(rect.origin.x + rect.size.width, rect.origin.y + rect.size.height - br))
        points.append(CGPointMake(rect.origin.x + rect.size.width - br, rect.origin.y + rect.size.height))
        points.append(CGPointMake(rect.origin.x + bl, rect.origin.y + rect.size.height))
        points.append(CGPointMake(rect.origin.x, rect.origin.y + rect.size.height - bl))
        points.append(CGPointMake(rect.origin.x, rect.origin.y + tl))

        let path = CGPathCreateMutable()
        CGPathMoveToPoint(path, nil, points.first!.x, points.first!.y)
        for point in points {
            if point != points.first {
                CGPathAddLineToPoint(path, nil, point.x, point.y)
            }
        }
        CGPathAddLineToPoint(path, nil, points.first!.x, points.first!.y)
        return path
    }

}

このようにして、コーナーを簡単にブレンドできます。

let view = UIView()
view.blendCorner(corner: .TopRight)
// or view.blendCorner(corner: .All)
于 2016-07-19T15:31:39.817 に答える
3

これを行う1つの方法があります。与えられた：

const CGFloat kRadius = 20.0; //'radius' of the corner clip

そしてあなたの見解でこのプロパティを与えられた：

@property (nonatomic,strong) CAShapeLayer *maskLayer;

斜角の線の結合を使用して単純なマスクレイヤーを設定できます（非常に簡単に必要な45度の角度が得られます）。

CAShapeLayer *maskLayer = [CAShapeLayer layer];

maskLayer.lineWidth = kRadius * 2.0;
maskLayer.lineJoin = kCALineJoinBevel;
maskLayer.strokeColor = [[UIColor blackColor] CGColor];

self.layer.mask = self.maskLayer = maskLayer;

次に、適切なタイミングで（たとえば、の場合-[ViewClass layoutSublayersOfLayer:]）、マスクレイヤーのパスを半径で挿入された長方形のパスに設定します。

self.maskLayer.path = CGPathCreateWithRect(CGRectInset(self.bounds,kRadius,kRadius), NULL);

これは、パスの各セクションを手作業で描画することに頼らずにこれを行う1つの方法です。基本的に、斜角線結合を使用して、そのような作業を行います。

于 2013-02-23T02:35:40.040 に答える