iOS - Xib

2016-08-10 674

前言

xib 文件可以被 Xcode 编译成 nib 文件，xib 文件本质上是一个 xml 文件，而 nib 文件就是编译后的二进制文件，该文件将视图等控件对象封装了起来，而在程序运行起来后，这些对象会被激活。xib 可以用 vim 或 cat 命令查看。nib 文件可以在程序的 Build 目录下找到。
xib 文件有以下几个重要的属性，从哪里加载 xib，加载 xib 中的什么视图，都可以根据这几个属性得出。
- xib 文件名
- File’s Owner
- xib 文件中的视图的 Class
- xib 文件中的视图的 Outlet 指向
在写界面时同时混用 xib 和代码可以提高效率，而对 xib 的使用主要体现在其专用性和通用性上。
对于一些专门的界面，例如 App 中的设置界面，纯代码写难免会浪费时间，此时可以通过 xib 文件的拖控件方法来定制。这个 xib 是专用于某一个界面的，目的是提高效率。
对于一些通用的控件甚至界面，例如一个很漂亮但实现起来非常复杂的按钮，此时可以通过 load xib 文件中的视图来快速添加。这个 xib 对于所有视图是共用的，目的是提高可复用性。
对于通用的 xib:
- 如果 xib 只是单纯的界面展示，那么 File’s Owner 可以随意。
- 如果 xib 中包含了按钮、手势等用户输入事件，那么 File’s Owner 最好设置为 UIViewController 类的子类。
xib 中可以有多个视图控件，从 xib 中 load 出来的 views 数组中视图对象的排列顺序和 xib scene 中的对象排列顺序一致（其实就是 xml 文件中元素的排序而已）。

1、xib 文件加载

1）xib 文件加载方式

1> 方法 1

    // Test 为 xib 文件名
    NSArray *objs = [[NSBundle mainBundle] loadNibNamed:@"Test" owner:nil options:nil];

    [self.view addSubview:objs[1]];

2> 方法 2

    // 一个 UINib 对象就代表一个 xib 文件
    /*
        一般情况下，bundle 参数传 nil，默认就是 mainBundle
    */
    UINib *nib = [UINib nibWithNibName:@"Test" bundle:[NSBundle mainBundle]];

    NSArray *objs = [nib instantiateWithOwner:nil options:nil];
    [self.view addSubview:objs[1]];

2）使用 xib 自定义 view 的步骤
- 新建自定义控件类
- 新建 xib 文件（文件名建议和自定义控件类的类名一致）
- 修改 xib 中控件绑定的类名
- 在类扩展中增加子控件的属性，关联 xib 中的子控件。封装 xib 的加载过程，增加模型属性，在模型属性 setter 方法中设置数据到子控件上。

1.1 加载 xib 中 File’s Owner 为 nil 的视图

Objective-C

BlueView.xib
- 由于 BlueView 会放到其它 View 上作为 subview，所以这儿 size 是 Freeform, Status Bar 是 None。

MainViewController.m

    @property (strong, nonatomic) UIView *blueView;

    - (void)loadBlueViewFromXIB {

        // BlueView.xib 的 File's Owner 为 nil

        NSArray *views = [[NSBundle mainBundle] loadNibNamed:@"BlueView" owner:nil options:nil];

        _blueView = views[0];
        [self.view addSubview:_blueView];

        // 从 xib 加载进来的 View 大小是确定的，但是该视图在父视图中的位置是不确定的。此外，视图中的子视图也是原封不动地 Load 进来的

        CGRect frame = _blueView.frame;
        frame.origin.x += 50.0f;
        frame.origin.y += 80.0f;
        _blueView.frame = frame;
    }

Swift

BlueView.xib

同 Objective-C 设置

MainViewController.swift

    var blueView:UIView!

    func loadBlueViewFromXIB() {

        // BlueView.xib 的 File's Owner 为 nil

        let views = NSBundle.mainBundle().loadNibNamed("BlueView", owner: nil, options: nil)

        blueView = views[0] as! UIView
        self.view.addSubview(blueView)

        // 从 xib 加载进来的 View 大小是确定的，但是该视图在父视图中的位置是不确定的。此外，视图中的子视图也是原封不动地 Load 进来的

        var frame = blueView.frame
        frame.origin.x += 50.0
        frame.origin.y += 80.0
        blueView.frame = frame
    }

结论:
- File’s Owner 为 nil 的 xib 文件中的视图属于通用视图，在工程中可以复用。
- 从 xib 加载进来的 View 大小是确定的，但是该视图在父视图中的位置是不确定的，因此需要开发者自行指定。
- 视图中的所有子视图会被原封不动地 Load 进来。

