• 2023/2/3
• 4分

【Swift】UI部品の角を丸める方法！cornerRadiusが適応されない原因は？

＼ アプリをリリースしました ／

友達や家族の誕生日をメモ！通知も届く-みんなの誕生日-

posted withアプリーチ

UI部品の角を丸める方法

公式リファレンス：cornerRadiusプロパティ

UILabelなどのUI部品の角を丸めるにはcornerRadiusプロパティに値を渡します。 さらにclipsToBoundsプロパティにtrueを渡すことと背景色を設定しないと視認できないので注意してください。

 let label = UILabel(frame: CGRect(x: 0, y:0, width: UIScreen.main.bounds.width / 2 , height: 80))
label.center = self.view.center
label.backgroundColor = .orange
label.layer.cornerRadius = 5
label.clipsToBounds = true
self.view.addSubview(label)

適応されない原因

角を丸めるコードを書いたのにビューに適応されない場合は以下の原因が考えられます。

1. 背景色が設定されていない
2. clipsToBoundsプロパティにtrueを渡していない

背景色はともかくclipsToBoundsプロパティへの設定は忘れがちなのでセットで覚えるようにしておくと良いかもしれません。

cornerRadiusプロパティ

cornerRadiusプロパティはCALayerクラスの持つプロパティです。UIViewクラスはlayerプロパティ(CALayer型)を持っています。CALayerクラスは描画に特化したクラスで描画速度が速いのが特徴です。

おすすめ記事：【Swift】CALayerクラスとは？UIVewとの違いとアニメーションの実装

clipsToBoundsプロパティ

公式リファレンス：clipsToBoundsプロパティ

clipsToBoundsプロパティはUIViewクラスが持つプロパティです。trueを設定するとサブビューはビューの境界にクリップ(切り取り)されます。

おすすめ記事：【Swift/UIKit】UIViewクラスとは？使い方やプロパティまとめ

まだまだ勉強中ですので間違っている点や至らぬ点がありましたら教えていただけると助かります。

ご覧いただきありがとうございました。