プログラムでUIViewのカスタム境界線の色を設定する方法は?


99

SwiftでUIViewのカスタム境界線の色をプログラムで設定しようとしています。


3
質問に関連するコードを示します。発生している問題を説明します。
rmaddy

1
Cocoa Touchの複製の可能性:UIViewの境界線の色と太さを変更する方法は?あなたはそれを迅速に使用する必要があります
Inder Kumar Rathore 2015

回答:


202

Swift 2.0以降を使用している場合

self.yourView.layer.borderWidth = 1
self.yourView.layer.borderColor = UIColor(red:222/255, green:225/255, blue:227/255, alpha: 1).cgColor

注:これは私にはうまくいかなかったようです(おそらく私はSwift 3.1を使用しているためでしょうか?)。Paras Joshiの(stackoverflow.com/a/29701061/225813)バージョンは機能しました
Ashley Coolman

回答を編集しました。それはあなたのために動作することを確認してください..アシュリークールマン
シャシバーマ2017

1
あなたはSWIFT 3で明示的に初期化を呼び出す必要はありません
ibrahimab

複数の色を使用することは可能ですか?
グーカンÇokkeçeci

3
2つのバージョンに違いはありますか?
フォグマイスター

88

スウィフト4あなたは、コードの下に使用してUIコントロールに境界線の色と幅を設定することができます。

let yourColor : UIColor = UIColor( red: 0.7, green: 0.3, blue:0.1, alpha: 1.0 )
yourControl.layer.masksToBounds = true
yourControl.layer.borderColor = yourColor.CGColor
yourControl.layer.borderWidth = 1.0

<Swift 4、以下のコードを使用して、UIViewのボーダー幅とボーダー色を設定できます。

yourView.layer.borderWidth = 1

yourView.layer.borderColor = UIColor.red.cgColor

1
@ShashiVermaどういたしまして。レイヤーの詳細については、アップルのさまざまなオブジェクトのクラスリファレンスドキュメントを
ご覧

16

同じことを行うには、@ IBDesignableおよび@IBInspectableを使用します。

それらは再利用可能で、インターフェイスビルダーから簡単に変更でき、変更はストーリーボードにすぐに反映されます

ストーリーボードのオブジェクトを特定のクラスに合わせる

コードスニペット:

@IBDesignable
class CustomView: UIView{

@IBInspectable var borderWidth: CGFloat = 0.0{

    didSet{

        self.layer.borderWidth = borderWidth
    }
}


@IBInspectable var borderColor: UIColor = UIColor.clear {

    didSet {

        self.layer.borderColor = borderColor.cgColor
    }
}

override func prepareForInterfaceBuilder() {

    super.prepareForInterfaceBuilder()
}

}

Interface Builderから簡単に変更できます。

インターフェースビルダー


このソリューションは、UIViewをカスタムビューに設定する再利用可能なソリューションなので、より多くの変更点を残して、より気に入っています。
n0rm 2017

これは私のお気に入りの方法ですが、ダークモードではうまく機能しません。現在のMacOSのカラースタイルを取得し、静的を使用します。しかし、中に構築@IBDesignableし、@IBInspectableすべてがうまく機能し、その習慣は、両方のダーク/ライトモードで色の資産を使用するための方法があるはずあまりにも〜誰もがそれを達成することができます方法を知っていますか?
Nomad Developer

12

拡張機能を作成して、すべてのUIViewで使用できます。UIButton、UILabel、UIImageViewなど。必要に応じて次のメソッドをカスタマイズできますが、うまくいくと思います。

extension UIView{

    func setBorder(radius:CGFloat, color:UIColor = UIColor.clearColor()) -> UIView{
        var roundView:UIView = self
        roundView.layer.cornerRadius = CGFloat(radius)
        roundView.layer.borderWidth = 1
        roundView.layer.borderColor = color.CGColor
        roundView.clipsToBounds = true
        return roundView
    }
}

使用法:

btnLogin.setBorder(7, color: UIColor.lightGrayColor())
imgViewUserPick.setBorder(10)

1
@luda私は彼/彼女がapi言語について多くの選択肢を持っているとは思いません!
価値のある単語

8

迅速3

func borderColor(){

    self.viewMenuItems.layer.cornerRadius = 13
    self.viewMenuItems.layer.borderWidth = 1
    self.viewMenuItems.layer.borderColor = UIColor.white.cgColor
}

8

Swift 5.2UIView + Extension

extension UIView {
    public func addViewBorder(borderColor:CGColor,borderWith:CGFloat,borderCornerRadius:CGFloat){
        self.layer.borderWidth = borderWith
        self.layer.borderColor = borderColor
        self.layer.cornerRadius = borderCornerRadius

    }
}

この拡張機能を使用しました。

yourView.addViewBorder(borderColor: #colorLiteral(red: 0.6, green: 0.6, blue: 0.6, alpha: 1), borderWith: 1.0, borderCornerRadius: 20)

clipsToBounds = true
Bent El-

3

あなたのコードを書いてください viewDidLoad()

self.view.layer.borderColor = anyColor().CGColor

そして、あなたは設定ColorすることができますRGB

func anyColor() -> UIColor {
    return UIColor(red: 0.0/255.0, green: 0.0/255.0, blue: 0.0/255.0, alpha: 1.0)
}

何かを学ぶCALayer中をUIKit


境界線の幅も明示的に設定しない限り、どういうわけか、何もしません。
Nicolas Miari、

予想される@NicolasMiari ...サイズを設定していない境界線の色は表示されません。
Jono Guthrie

申し訳ありませんが、私がテキストフィールドを参照していることを言及するのを忘れていました...最初からゼロ以外のデフォルトのボーダー幅があるようです。しかし、境界線の幅を明示的に設定するまで、設定した色を反映させるのに苦労しました。
Nicolas Miari

3

Swift 3.0

self.uiTextView.layer.borderWidth = 0.5
    self.txtItemShortDes.layer.borderColor = UIColor(red:205.0/255.0, green:205.0/255.0, blue:205.0/255.0, alpha: 1.0).cgColor

3

そのためのメソッドを作成できます。単にそれを使用してください。

public func createBorderForView(color: UIColor, radius: CGFloat, width: CGFloat = 0.7) {
    self.layer.borderWidth = width
    self.layer.cornerRadius = radius
    self.layer.shouldRasterize = false
    self.layer.rasterizationScale = 2
    self.clipsToBounds = true
    self.layer.masksToBounds = true
    let cgColor: CGColor = color.cgColor
    self.layer.borderColor = cgColor
}

2

Swift 3.0

       groundTrump.layer.borderColor = UIColor.red.cgColor

代わりに、新しい答えを追加するのは、元の回答に編集要求を送信している必要があります
ラジャンMaheshwari

@RajanMaheshwariいいえ。他の人の答えにコードを追加しないでください。更新は他の回答ではなく、独自のものとして投稿する必要があります。こうすることで、各ポスターが投稿内容に責任を負います...
Eric Aya

@EricAyaそれは答えを更新することについてではありません。これは編集リクエストであり、回答者へのコメントに含まれる場合があります。私が伝えようとしていたことはわかりましたか?
Rajan Maheshwari 2016年
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.