1.2 加载 xib 中 File’s Owner 为 self 的视图

Objective-C

GreenView.xib

MainViewController.m

    @property (strong, nonatomic) IBOutlet UIView *greenView;

    - (void)loadGreenViewFromXIB {

        // GreenView.xib 的 File's Owner 设为 self，并建立了一个从该 xib 的 View 到 self 的 IBOutlet greenView

        [[NSBundle mainBundle] loadNibNamed:@"GreenView" owner:self options:nil];

        [self.view addSubview:_greenView];

        // 只要 self 主动调用 Load XIB 的方法，self 持有的 IBOutlet 指向的视图就会被初始化。这里不需要通过 views[0] 的方式存取视图

        CGRect frame = _greenView.frame;
        frame.origin.x = _blueView.frame.origin.x;
        frame.origin.y = _blueView.frame.origin.y + 80.0f;
        _greenView.frame = frame;
    }

Swift

GreenView.xib

同 Objective-C 设置

MainViewController.swift

    @IBOutlet var greenView: UIView!

    func loadGreenViewFromXIB() {

        // GreenView.xib 的 File's Owner 设为 self，并建立了一个从该 xib 的 View 到 self 的 IBOutlet greenView

        NSBundle.mainBundle().loadNibNamed("GreenView", owner: self, options: nil)

        self.view.addSubview(greenView)

        // 只要 self 主动调用 Load XIB 的方法，self 持有的 IBOutlet 指向的视图就会被初始化。这里不需要通过 views[0] 的方式存取视图

        var frame = greenView.frame
        frame.origin.x = blueView.frame.origin.x
        frame.origin.y = blueView.frame.origin.y + 80.0
        greenView.frame = frame
    }

结论:
- File’s Owner 不为 nil 的 xib 文件中的视图属于专用视图，在工程中不应该被复用。
- 只要 self 主动调用 loadNibNamed:owner:options: 方法，self 持有的 IBOutlet 指向的视图就会被初始化。
- 存取 xib 中的视图不用 views[0] 的方式，而是通过 IBOutlet 类型的 property 进行存取。

1.3 加载 xib 中 File’s Owner 为特定类的视图

Objective-C

RedView.xib

RedViewOwner.h

    @property (strong, nonatomic) IBOutlet UIView *redView;

MainViewController.m

    @property (strong, nonatomic) RedViewOwner *redViewOwner;
    @property (strong, nonatomic) UIView *redView;

    - (void)loadRedViewFromXIB {

        // RedView.xib 的 File's Owner 是 RedViewOwner 类的实例，并建立了一个从该 xib 的 View 到 RedViewOwner 实例的 IBOutlet。
        // 只要通过 _redViewOwner 主动调用 Load XIB 的方法，该 IBOutlet 指向的视图就会被初始化

        _redViewOwner = [RedViewOwner new];

        [[NSBundle mainBundle] loadNibNamed:@"RedView" owner:_redViewOwner options:nil];

        _redView = _redViewOwner.redView;
        [self.view addSubview:_redView];

        CGRect frame = _redView.frame;
        frame.origin.x = _greenView.frame.origin.x;
        frame.origin.y = _greenView.frame.origin.y + 80.0f;
        _redView.frame = frame;
    }

Swift

RedView.xib

同 Objective-C 设置
RedViewOwner.swift
```
    @IBOutlet var redView: UIView!
```

MainViewController.swift

    var redViewOwner:RedViewOwner!
    var redView:UIView!

    func loadRedViewFromXIB() {

        // RedView.xib 的 File's Owner 是 RedViewOwner 类的实例，并建立了一个从该 xib 的 View 到 RedViewOwner 实例的 IBOutlet。
        // 只要通过 _redViewOwner 主动调用 Load XIB 的方法，该 IBOutlet 指向的视图就会被初始化

        redViewOwner = RedViewOwner()

        NSBundle.mainBundle().loadNibNamed("RedView", owner: redViewOwner, options: nil)

        redView = redViewOwner.redView
        self.view.addSubview(redView)

        var frame = redView.frame
        frame.origin.x = greenView.frame.origin.x
        frame.origin.y = greenView.frame.origin.y + 80.0
        redView.frame = frame
    }

结论:
- File’s Owner 类可以封装视图中的各种逻辑，而不仅仅是提供视图内容。
- 只要通过 File’s Owner 类主动调用 loadNibNamed:owner:options: 方法，该 IBOutlet 指向的视图就会被初始化。

1.4 加载 xib 中文件名和视图类名一致的视图（File’s Owner 为 nil）

