直播带货系统开发,如何实现直播礼物系统

直播带货系统开发,如何实现直播礼物系统

1. 所有直播带货系统开发的礼物系统,第一步用户看到的无外乎都是礼物的列表界面纵观主流直播间的礼物列表应该都是使用UICollectionView实现的,所以我也不例外,下面就是各种撸代码.效果如下看着效果还不错吧.但是但是我突然发现一个问题.直播带货系统开发的礼物展示的顺序跟我想要的顺序不一样,跟数据的排序也不一致.看图来说黄色的顺序是我们想要的顺序,但是现在顺序确是红色的.为什么呢?我们都知道collectionview的滚动方向是有layout控制的.代码如下UICollectionViewFlowLayout*layout=[[UICollectionViewFlowLayoutalloc]init];layout.itemSize=CGSizeMake(itemW,itemH);layout.minimumLineSpacing=0;layout.minimumInteritemSpacing=0;layout.scrollDirection=UICollectionViewScrollDirectionHorizontal;看代码之后才明白,因为我们设置的滚动方向是横向滚动,所以系统会默认先把垂直方向的Item填充,然后再横向填充,这就不难解释为啥会是这种排序.如果换成垂直滚动呢?这样也不满足我们的需求,既然系统的不行,那么只有拿出独门武器,自定义一个flowlayout吧.让它按照我们的要求去滚动,去排序.-(void)prepareLayout{//自定义layout都必须重写这个方法[superprepareLayout];//设置基本属性CGFloatitemW=SCREEN_WIDTH/4.0;CGFloatitemH=itemW*105/93.8;self.itemSize=CGSizeMake(itemW,itemH);self.minimumLineSpacing=0;self.minimumInteritemSpacing=0;self.scrollDirection=UICollectionViewScrollDirectionHorizontal;//刷新后清除所有已布局的属性重新获取[self.cellAttributesArrayremoveAllObjects];NSIntegercellCount=[self.collectionViewnumberOfItemsInSection:0];for(NSIntegeri=0;i<cellCount;i++){//取出每一个的Item的布局.重新赋值NSIndexPath*indexPath=[NSIndexPathindexPathForRow:iinSection:0];UICollectionViewLayoutAttributes*attibute=[selflayoutAttributesForItemAtIndexPath:indexPath];NSIntegerpage=i/8;//第几页NSIntegerrow=i%4+page*4;//第几列NSIntegercol=i/4-page*2;//第几行attibute.frame=CGRectMake(row*itemW,col*itemH,itemW,itemH);//保存所有已经重新赋值的布局[self.cellAttributesArrayaddObject:attibute];}}-(NSArray<UICollectionViewLayoutAttributes*>*)layoutAttributesForElementsInRect:(CGRect)rect{//返回当前可见区域内的已经计算好的布局returnself.cellAttributesArray;}写出来之后心里沾沾自喜,这样应该可以实现了吧.看看效果吧* 应该可以看出来问题了吧,我选中的那个礼物第一页和第二页竟然都出现了,我明明设置了分页滚动的呀.查看层级结构如下* 原来是可爱的么么哒礼物被挤到外面了.由于没有设置弹簧的效果,所以没太注意少了一个礼物,那么原因呢? 想了好久才想起来是不是滚动的范围不够,导致么么哒不显示在界面中呢?又去扒了扒怎么设置自定义的layout的contentoffset.最终找到一个方法.-(CGSize)collectionViewContentSize{NSIntegercellCount=[self.collectionViewnumberOfItemsInSection:0];NSIntegerpage=cellCount/8+1;returnCGSizeMake(SCREEN_WIDTH*page,0);}但是这样做真的可以么?看看效果吧到此为止基本实现了一个主流直播带货系统开发的礼物列表界面.关于礼物的点击逻辑看看代码就可以了.在此就不多啰嗦了.————————————————声明:本文由云豹科技转发自白衣哥博客,如有侵权请联系作者删除原文链接:https://blog.csdn.net/Keep_Dream/article/details/79917541

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

Proudly powered by WordPress | Theme: HoneyWaves by SpiceThemes