视图：

代码：

UICollectionReusableView {
    name = ZSIndexHeaderMenu;
    onlyCreate = view;
    bgColor = random;
    toPath = ZhongShuo/AppSetup/Section/Index;
    edges = 0;
    
    horizontalViews {
        ZSIndexHeaderMenuItem {
            text = "品牌制造商直供";
        }
        ZSIndexHeaderMenuItem {
            id = label02;
            text = "30天无理由退换";
        }
        ZSIndexHeaderMenuItem {
            text = "服务运营商";
        }
    }
}

UIView {
    name = ZSIndexHeaderMenuItem;
    onlyCreate = view;
    bgColor = #feffff;
    toPath = ZhongShuo/AppSetup/Section/Index;
    edges = 0;
    
    UILabel {
        id = titleLabel;
        centerY = parent;
        centerX = parent.centerX.-8;
        font = 10;
    }
    
    UIImageView {
        id = imageView;
        width.height = 15;
        centerY = parent;
        right = titleLabel.left.-3;
        bgColor = random;
    }
    
    exportProperty {
        NSString {
            id = text;
            from = titleLabel.text;
        }
        UIImage {
            id = image;
            from = imageView.image;
        }
    }
}

其中 horizontalViews 水平布局，exportProperty 外置属性是本次编写创造出来的。

通过 exportProperty，

exportProperty {
        NSString {
            id = text;
            from = titleLabel.text;
        }
        UIImage {
            id = image;
            from = imageView.image;
        }
    }

创造出 ZSIndexHeaderMenuItem.h 里面的

@property (nonatomic, weak) NSString* text;

@property (nonatomic, weak) UIImage* image;

以及 ZSIndexHeaderMenuItem.m 里面的

#pragma mark - 自定义属性

- (void) setText: (NSString*) text {
    self.titleLabel.text = text;
}

- (NSString*) text {
    return self.titleLabel.text;
}

- (void) setImage: (UIImage*) image {
    self.imageView.image = image;
}

- (UIImage*) image {
    return self.imageView.image;
}

实际转换OC的是

#import <UIKit/UIKit.h>

#import "QSKit.h"


@protocol ZSIndexHeaderMenuItemDelegate;

@interface ZSIndexHeaderMenuItem : UIView

#pragma mark - 属性
@property (nonatomic, weak) UIView* theLoadView;

@property (nonatomic, weak) UILabel* titleLabel;

@property (nonatomic, weak) UIImageView* imageView;

@property (nonatomic, weak) NSString* text;

@property (nonatomic, weak) UIImage* image;

//自动创建的协议
@property (nonatomic, weak) id<ZSIndexHeaderMenuItemDelegate> delegate;

#pragma mark - 方法
- (void) addToSuper: (id) aSuper;

//重写这个方法可以定义上面方法的布局样式，返回 YES 生效。
- (BOOL) addToSuperWithSetupLayoutFromSuperView:(UIView*)aSuperView;

@end

@protocol ZSIndexHeaderMenuItemDelegate <NSObject>

//写上需要的协议方法：

@end

#import "ZSIndexHeaderMenuItem.h"

#import "Masonry.h"

@interface ZSIndexHeaderMenuItem ()

@end

@implementation ZSIndexHeaderMenuItem

#pragma mark - 内置的方法
- (void) addToSuper:(id)aSuper {
    if ([aSuper isKindOfClass:[UIViewController class]]) {
        UIViewController* tempController = aSuper;
        [self addToSuper:[tempController view]];
        return;
    }
    if ([aSuper isKindOfClass:[UIView class]]) {
        UIView* tempView = aSuper;
        [tempView addSubview:self];
        
        if ([self addToSuperWithSetupLayoutFromSuperView:tempView] == NO) {
            [self mas_remakeConstraints:^(MASConstraintMaker *make) {
                make.edges.mas_equalTo(0);
            }];
        }
        return;
    }
}
- (BOOL) addToSuperWithSetupLayoutFromSuperView:(UIView*)aSuperView {
    
    return NO;
}
#pragma mark - 初始的方法
- (instancetype) init {
    if (self = [super init]) {
        [self setupUI];
    }
    return self;
}
- (instancetype) initWithFrame:(CGRect)frame {
    if (self = [super initWithFrame:frame]) {
        [self setupUI];
    }
    return self;
}
#pragma mark - 配置界面的方法
- (void) setupUI {
    if (self.theLoadView) {
        return;
    }
    
    #pragma mark - UI - init - theLoadView
    UIView* theLoadView = [UIView new];
    theLoadView.backgroundColor = [QSKit color:@"#feffff"];
    [self addSubview:theLoadView];
    [theLoadView mas_makeConstraints:^(MASConstraintMaker *make) {
        
        make.edges.mas_equalTo(0);
    }];
    self.theLoadView = theLoadView;
        
    
    #pragma mark - UI - init - titleLabel
    UILabel* titleLabel = [UILabel new];
    titleLabel.font = [UIFont systemFontOfSize:10];
    [theLoadView addSubview:titleLabel];
    [titleLabel mas_makeConstraints:^(MASConstraintMaker *make) {
        
        make.centerY.mas_equalTo(theLoadView);
        make.centerX.mas_equalTo(theLoadView.mas_centerX).offset(-8);
    }];
    self.titleLabel = titleLabel;
        
    
    #pragma mark - UI - init - imageView
    UIImageView* imageView = [UIImageView new];
    imageView.backgroundColor = [QSKit color:@"random"];
    [theLoadView addSubview:imageView];
    [imageView mas_makeConstraints:^(MASConstraintMaker *make) {
        
        make.right.mas_equalTo(titleLabel.mas_left).offset(-3);
        make.width.height.mas_equalTo(15);
        make.centerY.mas_equalTo(theLoadView);
    }];
    self.imageView = imageView;
        
    
}

#pragma mark - 自定义属性

- (void) setText: (NSString*) text {
    self.titleLabel.text = text;
}

- (NSString*) text {
    return self.titleLabel.text;
}

- (void) setImage: (UIImage*) image {
    self.imageView.image = image;
}

- (UIImage*) image {
    return self.imageView.image;
}

@end