最近做了个类似微信朋友圈分享时的图片编辑(包括拖拽、排序、添加、删除等)的功能。但比微信更麻烦的是:一屏中有多组图片同时可编辑,效果类似下面:
WechatIMG1.png
针对此样式,实现思路如下:
1、页面最底层为TableView;
2、三组可编辑的图片分别对应三个CollectionView填充到TableView的Cell中;
3、要实现全屏幕拖拽,三个CollectionView的Frame需要填充整个屏幕(背景透明),通过控制Layout.sectionInset属性,来决定其可视的显示位置;
4、三个CollectionView均有相应的手势坐标识别逻辑,但仅选其中之一真正相应屏幕手势,其余两个则通过坐标判断来进行调用;
5、最后,对CollectionView行高的计算和布局刷新要在TableView中也联动进行。
而具体的手势识别、拖拽、排序这些效果就不在这里赘述,网上有很多文章参考。
另外这里也不粘贴代码了,特意写了个demo,更为实用。已经尽量将无关业务剥离,但时间有限,如有问题,留言沟通~
网友评论