多维度高复用模板开发架构设计(一)
我们要开发一个类似皮肤的功能, 但又有一些模板相关的逻辑.
普通模板.png
相亲模板
以上面这个东西为例, 整体上相亲模板依赖大部分普通模板的功能, 但也有自己的特有功能, 如时间线等, 相亲模板的UI有部分可以复用普通模板, 但细节上会略有不同. 那如何才能高效开发出一套这样的架构呢? 以后可能会有很多类似相亲模板的其它模板, 如何快速完成迭代? 而不是每次都做重复的工作!
这里只给出活动主场景的架构, 下一节再说整个的架构!
@interface MFTemplateMainBaseViewController ()
/**
* 房间信息和房主信息
*/
@property (nonatomic, weak) MFTemplateOwnerInfoView *ownerInfoView;
/**
* 公屏信息
*/
@property (nonatomic, weak) UITableView *chatTableView;
/**
* 音乐播放器
*/
@property (nonatomic, weak) MFPlayerControlView *playerControlView;
/**
* 公屏礼物特效
*/
@property (nonatomic, weak) MFLargeGiftAnimationView *flyingGiftView;
/**
* 送花送礼物飞到头像特效
*/
@property (nonatomic, weak) UIImageView *giftImageView;
/**
* 表情
*/
@property (nonatomic, copy) NSArray<MFSRoomEmotionView *> *emotionViewArray;
/**
* 房主的底部工具条
*/
@property (nonatomic, weak) MFChatRoomOwnerBottomToolView *ownerBottomToolView;
/**
* 非房主的底部工具条
*/
@property (nonatomic, weak) MFChatRoomNonOwnerBottomToolView *nonOwnerBottomToolView;
/**
* 和活动相关的
*/
@property (nonatomic, weak) MFGiftDropingView *giftView;
@property (nonatomic, weak) UIButton *activityEntranceButton;
@property (nonatomic, weak) UILabel *scoreLabel;
@property (nonatomic, assign) int giftCount;
@property (nonatomic, assign) BOOL isViewAppear;
/**
* 数据
*/
@property (nonatomic, strong) NSMutableArray *msgArrayM;
@property (nonatomic, copy) NSArray *showMsgArray;
@property (nonatomic, strong) NSMutableArray *sendingGiftAnimationList;
@property (nonatomic, strong) NSMutableArray *flyingGiftAnimationList;
@property (nonatomic, strong) MFTemplateMainBaseViewAttribute *layoutAttr;
/**
* 临时变量
*/
@property (nonatomic, assign) NSUInteger selectedUid;
@property (nonatomic, assign) NSUInteger selectedSeatIndex; //只有在点击空座位的时候才设置值 senderUid;
@property (nonatomic, assign, getter=isForceShowQueueBtn) BOOL forceShowQueueBtn;
@property (nonatomic, strong) MFTemplateMainBaseViewModel *viewModel;
@property (nonatomic, strong) MFChatRoomViewModel *chatRoomViewModel;
@property (nonatomic, strong) MFChatRoomClickHandler *msgClickHandler;
@property (nonatomic, strong) BSRichTextParserManager *richTextParser;
@property (nonatomic, strong) BSTimer *chatMsgTimer;
@property (nonatomic, strong) AnimationUtility *animationUtility;
/**
* 弹出的
*/
@property (nonatomic, strong) MFChatRoomTopicViewController *topicViewController;
@property (nonatomic, strong) BSActionSheet *seatSheetAction;
@property (nonatomic, readonly) MFRoomTemplateType roomType;
@end
上面的代码是所有基础功能的VC, 所有模板通用的逻辑, UI都在这里做, 比如这里有一个公屏chatTableView, 这里的逻辑都是通用的, 只是frame稍有不同, 这里会根据roomType动态设置这个frame, 还有MFTemplateOwnerInfoView这个UI可能不同的模板差异很大, 但是数据都是一样的, 这样就可以在MFTemplateOwnerInfoView中根据模板类型去加载不同的View.只要保证View的数据接口一致就可以通过运行时来设置数据.
下面看下基础模板的m文件
@interface MFNormalMainViewController ()<MFTemplateMainBaseViewControllerDelegate>
@property (nonatomic, strong) MFTemplateMainBaseViewController *templateBaseViewController;
@end
由于基础模板除了基础功能外没有其他的功能和UI, 所以这里只要持有MFTemplateMainBaseViewController就行了, 再看下相亲模板的m文件
@interface MFAppointmentMainViewController ()<MFTemplateMainBaseViewControllerDelegate>
@property (nonatomic, strong) MFTemplateMainBaseViewController *templateBaseViewController;
@property (nonatomic, weak) MFAppointmentTimelineView *timeLineView;
@property (nonatomic, weak) UIButton *joinGameBtn;
@property (nonatomic, strong) MFTemplateMainBaseViewModel *viewModel;
@property (nonatomic, strong) NSMutableArray<MFLoveInfo *> *loverInfoArray;
@end
相亲模板除了基础的UI功能还有些特有的功能,如时间线等, 这样通过持有MFTemplateMainBaseViewController对所有基础的功能进行控制, 自己也可以控制相亲模板特有的功能.
为什么说是多维度?
维度1: 对于不同的模板, 如果你希望拥有基础模板的功能, 那请你拿好MFTemplateMainBaseViewController, 如果你新的模板完全不需要基础模板的功能, 请放弃持有. MFTemplateMainBaseViewController本身作为活动的主场景, 它只是相亲模板众多模块中的一个, 这里放到下节细说模板的构成.
维度2:根据不同的模板类型MFTemplateOwnerInfoView, MFPlayerControlView等都是可定制可拆卸的, 如果你有个模板不需要MFPlayerControlView但是需要MFTemplateOwnerInfoView, 那么持有MFTemplateMainBaseViewController不会有任何影响, 只要在MFPlayerControlView的代理里告诉它, 我不要你就行了.而具体的View是在MFPlayerControlView根据类型装配的, 所以你可以丰富你的基础功能组件(一些通用的UIView和功能).
好了, 下节继续讲述模板整体的构成.
