ストーリーボードを使用してUIViewをマスクし、角を丸くしますか？

Question

多くの質問like thisは、プログラムでマスクを作成し、UIViewに丸みのあるコーナーを提供する方法を説明しています。

ストーリーボード内ですべてを行う方法はありますか？ストーリーボードに丸みを帯びたコーナーを作成するような感じがするので、プレゼンテーションとロジックの境界が明確になります。

Answer 1

はい、私はそれをたくさん使っていますが、このような質問はすでに何度も回答されていました。

しかし、とにかくInterface Builderで。 あなたがユーザー定義のランタイムを追加する必要があるが、このように属性：

layer.masksToBounds Boolean YES 
layer.cornerRadius Number {View's Width/2} 

と有効

Clips subviews 

結果：

Answer 2

ユーザー定義プロパティを使用してストーリーボードで実行できます。丸めたいビューを選択し、IDインスペクタを開きます。

• キーのパス：layer.cornerRadius、型：Number、値：（あなたが好きな半径）
• キーのパス：layer.masksToBounds、種類：ユーザー定義ランタイムは Attributesセクションでは、次の2つのエントリを追加し、ブールを、値：あなたは（もしあれば）あなたのビューの対応するクラスファイルでQuartzKitをインポートする必要がありますが、私は、私はそれはそれを行うことなく動作するように得ていることを誓う

をチェックします。結果は異なる場合があります。

編集：私は、これが遊び場で動作することを確認

extension UIView { 

    /// The ratio (from 0.0 to 1.0, inclusive) of the view's corner radius 
    /// to its width. For example, a 50% radius would be specified with 
    /// `cornerRadiusRatio = 0.5`. 
    @IBDesignable public var cornerRadiusRatio: CGFloat { 
     get { 
      return layer.cornerRadius/frame.width 
     } 

     set { 
      // Make sure that it's between 0.0 and 1.0. If not, restrict it 
      // to that range. 
      let normalizedRatio = max(0.0, min(1.0, newValue)) 
      layer.cornerRadius = frame.width * normalizedRatio 
     } 
    } 

} 

動半径の例。