前言
高仿猫眼选票模块,因为公司业务需求,要对接猫眼电影,网上也没有很完整的库,所以就结合了ZFSeatsSelection以及其他几个库封装一个符合公司要求的电影选座模块。
在基础的选座功能上实现了情侣座的选择和是否落单的判断
实现效果
6fc722f7-8491-434a-8b07-c1aa35123add的副本.gif实现方式
选座模块总体分为三块:
- 座位图,猫眼数据中会包含行列信息,将座位根据行列信息画到ScrollView
- 索引,根据总行数画出索引条,在视图缩放时根据座位图的最新高度调整索引条的大小、位置
- 小地图,将座位图截图放到小地图上,在移动、缩放时根据当前座位图显示范围经转换坐标、然后等比例缩放就有了小地图中红框的范围
CGRect displayFrame = CGRectMake(self.contentOffset.x, self.contentOffset.y, self.width, self.height);
CGRect contentDisplayFrame = CGRectIntersection(displayFrame, _contentView.frame);
contentDisplayFrame = [self convertRect:contentDisplayFrame toView:_contentView];
CGFloat scale = (_indicatorView.width - 6) / _contentView.width;
[_indicatorView updateMiniIndicatorWithDisplayRect:(CGRect){
contentDisplayFrame.origin.x * scale * self.zoomScale,
contentDisplayFrame.origin.y * scale * self.zoomScale,
contentDisplayFrame.size.width * scale * self.zoomScale,
contentDisplayFrame.size.height * scale * self.zoomScale
}];
- 接下来就是处理缩放选中等功能,借助系统UIScrollView的缩放功能可以很容易实现,注意要将座位图整体座位要缩放的单位,不要将索引、logo等其他不需要缩放的视图放到座位图上面
- 最后就是是否落单的判断,检查规则:
- 只检查同行
- 不检查情侣座位
- 只有一边有空座位则为不落单
- 两边都有空座且至少有一边为单个座位为落单
到此,整个功能就已经实现,代码已经发布到Github上面: YSSeatsPicker
网友评论