你真的精通Storyboard了吗?

可能好多人在简历上写着精通Storyboard,那么同学们真的都精通Storyboard了吗?
拖约束那肯定是最基本的了这里我就不再多说。

首先我们先看看下面几个单词大家是否都明白什么含义

  • outlets
  • referencing outlets
  • IBOutlet
  • IBAction
  • IBOutletCollection
  • IBInspectable
  • IBDesignable

好了我一个一个解释什么意思

outlets和referencing outlets

outlets:显示自己拥有的属性以及连接对象

你真的精通Storyboard了吗?_第1张图片
屏幕快照 2016-06-10 下午12.14.45.png

referencing outlets:表示自己被连接到什么东西上

IBOutlet与IBAction

IBOutlet:通过在变量前增加IBOutlet来说明该变量将与界面上的某个UI对象对应。

@property (weak, nonatomic) IBOutlet UIButton *btn;

IBAction:在方法前增加IBAction来说明该方法将与界面上的事件对应。

- (IBAction)btnClick:(UIButton *)sender
{
}

IBOutletCollection

IBOutletCollection,我们使用这个关键字,可以将界面上一组相同的控件连接到同一个数组中。
例如:

@property(strong,nonatomic)IBOutletCollection(UIButton) NSArray*btnArray;

在swift中的写法为

 @IBOutlet var btnArray: [UIButton]!

IBDesignable和IBInspectable

使用IBInspectable去标志一个变量,将会使得这个变量在改变时 IB 快速的渲染你的自定义视图,从而达到视图在 IB 界面实时修改的效果。IBInspectable不仅可以标志在类里声明的变量,还包括 extension 和 category 里的变量。被标志的变量将会在 IB 的 attribute inspector 面板中出现,和普通的 View 的属性展现形式相同。

IBDesignable:当应用到 UIView 或 NSView 子类中的时候,@ IBDesignable 让 Interface Builder 知道它应该在画布上直接渲染视图。你会看到你的自定义视图在每次更改后不必编译并运行你的应用程序就会显示。 Objective-C 是 IB_DESIGNABLE 的宏,swif中只需在类名前加上 @IBDesignable

没什么好说的,直接上代码吧

#import 

IB_DESIGNABLE
@interface textView : UIView
@property (assign, nonatomic) IBInspectable CGFloat borderWidth;
@property (strong, nonatomic) IBInspectable UIColor *borderColor;
@property (assign, nonatomic) IBInspectable CGFloat cornerRadius;
@end


- (void)setBorderColor:(UIColor *)borderColor {
    self.layer.masksToBounds = YES;
    self.layer.borderColor = borderColor.CGColor;
}

- (void)setBorderWidth:(CGFloat)borderWidth {
    self.layer.masksToBounds = YES;
    self.layer.borderWidth = borderWidth;
}

- (void)setCornerRadius:(CGFloat)cornerRadius {
    self.layer.masksToBounds = YES;
    self.layer.cornerRadius = cornerRadius;
}

写好代码你会发现你自定义的类的 attribute inspector 面板中多了这几个属性


你真的精通Storyboard了吗?_第2张图片
IBInspectable.png
IBDesignable * IBInspectable.gif

swift的代码

 @IBInspectable var cornerRadius: CGFloat = 0.0 {
        didSet {
            layer.cornerRadius = cornerRadius
            layer.masksToBounds = true
        }
    }
    
 @IBInspectable var borderColor: UIColor = UIColor() {
        didSet {
            layer.borderColor = borderColor.CGColor
        }
    }
    
 @IBInspectable var borderWidth: CGFloat = 0.0 {
        didSet {
            layer.borderWidth = borderWidth
        }
    }

目前下面这些数据都对IBInspectable有效:

  • Int
  • CGFloat
  • Double
  • String
  • Bool
  • CGPoint
  • CGSize
  • CGRect
  • UIColor
  • UIImage

注意:
不要在构造函数中修改attribute inspector面板中的属性:在构造函数中如果对 attribute inspector 面板中出现的属性进行了初始化的话,会导致这些属性在运行时是按照你构造函数中的初始化的值来显示,而在IB编辑界面中却按照 attribute inspector 面板的值来显示,导致编辑时与运行时界面的不一致。
例如在初始化方法中设置backgroundColor = UIColor.redColor()
,而在 attribute inspector 面板中background的颜色为whiteColor,那将会导致在IB中你看到的这个视图背景为白色,而运行时视图背景却为红色。

这些是Storyboard的一部分,到这里也就是入门,更多内容我会继续更新。
最近小弟所在公司资金链断了,所以没有了工作,各位大哥那要是招人给小弟个机会
小弟的电话:18611205315
微信:zhanming61

你可能感兴趣的:(你真的精通Storyboard了吗?)