Objective-C

YellowView.xib

File’s Owner 为 nil

YellowView.h

    // Convenience Method
    + (instancetype)viewFromNIB;

YellowView.m

    + (instancetype)viewFromNIB {

        // 加载 xib 中的视图，其中 xib 文件名和本类类名必须一致
        // 这个 xib 文件的 File's Owner 必须为空
        // 这个 xib 文件必须只拥有一个视图，并且该视图的 class 为本类

        NSArray *views = [[NSBundle mainBundle] loadNibNamed:NSStringFromClass([self class]) owner:nil options:nil];
        return views[0];
    }

    - (void)awakeFromNib {

        // self 就是 xib 文件中的 View
        self.backgroundColor = [UIColor yellowColor];
    }

MainViewController.m

    @property (strong, nonatomic) YellowView *yellowView;

    - (void)loadYellowViewFromXIB {

        // 说明见 YellowView.m 的 viewFromNIB 方法

        _yellowView = [YellowView viewFromNIB];

        [self.view addSubview:_yellowView];

        CGRect frame = _yellowView.frame;
        frame.origin.x = _redView.frame.origin.x;
        frame.origin.y = _redView.frame.origin.y + 80.0f;
        _yellowView.frame = frame;
    }

Swift

YellowView.xib

同 Objective-C 设置

YellowView.swift

    class func viewFromNIB() -> AnyObject {

        // 加载 xib 中的视图，其中 xib 文件名和本类类名必须一致
        // 这个 xib 文件的 File's Owner 必须为空
        // 这个 xib 文件必须只拥有一个视图，并且该视图的 class 为本类

        let views = NSBundle.mainBundle().loadNibNamed("YellowView", owner: nil, options: nil)

        return views[0]
    }

    override func awakeFromNib() {

        // self 就是 xib 文件中的 View
        self.backgroundColor = UIColor.yellowColor()
    }

MainViewController.swift

    var yellowView:YellowView!

    func loadYellowViewFromXIB() {

        // 说明见 YellowView.m 的 viewFromNIB 方法

        yellowView = YellowView.viewFromNIB() as! YellowView

        self.view.addSubview(yellowView)

        var frame = yellowView.frame
        frame.origin.x = redView.frame.origin.x
        frame.origin.y = redView.frame.origin.y + 80.0
        yellowView.frame = frame
    }

结论:
- 这里的 viewFromNib 方法只是对 loadNibNamed:owner:options: 方法的一个简单封装，要求的条件包括：
  - xib 文件名和本类类名必须一致。
  - 这个 xib 文件的 File’s Owner 必须为空。
  - 这个 xib 文件必须只拥有一个视图，并且该视图的 class 为本类。

1.5 通过 UIViewController 的 initWithNibName:bundle: 方法加载 xib 文件中的视图

Objective-C

BlackViewController.xib
- 如果 BlackViewController 类希望 self.view 就是 xib 文件中的 View，可以在 Connections 页中建立 view -> File’s Owner 的 Outlet。由 File’s Owner 右键拖动到 view 上。

BlackViewController.h

    //  Conveniece Method
    + (instancetype)viewControllerFromNIB;

BlackViewController.m

    + (instancetype)viewControllerFromNIB {

        return [[BlackViewController alloc] initWithNibName:NSStringFromClass([self class]) bundle:[NSBundle mainBundle]];
    }

    - (void)viewDidLoad {
        [super viewDidLoad];

        // self.view 就是 xib 文件中的 View
        self.view.backgroundColor = [UIColor blackColor];
    }

MainViewController.m

    @property (strong, nonatomic) BlackViewController *blackViewController;
    @property (strong, nonatomic) UIView *blackView;

    - (void)loadBlackViewFromXIB {

        _blackViewController = [[BlackViewController alloc] initWithNibName:@"BlackViewController" bundle:[NSBundle mainBundle]];

        // 或使用 Conveniece Method，但要求 xib 文件名和 View Controller 类名一致
        _blackViewController = [BlackViewController viewControllerFromNIB];

        _blackView = _blackViewController.view;
        [self.view addSubview:_blackView];

        CGRect frame = _blackView.frame;
        frame.origin.x = _yellowView.frame.origin.x;
        frame.origin.y = _yellowView.frame.origin.y + 80.0f;
        _blackView.frame = frame;
    }

Swift

BlackViewController.xib

同 Objective-C 设置

BlackViewController.swift

    class func viewControllerFromNIB() -> AnyObject {

        return BlackViewController(nibName: "BlackViewController", bundle: NSBundle.mainBundle())
    }

    override func viewDidLoad() {
        super.viewDidLoad()

        self.view.backgroundColor = UIColor.blackColor()
    }

