web-dev-qa-db-ja.com

インターフェースビルダーからUIViewボーダープロパティを設定することは可能ですか？

それはインターフェイスビルダーから直接UIViewのボーダープロパティ（色、太さなど）を制御することは可能ですか私はプログラム的にそれを行うことができますか？

iosuiviewinterface-builderborder
176
matteo.cajani

実際には、インターフェイスビルダーを介してビューのレイヤーのいくつかのプロパティを設定できます。私はxcodeを通してレイヤのborderWidthとcornerRadiusを設定できることを知っています。 borderColorは機能しません。おそらく、レイヤがUIColorではなくCGColorを望んでいるためです。

あなたは数字の代わりに文字列を使わなければならないかもしれませんが、それはうまくいきます！

layer.cornerRadius
layer.borderWidth
layer.borderColor

更新：layer.masksToBounds = true

example

更新：キーパスに適切な種類を選択します。

enter image description here

374
Rich86man

Rich86Manの答えは正しいですが、あなたはlayer.borderColorのような代理プロパティにカテゴリを使うことができます。 （ 慣例的C CocoaPodより）

CALayer + XibConfiguration.h：

#import <QuartzCore/QuartzCore.h>
#import <UIKit/UIKit.h>

@interface CALayer(XibConfiguration)

// This assigns a CGColor to borderColor.
@property(nonatomic, assign) UIColor* borderUIColor;

@end

CALayer + XibConfiguration.m：

#import "CALayer+XibConfiguration.h"

@implementation CALayer(XibConfiguration)

-(void)setBorderUIColor:(UIColor*)color
{
    self.borderColor = color.CGColor;
}

-(UIColor*)borderUIColor
{
    return [UIColor colorWithCGColor:self.borderColor];
}

@end

Interface Builder

layer.borderUIColor

結果は、Xcodeではなく実行時に明らかになります。

編集：選択した色の枠線を見るには、layer.borderWidthを1以上に設定する必要もあります。

Swift 2.0では、

extension CALayer {
    var borderUIColor: UIColor {
        set {
            self.borderColor = newValue.CGColor
        }

        get {
            return UIColor(CGColor: self.borderColor!)
        }
    }
}

Swift 3.0では、

extension CALayer {
    var borderUIColor: UIColor {
        set {
            self.borderColor = newValue.cgColor
        }

        get {
            return UIColor(cgColor: self.borderColor!)
        }
    }
}
178
Peter DeWeese

iHulkのものと似たような答えだが、Swiftでは

プロジェクトにUIView.Swiftという名前のファイルを追加します（または、任意のファイルに貼り付けます）。

import UIKit

@IBDesignable extension UIView {
    @IBInspectable var borderColor: UIColor? {
        set {
            layer.borderColor = newValue?.cgColor
        }
        get {
            guard let color = layer.borderColor else {
                return nil
            }
            return UIColor(cgColor: color)
        }
    }
    @IBInspectable var borderWidth: CGFloat {
        set {
            layer.borderWidth = newValue
        }
        get {
            return layer.borderWidth
        }
    }
    @IBInspectable var cornerRadius: CGFloat {
        set {
            layer.cornerRadius = newValue
            clipsToBounds = newValue > 0
        }
        get {
            return layer.cornerRadius
        }
    }
}

それから、これは、ユーティリティパネル>属性インスペクタのすべてのボタン、imageView、ラベルなどに対してInterface Builderで利用可能になります。

Attributes Inspector

注：枠は実行時にのみ表示されます。

76
Axel Guilmin

あなたはUIViewのカテゴリを作り、カテゴリの.hファイルにこれを追加することができます

@property (nonatomic) IBInspectable UIColor *borderColor;
@property (nonatomic) IBInspectable CGFloat borderWidth;
@property (nonatomic) IBInspectable CGFloat cornerRadius;

これを.mファイルに追加します

@dynamic borderColor,borderWidth,cornerRadius;

そしてこれも。 mファイル

-(void)setBorderColor:(UIColor *)borderColor{
    [self.layer setBorderColor:borderColor.CGColor];
}

-(void)setBorderWidth:(CGFloat)borderWidth{
    [self.layer setBorderWidth:borderWidth];
}

-(void)setCornerRadius:(CGFloat)cornerRadius{
    [self.layer setCornerRadius:cornerRadius];
}

これで、すべてのUIViewサブクラス（UILabel、UITextField、UIImageViewなど）のストーリーボードにこれが表示されます。

enter image description here

いいえ。カテゴリをどこにでもインポートする必要はありません。プロジェクトにカテゴリのファイルを追加し、ストーリーボードでこれらのプロパティを確認するだけです。

57
iHulk

Swift 3 and 4の場合、IBInspectablesを使用したい場合は、次のようになります。

@IBDesignable extension UIView {
    @IBInspectable var borderColor:UIColor? {
        set {
            layer.borderColor = newValue!.cgColor
        }
        get {
            if let color = layer.borderColor {
                return UIColor(cgColor: color)
            }
            else {
                return nil
            }
        }
    }
    @IBInspectable var borderWidth:CGFloat {
        set {
            layer.borderWidth = newValue
        }
        get {
            return layer.borderWidth
        }
    }
    @IBInspectable var cornerRadius:CGFloat {
        set {
            layer.cornerRadius = newValue
            clipsToBounds = newValue > 0
        }
        get {
            return layer.cornerRadius
        }
    }
}
8
RamwiseMatt

これはプロパティを設定するかもしれませんが、実際にはIBに反映されません。あなたが本質的にIBでコードを書いているのであれば、あなたはそれからあなたのソースコードでそれをするかもしれません

7
Zayin Krige

時間を節約したい場合は、2つのUIViewsを上下に重ねて使用します。後ろにあるものは境界線の色、前にあるものは境界線の効果が小さくなります。私はこれもエレガントな解決策ではないと思います、しかしAppleがもう少し気を配っているならば、あなたはこれをする必要はないはずです。

4
Matthew Quiros

ストーリーボードは、ここですべての解決策を試した後でも、いつも私のためには機能しません。

だから、常に完璧な答えはコードを使用することです、UIViewのIBOutletインスタンスを作成してプロパティを追加するだけです

短い答え：

layer.cornerRadius = 10
layer.borderWidth = 1
layer.borderColor = UIColor.blue.cgColor

長い答え：

UIView/UIButtonなどの角の丸い

customUIView.layer.cornerRadius = 10

境界線の太さ

pcustomUIView.layer.borderWidth = 2

ボーダの色

customUIView.layer.borderColor = UIColor.blue.cgColor
0
swiftBoy

あなたがlayer.masksToBounds = trueをセットして、あなたがものを休ませるときだけ、それは絶対に可能です。

0
Sunil Targe