iOS14 UIPageControl变化

问题

项目中使用到了SDCycleScrollView来显示轮播图，升级到iOS 14后发现轮播图上的UIPageControl的小黑点都不显示了；查看相关文档发现，iOS 14增加了新的API,导致UIPageControl无法正常显示。=

新点

背景样式backgroundStyle

/// The default background style that adapts based on the current interaction state.
UIPageControlBackgroundStyleAutomatic  = 0,
/// The background style that shows a full background regardless of the interaction
UIPageControlBackgroundStyleProminent  = 1,
/// The background style that shows a minimal background regardless of the interaction
UIPageControlBackgroundStyleMinimal    = 2,

当backgroundStyle设置成UIPageControlBackgroundStyleProminent时会增加一个白色的背景长条。

UIPageControlBackgroundStyleProminent

当backgroundStyle设置成UIPageControlBackgroundStyleMinimal时背景会完全贴合UIPageControl的点。

UIPageControlBackgroundStyleMinimal

自定义小圆点的图片preferredIndicatorImage

一般情况下圆点已经能够满足需求，但是有时候希望小圆点是自定义图片。iOS 14中，我们可以通过preferredIndicatorImage来自定义图片了。

pc.preferredIndicatorImage = [UIImage systemImageNamed:@"sun.max.fill"];//系统图片
//或者
pc.preferredIndicatorImage = [UIImage imageNamed:@"flight"];//自定义图片

系统图片

自定义图片

每个圆点采用不同图片

我们可以通过setIndicatorImage:<#(nullable UIImage *)#> forPage:<#(NSInteger)#>设定不同小圆点图片。下面是将第一张图片换成月亮，其他太阳。

pc.preferredIndicatorImage = [UIImage systemImageNamed:@"sun.max.fill"];
[pc setIndicatorImage:[UIImage systemImageNamed:@"moon.fill"] forPage:0];

不同图片

设置每个圆点都不一样

for (NSInteger page = 0; page < pc.numberOfPages; page ++) {
    [pc setIndicatorImage:[UIImage systemImageNamed:[NSString stringWithFormat:@"%ld.circle",page + 1]] forPage:page];
}

都不一样

圆点的个数不再被限制

iOS 14之后UIPageControl的圆点个数将不再受限制，它会自适应去显示圆点。比如设置40个圆点，当前一页无法展示出全部圆点时，它会分页，后面的点会渐渐变小，当滑到后面是会自动更新到下一页。

pc.numberOfPages = 40;

圆点个数过

通过拖拽快速移动圆点allowsContinuousInteraction

iOS 14当圆点个数过多时，我们可以在小圓點上用拖曳的方式快速移动到某个圆点上。allowsContinuousInteraction是用来控制圆点是否可以被拖拽。当它设置成NO时，我们只能通过点击的方式来移动到对应圆点上。

pc.allowsContinuousInteraction = YES;

注意⚠️：这些属性都是iOS 14之后才有的所以我们要处理好对应逻辑

if (@available(iOS 14.0, *)) {

} else {
    // Fallback on earlier versions
}

三方SDCycleScrollView显示错误

因为iOS 14以后UIPageControl设置了背景，导致原来的Frame不足以显示下UIPageControl。

方法：

pod 'SDCycleScrollView', '~> 1.82'