美文网首页
iOS 修改 SDCycleScrollView 的滚动图标

iOS 修改 SDCycleScrollView 的滚动图标

作者: 近听雨落声丶 | 来源:发表于2019-12-20 11:46 被阅读0次

一、前言
这是第二次写博客。原计划一个月一篇的博客,然后发现自己贼懒。变成一年一篇了.....
仅当做是自己的记录吧~(只能这样安慰自己了!!!)

二、正题
最近接到了一个需求,需要做个轮播图。原则上来说做个轮播很是简单的,套用个第三方或者自己使用UIScrollView + GCD 封装一个即可。(效果如下图)


01.jpg

这次我们使用github上比较火的一个第三方控件来做,然后再修改一下第三方的PageControl计算规则,即可达到效果。

先导入第三方的SDCycleScrollView(导入方式默认大家都会了,这边就不详解了)。SDCycleScrollView有提供两个自定义的底部分页小图标

/** 当前分页控件小圆标图片 */
@property (nonatomic, strong) UIImage *currentPageDotImage;

/** 其他分页控件小圆标图片 */
@property (nonatomic, strong) UIImage *pageDotImage;

大家只需要把想要的效果图替换即可。
但是当图片喜欢进去后,发现图片并不能自适应大小,而是被压缩了。都变成固定大小了,这个时候就需要处理自适应的大小了。
可直接在TAPageControl.m类进行处理。

NO.1 先找到- (CGSize)sizeForNumberOfPages:(NSInteger)pageCount方法,修改PageControl的总宽高.

- (CGSize)sizeForNumberOfPages:(NSInteger)pageCount
{
    return CGSizeMake((self.dotSize.width + self.spacingBetweenDots) * pageCount - self.spacingBetweenDots + self.currentDotImage.size.width, self.currentDotImage.size.height);
}

NO.2 总宽高设置完后,需要设置动态滚动起来后的效果;找到- (void)changeActivity:(BOOL)active atIndex:(NSInteger)index,修改此方法

/**
 *  Change activity state of a dot view. Current/not currrent.
 *
 *  @param active Active state to apply
 *  @param index  Index of dot for state update
 */
- (void)changeActivity:(BOOL)active atIndex:(NSInteger)index
{
    if (self.dotViewClass) {
        TAAbstractDotView *abstractDotView = (TAAbstractDotView *)[self.dots objectAtIndex:index];
        if ([abstractDotView respondsToSelector:@selector(changeActivityState:)]) {
            [abstractDotView changeActivityState:active];
        } else {
            NSLog(@"Custom view : %@ must implement an 'changeActivityState' method or you can subclass %@ to help you.", self.dotViewClass, [TAAbstractDotView class]);
        }
    } else if (self.dotImage && self.currentDotImage) {
        UIImageView *dotView = (UIImageView *)[self.dots objectAtIndex:index];
        dotView.image = (active) ? self.currentDotImage : self.dotImage;
        [self updateDotFrame:dotView atIndex:index];
        for (int i = 0; i < self.numberOfPages; i++) {
            UIImageView *tempDotView = (UIImageView *)[self.dots objectAtIndex:i];
            [self updateDotFrame:tempDotView atIndex:i];
        }
    }
}

NO.3设置完滚动的效果,还需要话处理连带的效果处理,更新的方法:- (void)updateDotFrame:(UIView *)dot atIndex:(NSInteger)index,此方法是对每个小圆点的位置都重新赋值

/**
 *  Update the frame of a specific dot at a specific index
 *
 *  @param dot   Dot view
 *  @param index Page index of dot
 */
- (void)updateDotFrame:(UIView *)dot atIndex:(NSInteger)index
{
    CGFloat x = (self.dotSize.width + self.spacingBetweenDots) * index + ( (CGRectGetWidth(self.frame) - [self sizeForNumberOfPages:self.numberOfPages].width) / 2);
    
    CGFloat y = (CGRectGetHeight(self.frame) - self.dotSize.height) / 2;
    
    
    if (index > self.currentPage) {
        x = (self.dotSize.width + self.spacingBetweenDots) * index + ( (CGRectGetWidth(self.frame) - [self sizeForNumberOfPages:self.numberOfPages].width) / 2) +self.currentDotImage.size.width - self.dotSize.width;
    }
    
    if (index == self.currentPage) {
        dot.frame = CGRectMake(x, 0, self.currentDotImage.size.width, self.currentDotImage.size.height);
    }else{
        dot.frame = CGRectMake(x, y, self.dotSize.width, self.dotSize.height);
    }
}

至此,产品需要的需求效果已经完成。

相关文章

  • iOS 修改 SDCycleScrollView 的滚动图标

    一、前言这是第二次写博客。原计划一个月一篇的博客,然后发现自己贼懒。变成一年一篇了.....仅当做是自己的记录吧~...

  • 常用三方 SDCycleScrollView轮播图

    iOS图片、文字轮播器Git/SDCycleScrollView 滚动轮播图片、文字、可使用本地图片或加载网络图片...

  • flutter 图标、名称配置

    修改app名称和图标 安卓和ios平台需要分别配置。 安卓 ios修改string 图标文件可在图标工厂生成,直接...

  • 轮播图

    1. 使用的第三方"SDCycleScrollView" 2. 文字轮播-垂直滚动示例 3. 图片轮播-水平滚动 ...

  • 滚动条

    1.IOS 手机容器滚动条滑动不流畅 2.修改滚动条样式 隐藏div元素的滚动条

  • SDCycleScrollView照片滚动器 / TZImage

    SDCycleScrollView 创建 数据源 占位 背景色 imgMode 缓存 滚动 和 点击 轮播文字 圆...

  • iOS 修改APP 名称

    iOS 修改APP 名称 iOS 10.3 加入了了更换应用图标的新功能. 1.配置Plist 2.代码 完整代码...

  • Css各类方法记录

    一行文本超出... 多行文本超出显示... IOS 手机容器滚动条滑动不流畅 修改滚动条样式 隐藏 div 元素的...

  • Swift开发常用网址(持续更新)

    ios开发之Swift标签栏按钮UITabBarItem样式修改(图标文字尺寸,颜色等) Swift 注释格式使用...

  • iOS App图标版本化

    iOS App图标版本化 iOS App图标版本化

网友评论

      本文标题:iOS 修改 SDCycleScrollView 的滚动图标

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