自定义控件

方式1：利用init和layoutSubview结合创建子控件

//XMGShopView.h
@interface XMGShopView
@property (nonatomic,weak) UIImageView *imageView;
@property (nonatomic,weak) UILabel *titleLabel;
@end

//XMGShopView.m
@interface XMGShopView()

@end
@implementation XMGShopView
//初始化子控件
//init中不要布局子控件，拿不到frame
-(instancetype)init{
    if(self = [super init]){
        //1.创建商品的UIImageView对象
        UIImageView *imageView = [[UIImageView alloc] init];
        self.imageView = imageView;
        imageView.backgroundColor = [UIColor blueColor];
        [self addSubview:self.imageView];
        //2.创建标题对象
        UILabel *titleLabel = [[UILabel alloc] init];
        self.titleLabel = titleLabel;
        [self addSubview:self.titleLabel];
    }
    return self;
}
//布局子控件，可以拿到frame
-(void)layoutSubviews{
     //一定要调用super
     [super layoutSubviews];
     //获取当前控件的尺寸
     CGFloat width = self.frame.size.width;
     CGFloat height = self.frame.size.height;
     self.imageView.frame = CGRectMake(0,0,width,width);  
     self.titleLabel.frame = CGRectMake(0,width,width,height-width);
        
}

@end

//使用控件
XMGShopView *shopView = [[XMGShopView alloc] init];
shopView.frame = CGRectMake(0,0,100,100);
[self.view addSubview:shopView];

总结：先调用init，创建子控件中的控件，然后再调用layoutSubviews布局子控件中的控件。

方式2：提供接口方法设置数据

//XMGShopView.h
@interface XMGShopView
-(void)setImageView: (NSString *)image;
-(void)setTitle: (NSString *)title;
@end

//XMGShopView.m
@interface XMGShopView()
@property (nonatomic,weak) UIImageView *imageView;
@property (nonatomic,weak) UILabel *titleLabel;
@end
@implementation XMGShopView
//初始化子控件
//init中不要布局子控件，拿不到frame
-(instancetype)init{
    if(self = [super init]){
        //1.创建商品的UIImageView对象
        UIImageView *imageView = [[UIImageView alloc] init];
        self.imageView = imageView;
        imageView.backgroundColor = [UIColor blueColor];
        [self addSubview:self.imageView];
        //2.创建标题对象
        UILabel *titleLabel = [[UILabel alloc] init];
        self.titleLabel = titleLabel;
        [self addSubview:self.titleLabel];
    }
    return self;
}
//布局子控件，可以拿到frame
-(void)layoutSubviews{
     //一定要调用super
     [super layoutSubviews];
     //获取当前控件的尺寸
     CGFloat width = self.frame.size.width;
     CGFloat height = self.frame.size.height;
     self.imageView.frame = CGRectMake(0,0,width,width);  
     self.titleLabel.frame = CGRectMake(0,width,width,height-width);
        
}
-(void)setImageView: (NSString *)image{
     self.imageView.image = [UIImage imageNamed:image];
}
-(void)setTitle: (NSString *)title{
    self.titleLabel.text = title;
}
@end

//使用控件
XMGShopView *shopView = [[XMGShopView alloc] init];
shopView.frame = CGRectMake(0,0,100,100);
[shopView setImageView:@"123"];
[shopView setTitleLabel:@"title"];
[self.view addSubview:shopView];

方式3：利用模型传递数据

//XMGShopView.h
#class XMGShop;
@interface XMGShopView : UIView
@property (nonatomic, strong) XMGShop *shop;
@end

