更改情节提要中的UIButton BorderColor


Answers:


159

对于Swift:

在此处输入图片说明

斯威夫特3:

extension UIView {

    @IBInspectable var cornerRadius: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
            layer.masksToBounds = newValue > 0
        }
    }

    @IBInspectable var borderWidth: CGFloat {
        get {
            return layer.borderWidth
        }
        set {
            layer.borderWidth = newValue
        }
    }

    @IBInspectable var borderColor: UIColor? {
        get {
            return UIColor(cgColor: layer.borderColor!)
        }
        set {
            layer.borderColor = newValue?.cgColor
        }
    }
}

Swift 2.2:

extension UIView {

    @IBInspectable var cornerRadius: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
            layer.masksToBounds = newValue > 0
        }
    }

    @IBInspectable var borderWidth: CGFloat {
        get {
            return layer.borderWidth
        }
        set {
            layer.borderWidth = newValue
        }
    }

    @IBInspectable var borderColor: UIColor? {
        get {
            return UIColor(CGColor: layer.borderColor!)
        }
        set {
            layer.borderColor = newValue?.CGColor
        }
    }
}

您好,我在目标c中创建CustomeView类,但未在我的情节提要中显示Plz帮助我。
Pooja Srivastava'2

非常感谢!:)
维杰VS

谢谢,真棒,完美
Abo3atef

1
整洁,但是XCode(版本8.3.3(8E3004b))未在预览中显示结果,这是正确的并且没有办法更改(除了创建自定义视图)?
康斯坦丁·贝科夫

这是最优雅的解决方案!不错的工作!
Zoltan Vinkler

88

我得到了答案。更改 borderColor而不是layer.borderColor

Xcode片段

并将此代码添加到.m文件中:

#import <QuartzCore/QuartzCore.h>
@implementation CALayer (Additions)

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

@end

属性检查器中的刻度属性

属性检查器


5
@jithin我将它写为Swift扩展,代码如下:扩展CALayer {func setBorderColorFromUIColor(color:UIColor){self.borderColor = color.CGColor}}
Guy

1
技巧成功了。部分地。即使我指定了红色,我到底如何得到黑色边框颜色?有任何想法吗?任何人?
static0886 '16

@ static0886:这是因为您要应用的颜色未设置为边框。根据我的理解,我们无法从情节提要中设置边框颜色,因为此属性在运行时不会反映在UIComponent中。默认情况下为黑色。如果要通过从“属性”中删除color属性进行试用。
贾维德(Javeed)2016年

为了迅速,您可以将其设置为:self.button.layer.borderColor = <UIColor.CGColor>
Sam Sam

该layer.borderColorFromUIColor在故事板上为我工作。谢谢。
Ramakrishna

50

Swift 4,Xcode 9.2-使用IBDesignableIBInspectable构建自定义控件,并在Interface Builder中实时预览设计。

这是Swift中的示例代码,UIKit位于ViewController.swift的正下方:

@IBDesignable extension UIButton {

    @IBInspectable var borderWidth: CGFloat {
        set {
            layer.borderWidth = newValue
        }
        get {
            return layer.borderWidth
        }
    }

    @IBInspectable var cornerRadius: CGFloat {
        set {
            layer.cornerRadius = newValue
        }
        get {
            return layer.cornerRadius
        }
    }

    @IBInspectable var borderColor: UIColor? {
        set {
            guard let uiColor = newValue else { return }
            layer.borderColor = uiColor.cgColor
        }
        get {
            guard let color = layer.borderColor else { return nil }
            return UIColor(cgColor: color)
        }
    }
}

如果转到视图的可检查属性,则应在视觉上找到这些属性,然后编辑属性:

在此处输入图片说明

更改还反映在用户定义的运行时属性中:

在此处输入图片说明

运行构建时间,瞧!您将看到带有边框的清晰的圆形按钮。

在此处输入图片说明


这帮助我在情节提要中实现了它。您的答案很容易实现。
R. Mohan

这是带有明确说明的示例的最准确答案。
SeaWarrior404 '18

如果可以为Objective-C添加,将不胜感激。
米希尔·奥扎

9

可能在其他一些答案中迷失了解释:

未设置此属性的原因是layer.borderColor需要一个type值CGColor

但是只能UIColor通过Interface Builder的用户定义的运行时属性来设置类型!

因此,您必须通过Interface Builder将UIColor设置为代理属性,然后拦截该调用以将等效的CGColor设置为该layer.borderColor属性。

这可以通过在CALayer上创建类别,将密钥路径设置为唯一的新“属性”(borderColorFromUIColor),并在类别中覆盖相应的设置器(setBorderColorFromUIColor:)来实现。


1

有更好的方法可以做到这一点!您应该使用@IBInspectable。在此处查看Mike Woelmer的博客条目:https ://spin.atomicobject.com/2017/07/18/swift-interface-builder/

它实际上是在Xcode中将功能添加到IB的!其他答案中的某些屏幕截图使该字段看起来好像IB中存在,但至少在Xcode 9中它们不存在。但是跟随他的帖子将添加它们。


我尝试了这种方法,这使Xcode变得非常慢。你们所有人都在发生吗?
凌晨

0

在Swift的情况下,功能不起作用。您需要一个计算属性才能获得所需的结果:

extension CALayer {
    var borderColorFromUIColor: UIColor {
        get {
            return UIColor(CGColor: self.borderColor!)
        } set {
            self.borderColor = newValue.CGColor
        }
    }
}

0

这对我有用。

Swift 3,Xcode 8.3

身份检查器(在这种情况下为UIButton

CALayer扩展名:

extension CALayer {
var borderWidthIB: NSNumber {
    get {
        return NSNumber(value: Float(borderWidth))
    }
    set {
        borderWidth = CGFloat(newValue.floatValue)
    }
}
var borderColorIB: UIColor? {
    get {
        return borderColor != nil ? UIColor(cgColor: borderColor!) : nil
    }
    set {
        borderColor = newValue?.cgColor
    }
}
var cornerRadiusIB: NSNumber {
    get {
        return NSNumber(value: Float(cornerRadius))
    }
    set {
        cornerRadius = CGFloat(newValue.floatValue)
    }
}

}

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.