1. ホーム
  2. ios

[解決済み] UIViewの左上と右上だけにcornerRadiusを設定する方法は?

2022-03-20 06:47:40

質問

を設定する方法はありますか? cornerRadius の左上と右上にのみ適用されます。 UIView ?

下記を試してみましたが、結局ビューが表示されなくなりました。

UIView *view = [[UIView alloc] initWithFrame:frame];

CALayer *layer = [CALayer layer];
UIBezierPath *shadowPath = [UIBezierPath bezierPathWithRoundedRect:frame byRoundingCorners:(UIRectCornerTopLeft|UIRectCornerTopRight) cornerRadii:CGSizeMake(3.0, 3.0)];
layer.shadowPath = shadowPath.CGPath;
view.layer.mask = layer;

解決方法は?

レイアウト制約を付けている場合は、UIViewのサブクラスで以下のようにこれをリフレッシュする必要がありますので、注意してください。

override func layoutSubviews() {
    super.layoutSubviews()
    roundCorners(corners: [.topLeft, .topRight], radius: 3.0)
}

そうしないと表示されません。


そして、角を丸くするには、エクステンションを使用します。

extension UIView {
   func roundCorners(corners: UIRectCorner, radius: CGFloat) {
        let path = UIBezierPath(roundedRect: bounds, byRoundingCorners: corners, cornerRadii: CGSize(width: radius, height: radius))
        let mask = CAShapeLayer()
        mask.path = path.cgPath
        layer.mask = mask
    }
}



ビューコントローラの追加事例 : ビューをサブクラス化できない、あるいはしたくない場合でも、ビューを丸めることは可能です。そのためには、ビューコントローラから viewWillLayoutSubviews() 関数は、以下のようになります。

class MyVC: UIViewController {
    /// The view to round the top-left and top-right hand corners
    let theView: UIView = {
        let v = UIView(frame: CGRect(x: 10, y: 10, width: 200, height: 200))
        v.backgroundColor = .red
        return v
    }()
    
    override func loadView() {
        super.loadView()
        view.addSubview(theView)
    }
    
    override func viewWillLayoutSubviews() {
        super.viewWillLayoutSubviews()

        // Call the roundCorners() func right there.
        theView.roundCorners(corners: [.topLeft, .topRight], radius: 30)
    }
}