IOS xib和代码自定义UIView
https://www.jianshu.com/p/1bcc29653085 总结的比较好
iOS开发中,我们常常将一块View封装起来,以便于统一管理内部的子控件。
下面就来说说自定义View的封装以及它的多种实现方式
自定义UIView(控件)的封装
什么是View的封装
- 如果一个View的内部子控件比较多,一般会考虑自定义一个View,把它内部子控件的创建屏蔽起来,不让外部关心。
- 外界传入对应的数据模型给view。view拿到数据模型之后给内部的子控件设置对应的数据。
封装自定义控件的基本步骤
- 重写
- (instancetype)initWithFrame方法,在此方法中创建并添加子控件。 - 提供一个便利的构造方法,通常为 类方法,快速创建一个实例对象
- 重写
- (void)layoutSubviews方法,在此方法中设置子控件的frame,一定要调用[super layoutSubviews] - 设置模型属性,在set方法中,给对应的子控件赋值。
看代码
XYBookView.h 头文件
#import <UIKit/UIKit.h>
@class XYBook;
@interface XYBookView : UIView
// 只放一个数据属性用来赋值,内部布局,放到.m 中自己管,不暴露给外界
@property (nonatomic, strong) XYBook *book;
@end
实现文件 .m文件
#import "XYBookView.h"
#include "XYBook.h"
@interface XYBookView ()
// 两个内部子控件在内部包装起来,不给外界看到
@property (nonatomic, weak) UIImageView *icon;
@property (nonatomic, weak) UILabel *label;
@end
@implementation XYBookView
// 1.重写initWithFrame:方法,创建子控件并添加到自己上面
- (instancetype)initWithFrame:(CGRect)frame
{
if (self = [super initWithFrame:frame]) {
// 1. 创建书图标
UIImageView *icon = [UIImageView new];
self.icon = icon;
[self addSubview:self.icon];
// 2.书名
UILabel *bookName = [UILabel new];
bookName.textAlignment = NSTextAlignmentCenter;
self.label = bookName;
[self addSubview:self.label];
}
return self;
}
// 2.重写layoutSubviews,给自己内部子控件设置frame
- (void)layoutSubviews
{
[super layoutSubviews];
CGSize size = self.frame.size;
self.icon.frame = CGRectMake(0, 0, size.width , size.height * 0.7);
self.label.frame = CGRectMake(0, size.height * 0.7, size.width, size.height *(1 - 0.7));
}
// 3.调用模型的set方法,给书的子控件赋值,
- (void)setBook:(XYBook *)book
{
_book = book;
self.icon.image = [UIImage imageNamed:book.icon];
self.label.text = book.name;
}
@end
以上是纯代码实现的View的封装,写起来有些麻烦。
开发中另一种常用的封装方式是Xib,下面介绍Xib的相关知识。
XIB和Storyboard的比较
共同点
- 都是用来描述软件界面
- 最后都是 Interface Builder工具来编译
- 本质上都是转化成代码去创建控件
不同点
- Xib是轻量级的,用来描述局部的UI界面
- Storyboard是重量级的,不仅可以用来描述整个应用的多个页面,而且可以展示页面间的跳转关系。
Xib的创建

Xib的使用
Xib的加载方式
Xib作为局部UI的描述文件,它也是一种项目内的资源文件,在项目中查找路劲也是在[UIBundle mainBundle]中,它的加载方式有两种
方式1
在对应的mainBundle中加载XYBookView类型的nib文件,返回是数组,取数组中对应的view即可
NSArray *views = [[NSBundle mainBundle] loadNibNamed:@"XYBookView" owner:nil options:nil];
XYBookView *bookView = views.firstObject;
方式2
Xib/Storyboard文件编译之后生成的都是 Nib文件,加载XYBookView.xib对应的.nib文件,通过.nib文件实例化的数组中取到对应的XYBookView实例对象。
UINib *nib = [UINib nibWithNibName:@"XYBookView" bundle:nil];
XYBookView *bookView = [[nib instantiateWithOwner:nil options:nil] firstObject];
使用注意
- 进行类绑定,告诉Xib它是什么类型,用来描述那个文件
- 通常Xib文件名和要描述的文件同名,易于辨认和管理

Xib的使用细节完善
- Xib用来描述控件,是把原来代码创建的内容直接用图形化来展示了
- Xib里面的子控件需要拖线到对应文件中,以便文件内赋值和其他使用

