1. 自定义UICollectionLayout ---- 正三角形居中布局

支持多个图形的自动布局

2. 自定义UICollectionLayout ---- 正方形居中布局

滚动展示的区域

3. 自定义UICollectionLayout ---- 正六边形居中布局(蜂窝布局)

等等正n变形布局,其中 正六边形支持 间距大小的改变,图形的旋转。

旋转 --

间距

4. 核心代码 ---- 绘制正n边形 (贝塞尔曲线)

- (void)layoutSubviews
{
    [super layoutSubviews];
    // step 1: 绘制正n变形
    CGFloat X = self.contentView.frame.size.width  * 0.5;
    CGFloat Y = self.contentView.frame.size.height * 0.5;
    UIBezierPath* bezierPath = [UIBezierPath bezierPath];
    bezierPath.lineCapStyle = kCGLineCapRound;
    bezierPath.lineJoinStyle = kCGLineCapRound;
    CGFloat angle = labs(360/self.number);
    [bezierPath moveToPoint: CGPointMake(X - mm , Y)];
    for (int i = 0; i < self.number - 1; i ++) {
        CGFloat angle1 = angle *(i + 1);
        CGFloat XX = X + (mm * (COS(angle1)))*(-1);
        CGFloat YY = Y + mm * (SIN(angle1));
        [bezierPath addLineToPoint: CGPointMake(XX, YY)];
    }
    [bezierPath addLineToPoint: CGPointMake(X - mm , Y)];
    // step 2: 根据路径生成蒙板
    CAShapeLayer *maskLayer = [CAShapeLayer layer];
    maskLayer.path = [bezierPath CGPath];

    self.backgroundColor = [UIColor redColor];
    // step 3: 给cell添加模版
    self.layer.mask = maskLayer;
    self.titleLabel.frame = self.bounds;
}

5. 核心代码 ---  自定义Layout布局

- (void)prepareLayout
{
    [super prepareLayout];
    _itemCount = [self.collectionView numberOfItemsInSection:];
    _attributeAttay = [[NSMutableArray alloc]init];
     ; i < _itemCount; i ++) {
        //设置第一个正六边形的中心位置
        CGFloat X = self.collectionView.frame.size.width*0.5;
        CGFloat Y = self.TopMargin;
         == ? -:i%;
         == ? :i%;
        X += CST(-num)*([self judgeXWithNumber:self.number]);
        Y += ([self judgeSizeWithNumber:self.number].height + self.margin)*(i/) + CST(num2)*([self judgeSizeWithNumber:self.number].height/)+self.margin;
        UICollectionViewLayoutAttributes *attribute = [UICollectionViewLayoutAttributes layoutAttributesForCellWithIndexPath:[NSIndexPath indexPathForRow:i inSection:]];
        // 设置每隔item的大小
        attribute.size = [self judgeSizeWithNumber:self.number];
        // 设置每隔item的圆心
        // 计算每个item的中心坐标
        attribute.center = CGPointMake(X, Y);
        [_attributeAttay addObject:attribute];
    }
}

// X轴方向的间隔
- (CGFloat)judgeXWithNumber:(NSInteger)xNumber
{
     ) {
        /xNumber)*mm;
    }
    )
    {
        /xNumber)*mm;
    }
    )
    {
        /xNumber)*mm - ;
    }
    )
    {
        /xNumber)*mm;
    }
    )
    {
        /xNumber)*mm;
    }
    else
    {
        *mm + self.margin ;
    }
}

// 就算正n变形的大小
- (CGSize)judgeSizeWithNumber:(NSInteger)sNumber
{
     || sNumber ==  ) {
        *mm,*SIN(/sNumber)*mm);
    }
    else
    {
        *(mm),*mm);
    }
}

//设置内容区域的大小
-(CGSize)collectionViewContentSize
{
    CGFloat hh = [self judgeSizeWithNumber:self.number].height;
    CGFloat height = (hh+self.margin)*(self.itemCount/ + ) + self.TopMargin + ;
    if (height > Device_height) {
        height = height;
    }
    else
    {
        height = Device_height;
    }

    return CGSizeMake(Device_width, height);
}

//返回设置数组
-(NSArray<UICollectionViewLayoutAttributes *> *)layoutAttributesForElementsInRect:(CGRect)rect{
    return _attributeAttay;
}

View Layout

