美文网首页iOS接下来要研究的知识点
iCarousel实现轮播(带缩放效果)

iCarousel实现轮播(带缩放效果)

作者: 口子窖 | 来源:发表于2018-06-10 21:42 被阅读8次

    效果图

    gif5.gif

    关键代码

    这是iCarousel自定义部分的关键代码,iCarousel的用法大家应该都知道,没接触过的可以百度,这里就不贴其他代码啦

    - (CATransform3D)carousel:(iCarousel *)carousel itemTransformForOffset:(CGFloat)offset baseTransform:(CATransform3D)transform{
        transform = CATransform3DTranslate(transform, offset * (bannerwidth), 0, 0);
        CGFloat scalex = MAX(0, (1-(6.0/bannerwidth * fabs(offset))));
        CGFloat scaley = MAX(0, (1-(12.0/(130.0) * fabs(offset))));
        return CATransform3DScale(transform, scalex, scaley, 1);
    }
    

    详解

    itemTransformForOffset:(CGFloat)offset

    offset 是item的索引

    offset == 0是当前展示的item

    offset < 0是当前展示item左边的item

    offset > 0是当前展示item右边的item

    baseTransform:(CATransform3D)transform

    transform 是iCarousel的基础变换,对应到每个item
    在xcode查看的层次是这样的


    dy20180526104944193.jpg
    transform = CATransform3DTranslate(transform, offset * (bannerwidth), 0, 0);

    这句代码将每个item按照offset偏移item的宽度,如下图效果


    dy20180526105410425.jpg
    CGFloat scalex = MAX(0, (1-(6.0/bannerwidth * fabs(offset))));

    宽度的缩放比例

    CGFloat scaley = MAX(0, (1-(12.0/(130.0) * fabs(offset))));

    高度的缩放比例

    完整代码

    相关文章

      网友评论

      • b8e6682d009f:问一下,iCarousel这个边界的距离怎么设置呢,如果设置宽度小一些,想让他从左边开始,而不是中间,中间边上留很大空白。scrollOffset不行,右边也会留白
        b8e6682d009f:@snsports 我的view的width大概只有100多
        b8e6682d009f:@snsports 就是要左右对称,效果就是五张小的竖屏图滑动,他有个contentoffset,但是改变左边的距离右边空白就变宽了。我现在做法是五张图的contentarr只有三张,然后两边边界一个boundarr两张
        口子窖:左边空白变小了,不就不对称了么

      本文标题:iCarousel实现轮播(带缩放效果)

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