Use UIScrollView and UIImageView to Implement Circular image scrolling,

Use UIScrollView and UIImageView to Implement Circular image scrolling,

Scenario:

In the development work, sometimes we need to implement a set of images to scroll cyclically. When we use UIScrollView in combination with UIImageView to implement the current situation, UIImageView will generally be considered for reuse as much as possible. The following example shows how to use three uiimageviews (middle left and right). In fact, we can also consider using two UIImageView implementations. This prevents a group of images from occupying too much memory due to the corresponding number of uiimageviews.

The effect is as follows:

ViewController. h

 1 #import <UIKit/UIKit.h> 2  3 @interface ViewController : UIViewController <UIScrollViewDelegate> 4 @property (strong, nonatomic) UIScrollView *scrV; 5 @property (strong, nonatomic) UIPageControl *pageC; 6 @property (strong, nonatomic) UIImageView *imgVLeft; 7 @property (strong, nonatomic) UIImageView *imgVCenter; 8 @property (strong, nonatomic) UIImageView *imgVRight; 9 @property (strong, nonatomic) UILabel *lblImageDesc;10 @property (strong, nonatomic) NSMutableDictionary *mDicImageData;11 @property (assign, nonatomic) NSUInteger currentImageIndex;12 @property (assign, nonatomic) NSUInteger imageCount;13 14 @end

ViewController. m