//XMGShopView.m
@interface XMGShopView()
@property (nonatomic,weak) UIImageView *imageView;
@property (nonatomic,weak) UILabel *titleLabel;
@end
@implementation XMGShopView
//初始化子控件
//init中不要布局子控件，拿不到frame
-(instancetype)init{
    if(self = [super init]){
        //1.创建商品的UIImageView对象
        UIImageView *imageView = [[UIImageView alloc] init];
        self.imageView = imageView;
        imageView.backgroundColor = [UIColor blueColor];
        [self addSubview:self.imageView];
        //2.创建标题对象
        UILabel *titleLabel = [[UILabel alloc] init];
        self.titleLabel = titleLabel;
        [self addSubview:self.titleLabel];
    }
    return self;
}
//布局子控件，可以拿到frame
-(void)layoutSubviews{
     //一定要调用super
     [super layoutSubviews];
     //获取当前控件的尺寸
     CGFloat width = self.frame.size.width;
     CGFloat height = self.frame.size.height;
     self.imageView.frame = CGRectMake(0,0,width,width);  
     self.titleLabel.frame = CGRectMake(0,width,width,height-width);
        
}
-(void)setShop: (XMGShop *)shop{
    _shop = shop;
    //设置数据
    self.imageView.image = [UIImage imageNamed:shop.image];
    self.titleLabel.text = shop.title;
}
@end

//使用控件
XMGShopView *shopView = [[XMGShopView alloc] init];
shopView.frame = CGRectMake(0,0,100,100);
shopView.shop = shop;
[self.view addSubview:shopView];

进一步优化：为控件提供构造方法

//XMGShopView.h
#class XMGShop;
@interface XMGShopView : UIView
@property (nonatomic, strong) XMGShop *shop;
-(void)initWithShop:(XMGShop *)shop;
+(void)shopWithShop:(XMGShop *)shop;
@end

//XMGShopView.m
@interface XMGShopView()
@property (nonatomic,weak) UIImageView *imageView;
@property (nonatomic,weak) UILabel *titleLabel;
@end
@implementation XMGShopView
//初始化子控件
//init中不要布局子控件，拿不到frame
-(instancetype)init{
    if(self = [super init]){
       [self setUp]; 
    }
    return self;
}

//布局子控件，可以拿到frame
-(void)layoutSubviews{
     //一定要调用super
     [super layoutSubviews];
     //获取当前控件的尺寸
     CGFloat width = self.frame.size.width;
     CGFloat height = self.frame.size.height;
     self.imageView.frame = CGRectMake(0,0,width,width);  
     self.titleLabel.frame = CGRectMake(0,width,width,height-width);
        
}
-(void)setShop: (XMGShop *)shop{
    _shop = shop;
    //设置数据
    self.imageView.image = [UIImage imageNamed:shop.image];
    self.titleLabel.text = shop.title;
}
-(instancetype)initWithShop:(XMGShop *)shop{
    if(self = [super init]){
        [self setUp] ;
        self.shop = shop;  
    }
    return self;
}
+(instancetype)shopWithShop:(XMGShop *)shop{
    return [[self alloc] initWithShop:shop];
}
-(void)setUp{
    //1.创建商品的UIImageView对象
        UIImageView *imageView = [[UIImageView alloc] init];
        self.imageView = imageView;
        imageView.backgroundColor = [UIColor blueColor];
        [self addSubview:self.imageView];
        //2.创建标题对象
        UILabel *titleLabel = [[UILabel alloc] init];
        self.titleLabel = titleLabel;
       [self addSubview:self.titleLabel];
}
@end

//使用控件
XMGShopView *shopView = [[XMGShopView alloc] initWithShop:shop];
shopView.frame = CGRectMake(0,0,100,100);
[self.view addSubview:shopView];

总结：如果没有模型，就提供接口方法，如果有模型，就利用set方法设置数据

补充：

//XMGShopView.h
#class XMGShop;
@interface XMGShopView : UIView
@property (nonatomic, strong) XMGShop *shop;
@end