MainViewController.swift

    var blackViewController:BlackViewController!
    var blackView:UIView!

    func loadBlackViewFromXIB() {

        blackViewController = BlackViewController(nibName: "BlackViewController", bundle: NSBundle.mainBundle())

        // 或使用 Conveniece Method，但要求 xib 文件名和 View Controller 类名一致
        blackViewController = BlackViewController.viewControllerFromNIB() as! BlackViewController

        blackView = blackViewController.view;
        self.view.addSubview(blackView)

        var frame = blackView.frame
        frame.origin.x = yellowView.frame.origin.x
        frame.origin.y = yellowView.frame.origin.y + 80.0
        blackView.frame = frame
    }

结论:
- 将 xib 的 File’s Owner 设成一个 UIViewController 子类，可以将这个 xib 文件的视图展示和外部响应事件（例如点击一个按钮触发的点击事件，该视图的手势事件等）全部封装在一个 View Controller 中，如果把按钮的点击事件封装在一个 UIView 类中，貌似破坏了 MVC 模式，因此最好将 xib 的 File’s Owner 设成一个 UIViewController 子类，该类可以通过 addChildViewController 方法将其添加到现有的 View Controller 上。如果只是希望加载视图，可以通过 viewcontroller.view 存取。
- 如果希望 ViewControllerA 加载并响应 aXIBView 中的按钮点击事件，这时必须建立一个 aXIBView 到 ViewControllerA 的 IBAction，如果 ViewControllerA 需要拥有多个这样的 XIB，那么 ViewControllerA 会变得非常的庞大，此时可以通过为每一个 XIB 设置一个 ViewController，再让 ViewControllerA 加载这些 Child View Controllers，这样可以将这些事件的响应职责和视图的描绘工作分派给专门的 Child View Controller，在减小 ViewControllerA 体积的同时，也可以提高各个 xib 的可复用性。
- 这里的 viewControllerFromNIB 方法其实就是 initWithNibName:bundle: 方法的一个简单封装，要求：xib 的 File’s Owner 设为本类。

1.6 通过 UIViewController + NIB 加载 xib 文件中的 View Controller 类和其视图

Objective-C

GrayViewController.xib

UIViewController+NIB.h

    @interface UIViewController (NIB)

    // 要求 xib 文件名和 View Controller 类名一致
    + (instancetype)loadFromNib;

    @end

UIViewController+NIB.m

    @implementation UIViewController (NIB)

    + (instancetype)loadFromNib {

        // [self class] 会由调用的类决定
        return [[[self class] alloc] initWithNibName:NSStringFromClass([self class]) bundle:[NSBundle mainBundle]];
    }

    @end

GrayViewController.h

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

GrayViewController.m

    - (void)viewDidLoad {
        [super viewDidLoad];

        self.view.backgroundColor = [UIColor grayColor];
    }

    // 推荐从 xib 文件中加载 View Controller 的方法，这种方法可以将 xib 文件中的视图和其按钮响应事件全部封装在 GrayViewController
    // 如果 GrayViewController 的按钮响应事件由 MainViewController 作出响应，那么二者的耦合度就过高
    // 建议:
    // 单纯的通用 View 展示，使用从 xib 文件加载视图的方法，File's Owner 设为 nil
    // 特定拥有者的 View 展示，从 xib 文件加载视图时，File's Owner 设为拥有者
    // 如果视图中有按钮响应事件，或其它可以和用户交互的事件，建议采用从 xib 文件中加载 View Controller 的方法，这样可以封装 UI 展示和交互事件

    - (IBAction)action:(UIButton *)sender {

        NSLog(@"action");
    }

MainViewController.m

    @property (strong, nonatomic) GrayViewController *grayViewController;
    @property (strong, nonatomic) UIView *grayView;

    - (void)loadGrayViewFromXIB {

        _grayViewController = [GrayViewController loadFromNib];

        _grayView = _grayViewController.view;
        [self.view addSubview:_grayView];

        CGRect frame = _grayView.frame;
        frame.origin.x = _blackView.frame.origin.x;
        frame.origin.y = _blackView.frame.origin.y + 80.0f;
        _grayView.frame = frame;
    }

结论:
- 这里我专门写了一个 UIViewController+NIB 的 category，只需要调用 loadFromNib 类方法就可以加载 xib 中的视图。要求:
  - xib 文件的 File’s Owner 必须设置为对应的 View Controller 类。

微信关注我们

原文链接：https://yq.aliyun.com/articles/312219

转载内容版权归作者及来源网站所有！