自定义 ---UICollectionViewLayout-正N变形居中布局的更多相关文章

  1. 自定义UICollectionViewLayout 布局实现瀑布流

    自定义 UICollectionViewLayout 布局,实现瀑布流:UICollectionView和UICollectionViewCell 另行创建,这只是布局文件, 外界控制器只要遵守协议并 ...

  2. iOS 关于自定义UICollectionViewLayout实现复杂布局

    UICollectionView的简单介绍 UICollectionView的结构 Cells Supplementary Views 追加视图 (类似Header或者Footer) Decorati ...

  3. 自定义UICollectionViewLayout并添加UIDynamic - scorpiozj(转)

    转载自:http://www.tuicool.com/articles/jM77Vf     自定义UICollectionViewLayout并添加UIDynamic UICollectionVie ...

  4. 自定义UICollectionViewLayout并添加UIDynamic

    大家也可以到这里查看. UICollectionView是iOS6引入的控件,而UIDynamicAnimator是iOS7上新添加的框架.本文主要涵盖3部分: 一是简单概括UICollectionV ...

  5. 自定义UICollectionViewLayout 实现瀑布流

    今天研究了一下自定义UICollectionViewLayout. 看了看官方文档,要自定义UICollectionViewLayout,需要创建一个UICollectionViewLayout的子类 ...

  6. 自定义UICollectionViewLayout之CATransform3D

    1.自定义UICollectionViewLayout旋转效果 之前有自定义UICollectionViewLayout(适用于多个section),本文是一个对cell进行CATransform3D ...

  7. CSS居中布局总结【转】

    居中布局 <div class="parent"> <div class="child">demo</div> </d ...

  8. CSS居中布局总结

    居中布局 <div class="parent"> <div class="child">demo</div> </d ...

  9. sass—使用自定义function和@each实现栅格布局

    /*使用自定义function和@each实现栅格布局*/ @function buildLayout($num: 5){ $map: (defaultValue: 0); //不能直接生成col,需 ...

随机推荐

  1. [CTS2019]氪金手游(容斥+树形背包DP)

    降智好题.本蒟蒻VP时没想到怎么做被题面迷惑了,只会20分的“好”成绩.简直自闭了. 首先显然度为0的点是白给的,根据等比数列求和公式即可求得.然后考虑这个树如果是一颗外向树,就是每个点先父亲再自己. ...

  2. Unittest - Python 使用总结

    Unittest - Python 使用总结 批量执行 一.UnitTest TestSuite 控制用例执行的顺序 UnitTest 框架默认 main() 方法根据 ASCII 码的顺序加载测试用 ...

  3. java.lang.NoSuchMethodError: org.springframework.util.Assert.notNull(Ljava/lang/Object;Ljava/util/function/Supplier;)V

    分析,jar包冲突,然后看pom.xml文件 原因在于jar包冲突,版本不兼容, 错误的代码:  可以看到有很多不同版本的重复的spring-test依赖 <dependency> < ...

  4. WAIC | 奇点云携「酷炫AI应用」亮相2019世界人工智能大会

    你是否还在疑惑“人工智能可否改变世界?” 那么,你该有一些危机感了. 机器视觉.自然语言处理.智能语音.机器人问诊.智慧驾驶……这些AI技术及应用早已渗入了我们日常生活的点滴. 29日,以「智联世界, ...

  5. 59)PHP,管理员表中所存在的项

    用户ID 用户名 用户密码 用户权限(就是他的角色等级,比如是1级  2级,  三级等等) 上次登录的IP 上次登录的时间

  6. leetcode第38题:报数

    这是一道简单题,但是我做了很久,主要难度在读题和理解题上. 思路:给定一个数字,返回这个数字报数数列.我们可以通过从1开始,不断扩展到n的数列.数列的值为前一个数列的count+num,所以我们不断叠 ...

  7. [LC] 8. String to Integer (atoi)

    Implement atoi which converts a string to an integer. The function first discards as many whitespace ...

  8. git本地仓库目录问题

    git安装后修改默认的路径:每次打开git bash后都会进入这个目录 https://blog.csdn.net/weixin_39634961/article/details/79881140 在 ...

  9. OpenCV Canny 边缘检测

    #include "opencv2/imgproc/imgproc.hpp" #include "opencv2/highgui/highgui.hpp" #i ...

  10. python中sort和sorted排序的相关方法

    Python list内置sort()方法用来排序,也可以用python内置的全局sorted()方法来对可迭代的序列排序生成新的序列. 1)排序基础 简单的升序排序是非常容易的.只需要调用sorte ...