封装Xib的加载过程
#import "XYBookView.h"
@interface XYBookView ()
// 封装一个快速返回实例对象的类方法
+ (instancetype)bookView;
@end
@implementation XYBookView
+ (instancetype)bookView
{
// 封装Xib的加载过程
return [[NSBundle mainBundle] loadNibNamed:@"XYBookView" owner:nil options:nil].firstObject;
}
小结
一个控件有两种创建方式
- 通过代码创建
- 初始化一定会调用
-(instancetype)initWithFrame:方法
- 初始化一定会调用
- 通过Xib\StoryBoard创建
- 初始化不会调用
-(instancetype)initWithFrame:方法,只会调用-(instancetype)initWithCoder:方法 - 初始化完成之后,回调用
awakeFromNib方法
- 初始化不会调用
通过两种加载方式,可以发现:有时候我们希望在控件初始化时做一些初始化的操作,如添加子控件,设置属性等,这时候需要根据控件的加载方式来选择-(instancetype)initWithFrame:,-(instancetype)initWithCoder:,awakeFromNib三个方法中的哪个方法进行初始化。
IOS xib和代码自定义UIView的更多相关文章
- 使用代码自定义UIView注意一二三
文/CoderAO(简书作者)原文链接:http://www.jianshu.com/p/68b383b129f9著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 当一撮样式一样的视图在 ...
- iOS 启动画面 代码自定义
先来看一个可能会遇到的问题: 如果你已经删除了xcode为你的项目自动生成的LaunchScreen.storyboard, 然后你在测试你的app的时候发现,屏幕里出现了黑色的区域,如上图(画红线的 ...
- ios xib和代码的frame布局 iOSXib布局后代码修改约束的值
如何修改autolayout 约束的值? 1 2 3 4 5 6 目前我已知的方法有5种 1.修改frame(有时候可能会不起作用,但可以做动画) 2.修改约束的float值 3.使用VisualFo ...
- IOS自定义UIView
IOS中一般会用到几种方式自定义UIView 1.继承之UIView的存代码的自定义View 2.使用xib和代码一起使用的自定义View 3.存xib的自定义View(不需要业务处理的那种) 本文主 ...
- ios开发UI篇—使用纯代码自定义UItableviewcell实现一个简单的微博界面布局
本文转自 :http://www.cnblogs.com/wendingding/p/3761730.html ios开发UI篇—使用纯代码自定义UItableviewcell实现一个简单的微博界面布 ...
- iOS开发小技巧--纯代码自定义cell
纯代码自定义cell 自定义cell的步骤(每个cell的高度不一样,每个cell里面显示的内容也不一样) 1.新建一个继承自UITableViewCell的子类 2.在initWithStyle:方 ...
- [iOS基础控件 - 6.7] 微博展示 使用代码自定义TableCell(动态尺寸)
A.需求 1.类似于微博内容的展示 2.头像 3.名字 4.会员标志 5.内容 6.分割线 7.配图(可选,可有可无) code source: https://github.com/hellov ...
- iOS开发备忘录:自定义UINavigationBar背景图片和Back按钮
iOS项目,根据设计图,有时需要自定义UIView的UINavigationBar的背景.可以切出来一张1像素左右的背景图片,来充当UINavigationBar的背景. 可以利用Navigation ...
- 使用xib封装一个自定义view的步骤
使用xib封装一个自定义view的步骤 1> 新建一个继承UIView的自定义view,假设类名叫做(MJAppView) 2> 新建一个MJAppView.xib文件来描述MJAppVi ...
随机推荐
- [UE4]Named Slot
用户创建的UI成为其他UI的子控件的时候,默认情况下是不能拥有子控件的,给UI添加一个Named Slot,这个UI就可以拥有子控件 一.创建一个名为testNameSlot的UI,添加3个Named ...
- HTML---仿网易新闻登录页
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Angularjs启动入口, splash画面,与加快启动的技巧
Angularjs启动入口, splash画面,与加快启动的技巧 Angularjs启动入口 * 自动响应DOMContentLoaded event * 从ngApp指定的入口启动: 在angula ...
- Java 身份证号码验证
身份证号码验证 1.号码的结构 公民身份号码是特征组合码,由十七位数字本体码和一位校验码组成.排列顺序从左至右依次为:六位数字地址码,八位数字出生日期码,三位数字顺序码和一位数字校验码 2.地址码(前 ...
- JAVA 注解,泛型,反射获取泛型,并实例化
JAVA 的泛型加大了 编程的灵活性,在配合上反射,可以让我们省去大量的重复代码,当你用 SpringBoot 整合 JPA 的时候 你会发现,你的 DAO 层只需要继承 BaseDao,在显示标明泛 ...
- ReactNative项目结构目录详解
在使用 react-native init TestProject 在新建项目时,会看到如下目录 React Native结构目录 名称 描述 android目录 Android项目目录,包含了使用A ...
- Linux简单学习
参考自:http://www.runoob.com/linux/linux-tutorial.html 一.是什么 Linux 类Unix操作系统.是一个基于POSIX和UNIX的多用户.多任务.支 ...
- 微商城项目 请求接口封装中出现 callback && callback() 原理
http://www.imooc.com/wenda/detail/522579 因为逻辑运算符&& ||通常具有短路求值的特性即,如果只求部分值就可以得到整个表达式的值,那么剩下的部 ...
- Halcom学习笔记1——Halcon知识点
文件: 1.浏览HDevelop示例程序 2.程序另存在:Ctrl+Shift+S 3.导出:Ctrl+Shift+O X 编辑: 1.快捷键: F3 激活 F4 注销 重复查找:C ...
- IP路由配置之---------配置PPP
实验设备:两台华三路由器,两台PC,一条V.35线 PPP是数据链路层的协议,链路层的协议有很多如帧中继fr等 实验一,PAP验证(是一种以明码传送用户名和密码的验证方式) 步骤一,在主验证方设置一个 ...