低调大师中文资讯倾力打造互联网数据资讯、行业资源、电子商务、移动互联网、网络营销平台。持续更新报道IT业界、互联网、市场资讯、驱动更新,是最及时权威的产业资讯及硬件资讯报道平台。

iOS - UIStoryboard

前言 NS_CLASS_AVAILABLE_IOS(5_0) @interface UIStoryboard : NSObject @available(iOS 5.0, *) public class UIStoryboard : NSObject StoryBoard 是苹果在 iOS5 中引入的新技术方案，目的是给纷繁复杂的 nib、xib 们一个温暖的家，让他们之间的关系更直观地展示出来，并提供了一种新的页面间跳转方式 Segue。StoryBoard 的本质是一个 XML 文件，描述了若干窗体、组件、Auto Layout 约束等关键信息。Storyboard 不止是包含一个视图控件，而是所有的视图控件以及他们之间的关系。 Storyboard 对一个视图的官方术语是一个场景，但是一个场景其实就是一个 ViewController，用来描述软件界面，在 iPhone 中一次只能够展示一个场景，而在 iPad 中一次可以展示多个场景。一个项目中可以有不止一个 StoryBoard 文件，它们之间可以互相调用。使用 StoryBoard 的 iOS 项目均以初始化 StoryB...

2016-08-09

750

前言 NS_CLASS_AVAILABLE_IOS(6_0) @interface NSLayoutConstraint : NSObject @available(iOS 6.0, *) public class NSLayoutConstraint : NSObject 1）Autolayout 在 Autolayout 之前，有 Autoresizing 可以作屏幕适配，但局限性较大，有些任务根本无法完成（只能解决子控件跟父控件的相对关系问题，不能解决兄弟控件的相对关系问题）。相比之下，Autolayout 的功能比 Autoresizing 强大很多。 Auto Layout 是苹果在 iOS 6 (Xcode 4) 中新引入的布局方式，旨在解决 3.5 寸和 4 寸屏幕的适配问题，由于 Xcode 4 的不给力，当时并没有得到很大推广，自 iOS 7（Xcode 5）开始，Auto Layout 的开发效率得到很大的提升。屏幕适配工作在 iPhone 6 及 plus 发布以后变得更加重要，苹果官方也推荐开发者尽量使用 Autolayout 来布局 UI 界面，Autolay...

2016-08-10

723

资源下载

更多资源

Mario

马里奥是站在游戏界顶峰的超人气多面角色。马里奥靠吃蘑菇成长，特征是大鼻子、头戴帽子、身穿背带裤，还留着胡子。与他的双胞胎兄弟路易基一起，长年担任任天堂的招牌角色。

Spring

Spring框架（Spring Framework）是由Rod Johnson于2002年提出的开源Java企业级应用框架，旨在通过使用JavaBean替代传统EJB实现方式降低企业级编程开发的复杂性。该框架基于简单性、可测试性和松耦合性设计理念，提供核心容器、应用上下文、数据访问集成等模块，支持整合Hibernate、Struts等第三方框架，其适用范围不仅限于服务器端开发，绝大多数Java应用均可从中受益。

Sublime Text

Sublime Text具有漂亮的用户界面和强大的功能，例如代码缩略图，Python的插件，代码段等。还可自定义键绑定，菜单和工具栏。Sublime Text 的主要功能包括：拼写检查，书签，完整的 Python API ， Goto 功能，即时项目切换，多选择，多窗口等等。Sublime Text 是一个跨平台的编辑器，同时支持Windows、Linux、Mac OS X等操作系统。

WebStorm

WebStorm 是jetbrains公司旗下一款JavaScript 开发工具。目前已经被广大中国JS开发者誉为“Web前端开发神器”、“最强大的HTML5编辑器”、“最智能的JavaScript IDE”等。与IntelliJ IDEA同源，继承了IntelliJ IDEA强大的JS部分的功能。

iOS - Xib

前言

1、xib 文件加载

1.1 加载 xib 中 File’s Owner 为 nil 的视图

1.2 加载 xib 中 File’s Owner 为 self 的视图

1.3 加载 xib 中 File’s Owner 为特定类的视图

1.4 加载 xib 中文件名和视图类名一致的视图（File’s Owner 为 nil）

1.5 通过 UIViewController 的 initWithNibName:bundle: 方法加载 xib 文件中的视图

1.6 通过 UIViewController + NIB 加载 xib 文件中的 View Controller 类和其视图

iOS - UIStoryboard

iOS - AutoLayout

相关文章

发表评论

资源下载

Mario

Spring

Sublime Text

WebStorm

欢迎您来访！