CircleLayout圆形布局

作者: 随梦而飞飞 | 来源:发表于2016-03-12 13:46 被阅读2844次
    • 我们先看一下 效果图


      效果图
    • 代码:

    #import "CircleLayout.h"
    @interface CircleLayout ()
    @property(nonatomic,strong)NSMutableArray * attrsArr;
    @end
    
    @implementation CircleLayout
    #pragma mark ---- 懒加载
    
    -(NSMutableArray *)attrsArr
    {
        if(!_attrsArr){
            _attrsArr=[[NSMutableArray alloc] init];
        }
        return _attrsArr;
    }
    
    -(void)prepareLayout
    {
        [super prepareLayout];
        [self.attrsArr removeAllObjects];
        [self creatAttrs];
    }
    -(void)creatAttrs{
        //计算出每组有多少个
        NSInteger  count=[self.collectionView numberOfItemsInSection:0];
        /**
         * 因为不是继承流水布局 UICollectionViewFlowLayout
         * 所以我们需要自己创建 UICollectionViewLayoutAttributes
         */
        //如果是多组的话  需要2层循环
        for (int i=0; i<count; i++) {
            //创建UICollectionViewLayoutAttributes
            NSIndexPath * indexPath = [NSIndexPath indexPathForItem:i inSection:0];
            //这里需要 告诉 UICollectionViewLayoutAttributes 是哪里的attrs
            UICollectionViewLayoutAttributes * attrs=[self layoutAttributesForItemAtIndexPath:indexPath];
            [self.attrsArr addObject:attrs];
        }
    }
    
    -(NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect
    {
        //TODO:  特别注意 在这个方法里 可以边滑动边刷新(添加) attrs 一劳永逸 如果只需要添加一次的话  可以把这些 prepareLayout方法中去
        return self.attrsArr;
    }
    
    #pragma mark ---- 这个方法需要返回indexPath位置对应cell的布局属性
    /**
     *  //TODO:  这个方法主要用于 切换布局的时候 如果不适用该方法 就不会切换布局的时候会报错
     *   reason: 'no UICollectionViewLayoutAttributes instance for -layoutAttributesForItemAtIndexPath: <NSIndexPath: 0xc000000000400016> {length = 2, path = 0 - 2}'
     */
    -(UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)indexPath
    {
       //TODO: 主要是返回每个indexPath的attrs
    
        //创建UICollectionViewLayoutAttributes
        //这里需要 告诉 UICollectionViewLayoutAttributes 是哪里的attrs
        //计算出每组有多少个
        NSInteger  count=[self.collectionView numberOfItemsInSection:0];
        //角度
        CGFloat angle = 2* M_PI /count *indexPath.item;
        //设置半径
        CGFloat radius=100;
        //CollectionView的圆心的位置
        CGFloat Ox = self.collectionView.frame.size.width/2;
        CGFloat Oy = self.collectionView.frame.size.height/2;
        UICollectionViewLayoutAttributes * attrs=[UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:indexPath];
        attrs.center =  CGPointMake(Ox+radius*sin(angle), Oy+radius*cos(angle));
        if (count==1) {
            attrs.size=CGSizeMake(200, 200);
        }else{
            attrs.size=CGSizeMake(50, 50);
        }
        return attrs;
    }
    @end
    
    • 删除Item
    在ViewController中
    #pragma mark ----  点击item的方法
    -(void)collectionView:(UICollectionView *)collectionView didSelectItemAtIndexPath:(NSIndexPath *)indexPath
    {
        [self.dataArr removeObjectAtIndex:indexPath.item];
        //TODO:  这个方法 特别注意 删除item的方法
        [self.myCollectionView deleteItemsAtIndexPaths:@[indexPath]];
    }
    

    参考Demo: GitHub地址
    上一篇:LineLayout
    下一篇:SquareLayout方形布局

    相关文章

      网友评论

      本文标题:CircleLayout圆形布局

      本文链接:https://www.haomeiwen.com/subject/bayxlttx.html