在iOS开发中，商品页面的构建是非常关键的一环，其中Banner区域通常包含一个图片轮播组件，用户可以点击图片查看大图。这篇文章主要探讨了如何在iOS应用的商品页面中实现这一功能，即“iOS开发商品页中banner中点击查看图片”。
首先，我们可以看到使用了开源库`SDCycleScrollView`来实现轮播效果。`SDCycleScrollView`是一个强大的图片轮播框架，它支持自动轮播、无限循环、自定义数据源和点击回调等功能。在项目中引入这个库可以大大简化轮播图的实现。
然后，文章中提到了一个名为`FullScreenShowImageView`的自定义视图类，它是实现查看图片功能的核心。这个类遵循了`UIScrollViewDelegate`协议，以便于处理滚动视图的相关事件。`FullScreenShowImageView`还定义了一个代理协议`FullScreenShowImageViewDelegate`，该协议包含了获取数据源、获取内部`UIScrollView`的尺寸以及隐藏视图的方法，这使得外部可以方便地控制和交互。
在`FullScreenShowImageView`中，有几个关键的成员变量：
1. `currentIndex`：记录当前显示的图片索引。
2. `dataSource`：存储图片URL字符串的数组，作为数据源。
3. `leftImageView`, `middleImageView`, `rightImageView`：用于轮播的三个`UIImageView`，无论图片数量多少，这三个视图都会交替使用。
4. `scrollerView`：存放`UIImageView`的`UIScrollView`，用于图片的滚动展示。
5. `scrollerViewWidth` 和 `scrollerViewHeight`：用于设置`scrollerView`的尺寸。
6. `pageControl`：页控制器，显示小圆点，代表当前显示的图片位置。
7. `placeholderImage`：加载指示符，当图片尚未加载完成时显示。
8. `autoScrollTimer`：自动滚动计时器，用于实现自动轮播功能。
`FullScreenShowImageView`的初始化方法`init(frame: CGRect, delegate: FullScreenShowImageViewDelegate)`接收一个frame和一个代理对象，初始化后会调用`praperaUI()`方法进行界面的配置。在这个方法中，首先获取代理提供的尺寸和数据源，接着设置`scrollerView`，包括配置其尺寸和数据源。同时，设置加载指示图片、`UIImageView`、页控制器以及自动滚动计时器。最后，为组件添加点击事件，以便用户点击时可以查看大图。
点击事件的处理通过添加`UITapGestureRecognizer`实现，当用户点击`FullScreenShowImageView`时，会触发相应的回调函数，展示全屏的大图。这种设计允许用户在商品页的Banner区域点击图片，进入一个新的视图来查看完整的图片，提供了更好的用户体验。
总的来说，这个实现涉及了iOS开发中的多个核心概念，包括自定义视图、手势识别、数据源代理模式、`UIScrollView`的使用以及第三方库的集成。通过这样的设计，开发者可以轻松地在商品页面中创建一个功能完备且易于定制的图片轮播组件，并支持点击查看大图的功能。