//XMGShopView.m
@interface XMGShopView()
@property (nonatomic,weak) UIImageView *imageView;
@property (nonatomic,weak) UILabel *titleLabel;
@end
@implementation XMGShopView
//初始化子控件
//init中不要布局子控件，拿不到frame
-(instancetype)init{
    if(self = [super init]){
        //1.创建商品的UIImageView对象
        UIImageView *imageView = [[UIImageView alloc] init];
        self.imageView = imageView;
        imageView.backgroundColor = [UIColor blueColor];
        [self addSubview:self.imageView];
        //2.创建标题对象
        UILabel *titleLabel = [[UILabel alloc] init];
        self.titleLabel = titleLabel;
        [self addSubview:self.titleLabel];
    }
    return self;
}
//布局子控件，可以拿到frame
-(void)layoutSubviews{
     //一定要调用super
     [super layoutSubviews];
     //获取当前控件的尺寸
     CGFloat width = self.frame.size.width;
     CGFloat height = self.frame.size.height;
     self.imageView.frame = CGRectMake(0,0,width,width);  
     self.titleLabel.frame = CGRectMake(0,width,width,height-width);
        
}
-(void)setShop: (XMGShop *)shop{
    _shop = shop;
    //设置数据
    self.imageView.image = [UIImage imageNamed:shop.image];
    self.titleLabel.text = shop.title;
}
@end

//使用控件
XMGShopView *shopView = [[XMGShopView alloc] init];
shopView.frame = CGRectMake(0,0,100,100);
shopView.shop = shop;
[self.view addSubview:shopView];

进一步优化：为控件提供构造方法

//XMGShopView.h
#class XMGShop;
@interface XMGShopView : UIView
@property (nonatomic, strong) XMGShop *shop;
-(void)initWithShop:(XMGShop *)shop;
+(void)shopWithShop:(XMGShop *)shop;
@end

//XMGShopView.m
@interface XMGShopView()
@property (nonatomic,weak) UIImageView *imageView;
@property (nonatomic,weak) UILabel *titleLabel;
@end
@implementation XMGShopView
//初始化子控件
//init中不要布局子控件，拿不到frame
-(instancetype)init{
    if(self = [super init]){
       [self setUp]; 
    }
    return self;
}
-(instancetype)initWithFrame:(CGRect)frame{
   if(self = [super initWithFrame]){
      [super setUp];
   }
}
//布局子控件，可以拿到frame
-(void)layoutSubviews{
     //一定要调用super
     [super layoutSubviews];
     //获取当前控件的尺寸
     CGFloat width = self.frame.size.width;
     CGFloat height = self.frame.size.height;
     self.imageView.frame = CGRectMake(0,0,width,width);  
     self.titleLabel.frame = CGRectMake(0,width,width,height-width);
        
}
-(void)setShop: (XMGShop *)shop{
    _shop = shop;
    //设置数据
    self.imageView.image = [UIImage imageNamed:shop.image];
    self.titleLabel.text = shop.title;
}
-(instancetype)initWithShop:(XMGShop *)shop{
    if(self = [super init]){
        [self setUp] ;
        self.shop = shop;  
    }
    return self;
}
+(instancetype)shopWithShop:(XMGShop *)shop{
    return [[self alloc] initWithShop:shop];
}
-(void)setUp{
    //1.创建商品的UIImageView对象
        UIImageView *imageView = [[UIImageView alloc] init];
        self.imageView = imageView;
        imageView.backgroundColor = [UIColor blueColor];
        [self addSubview:self.imageView];
        //2.创建标题对象
        UILabel *titleLabel = [[UILabel alloc] init];
        self.titleLabel = titleLabel;
       [self addSubview:self.titleLabel];
}
@end

//使用控件
XMGShopView *shopView = [[XMGShopView alloc] initWithShop:shop];
shopView.frame = CGRectMake(0,0,100,100);
[self.view addSubview:shopView];

总结：外部调用init创建子控件，子控件内部会调用initWithFrame方法，因此，只需要重写initWithFrame方法即可。

view的封装总结：

如果一个view内部的子控件比较多，一般会考虑自定义一个view，把它内部子控件的创建屏蔽起来，不让外界关系

外界可以传入对应的模型数据给view，view拿到模型数据后给内部的子控件设置对应的数据

1.在init或initWithFrame中添加子控件，提供便利的构造方法
2.在layoutSubviews方法中布局子控件的frame（一定要调用super的layoutSubviews）
3.增加模型属性，在模型属性set方法中设置数据到子控件上，如果没有模型，可以提供接口方法设置数据