1 # import "ViewController. h "2 3 # define kWidthOfScreen [[UIScreen mainScreen] bounds]. size. width 4 # define kHeightOfScreen [[UIScreen mainScreen] bounds]. size. height 5 # define kImageViewCount 3 6 @ interface ViewController () 7/** 8 * load image data 9 */10-(void) loadImageData; 11 12/** 13 * Add a rolling view 14 */15-(void) addScrollView; 16 17/** 18 * add three image views to the rolling view 19 */20-(void) addImageViewsToScrollView; 21 22/** 23 * Add pagination controls 24/25-(void) addPageControl; 26 27/** 28 * Add tags; used for image description 29 */30-(void) addLabel; 31 32/** 33 * according to the current image index setting information 34*35 * @ param currentImageIndex current image index; that is, 36 */37-(void) setInfoByCurrentImageIndex :( NSUInteger) currentImageIndex; 38 39/** 40 * set the default information 41 */42-(void) setDefaultInfo; 43 44/** 45 * reload image 46 */47-(void) reloadImage; 48 49-(void) layoutUI; 50 @ end 51 52 @ implementation ViewController 53 54-(void) viewDidLoad {55 [super viewDidLoad]; 56 57 [self layoutUI]; 58} 59 60-(void) didReceiveMemoryWarning {61 [super didReceiveMemoryWarning]; 62 // Dispose of any resources that can be recreated. 63} 64 65-(void) loadImageData {66 NSString * path = [[NSBundle mainBundle] pathForResource: @ "ImageInfo" ofType: @ "plist"]; 67 _ mDicImageData = [NSMutableDictionary dictionaryWithContentsOfFile: path]; 68 _ imageCount = _ mDicImageData. count; 69} 70 71-(void) addScrollView {72 _ scrV = [[UIScrollView alloc] initWithFrame: [[UIScreen mainScreen] bounds]; 73 _ scrV. contentSize = CGSizeMake (kWidthOfScreen * kImageViewCount, kHeightOfScreen); 74 _ scrV. contentOffset = CGPointMake (kWidthOfScreen, 0.0); 75 _ scrV. pagingEnabled = YES; 76 _ scrV. showsHorizontalScrollIndicator = NO; 77 _ scrV. delegate = self; 78 [self. view addSubview: _ scrV]; 79} 80 81-(void) addImageViewsToScrollView {82 // picture view; 83 _ imgVLeft = [[UIImageView alloc] initWithFrame: CGRectMake (0.0, 0.0, kWidthOfScreen, kHeightOfScreen)]; 84 _ imgVLeft. contentMode = require; 85 [_ scrV addSubview: _ imgVLeft]; 86 87 // picture view; 88 _ imgVCenter = [[UIImageView alloc] initWithFrame: CGRectMake (kWidthOfScreen, 0.0, kWidthOfScreen, kHeightOfScreen)]; 89 _ imgVCenter. contentMode = align; 90 [_ scrV addSubview: _ imgVCenter]; 91 92 // picture view; 93 _ imgVRight = [[UIImageView alloc] initWithFrame: CGRectMake (kWidthOfScreen * 2.0, 0.0, kWidthOfScreen, kHeightOfScreen)]; 94 _ imgVRight. contentMode = UIViewContentModeScaleAspectFit; 95 [_ scrV addSubview: _ imgVRight]; 96} 97 98-(void) addPageControl {99 _ pageC = [UIPageControl new]; 100 CGSize size = [_ pageC sizeForNumberOfPages: _ imageCount]; // return the UIPageControl of a proper size of 101 _ pageC based on the number of pages. bounds = CGRectMake (0.0, 0.0, size. width, size. height); 102 _ pageC. center = CGPointMake (kWidthOfScreen/2.0, kHeightOfScreen-80.0); 103 _ pageC. numberOfPages = _ imageCount; 104 _ pageC. pageIndicatorTintColor = [UIColor whiteColor]; 105 _ pageC. currentPageIndicatorTintColor = [UIColor brownColor]; 106 _ pageC. userInteractionEnabled = NO; // set whether to allow user interaction. The default value is YES. If the value is YES, click the left side of the control area (the index on the current page is reduced by one and the minimum value is 0) right (add one to the index of the current page, and the maximum value is reduced by one). You can compile the event processing method of UIControlEventValueChanged 107 [self. view addSubview: _ pageC]; 108} 109 110-(void) addLabel {111 _ lblImageDesc = [[UILabel alloc] initWithFrame: CGRectMake (0.0, 40.0, kWidthOfScreen, 40.0)]; 112 _ lblImageDesc. textAlignment = NSTextAlignmentCenter; 113 _ lblImageDesc. textColor = [UIColor whiteColor]; 114 _ lblImageDesc. font = [UIFont boldSystemFontOfSize: [UIFont labelFontSize]; 115 _ lblImageDesc. text = @ "Fucking now. "; 116 [self. view addSubview: _ lblImageDesc]; 117} 118 119-(void) numeric :( NSUInteger) currentImageIndex {120 NSString * numeric = [NSString stringWithFormat: @ "%lu.png", (unsigned long) currentImageIndex]; 121 _ imgVCenter. image = [UIImage imageNamed: currentImageNamed]; 122 _ imgVLeft. image = [UIImage imageNamed: [NSString stringWithFormat: @ "%lu.png", (unsigned long) (_ currentImageIndex-1 + _ imageCount) % _ imageCount)]; 123 _ imgVRight. image = [UIImage imageNamed: [NSString stringWithFormat: @ "%lu.png", (unsigned long) (_ currentImageIndex + 1) % _ imageCount)]; 124 125 _ pageC. currentPage = currentImageIndex; 126 _ lblImageDesc. text = _ mDicImageData [currentImageNamed]; 127} 128 129-(void) setDefaultInfo {130 _ currentImageIndex = 0; 131 [self setInfoByCurrentImageIndex: _ currentImageIndex]; 132} 133 134-(void) reloadImage {135 CGPoint contentOffset = [_ scrV contentOffset]; 136 if (contentOffset. x> kWidthOfScreen) {// move 137 _ currentImageIndex = (_ currentImageIndex + 1) % _ imageCount; 138} else if (contentOffset. x <kWidthOfScreen) {// slide to the right 139 _ currentImageIndex = (_ currentImageIndex-1 + _ imageCount) % _ imageCount; 140} 141 142 [self setInfoByCurrentImageIndex: _ currentImageIndex]; 143} 144 145-(void) layoutUI {146 self. view. backgroundColor = [UIColor blackColor]; 147 148 [self loadImageData]; 149 [self addScrollView]; 150 [self addImageViewsToScrollView]; 151 [self addPageControl]; 152 [self addLabel]; 153 [self setDefaultInfo]; 154} 155 156 # pragma mark-publish-(void) scrollViewDidEndDecelerating :( UIScrollView *) scrollView {158 [self reloadImage]; 159 _ scrV. contentOffset = CGPointMake (kWidthOfScreen, 0.0); 161 _ pageC. currentPage = _ currentImageIndex; 162 163 NSString * currentImageNamed = [NSString stringWithFormat: @ "lulu.png", (unsigned long) _ currentImageIndex]; 164 _ lblImageDesc. text = _ mDicImageData [currentImageNamed]; 165} 166 167 @ end

ImageInfo. plist

1 <? Xml version = "1.0" encoding = "UTF-8"?> 2 <! DOCTYPE plist PUBLIC "-// Apple // dtd plist 1.0 // EN" http://www.apple.com/DTDs/PropertyList-1.0.dtd "> 3 <plist version =" 1.0 "> 4 <dict> 5 <key> 0.png</ key> 6 <string> WATCH, it finally came. </String> 7 <key> 1.png</key> 8 <string> iPhone 6, no dual. </String> 9 <key> 2.png</key> 10 <string> MACOs are earlier than the times. </String> 11 <key> 3.png</key> 12 <string> iPad Air 2, gently change everything. </String> 13 <key> 4.png</key> 14 <string> iOS 9, which is coming soon. </String> 15 </dict> 16 </plist>