<h2 id="autoid-4-1-0" style="font-size: 21px; letter-spacing: -1px; margin: 24px 0px 12px; padding: 6px 0px; line-height: 21px; color: rgb(51, 51, 51); font-family: Georgia, 'Times New Roman', Times, sans-serif; background-image: none; background-position: 0% 100%; background-repeat: repeat-x;">如何優化性能?</h2><p style="line-height: 25.2000007629395px; margin: 10px auto; color: rgb(51, 51, 51); font-family: Georgia, 'Times New Roman', Times, sans-serif; font-size: 14px;">無限循環實現了,但是我們知道如果圖片過多這些圖片勢必全部加載到內存,這是我們不願意看到的,此時我們需要優化上面的方案。其實從上面的方案我們也可以看出端倪,我們完全沒必要創建n+2個UIImageView,其實3個已經足夠(事實上也可以用兩個實現,大家不妨自己思考一下),只要一直保持顯示中間的UIImageView,滾動時動態更改三個UIImageView的圖片即可。例如三個UIImageView默認放圖片5、圖片1、圖片2,當前顯示中間的UIImageView,也就是圖片1,。如果向後滾動那麼就會顯示圖片2,當圖片2顯示完整後迅速重新設置三個UIImageView的內容爲圖片1、圖片2、圖片3,然後通過contentOffset設置顯示中間的UIImageView,也就是圖片2。繼續向後看到圖片3,當圖片3滾動完成迅速重新設置3個UIImageView的內容爲圖片2、圖片3、圖片4,然後設置contentOffset顯示中間的UIImageView,也就是圖片3。當然,向前滾動原理完全一樣,如此就給用戶一種循環錯覺,而且不佔用過多內存。</p>
分享一個實現輪播圖的效果
#import "KCMainViewController.h"
#define SCREEN_WIDTH 320
#define SCREEN_HEIGHT 568
#define IMAGEVIEW_COUNT 3
@interface KCMainViewController ()<UIScrollViewDelegate>{
UIScrollView *_scrollView;
UIImageView *_leftImageView;
UIImageView *_centerImageView;
UIImageView *_rightImageView;
UIPageControl *_pageControl;
UILabel *_label;
NSMutableDictionary *_imageData;//圖片數據
int _currentImageIndex;//當前圖片索引
int _imageCount;//圖片總數
}
@end
@implementation KCMainViewController
- (void)viewDidLoad {
[super viewDidLoad];
//加載數據
[self loadImageData];
//添加滾動控件
[self addScrollView];
//添加圖片控件
[self addImageViews];
//添加分頁控件
[self addPageControl];
//添加圖片信息描述控件
[self addLabel];
//加載默認圖片
[self setDefaultImage];
}
#pragma mark 加載圖片數據
-(void)loadImageData{
//讀取程序包路徑中的資源文件
NSString *path=[[NSBundle mainBundle] pathForResource:@"imageInfo" ofType:@"plist"];
_imageData=[NSMutableDictionary dictionaryWithContentsOfFile:path];
_imageCount=(int)_imageData.count;
}
#pragma mark 添加控件
-(void)addScrollView{
_scrollView=[[UIScrollView alloc]initWithFrame:[UIScreen mainScreen].bounds];
[self.view addSubview:_scrollView];
//設置代理
_scrollView.delegate=self;
//設置contentSize
_scrollView.contentSize=CGSizeMake(IMAGEVIEW_COUNT*SCREEN_WIDTH, SCREEN_HEIGHT) ;
//設置當前顯示的位置爲中間圖片
[_scrollView setContentOffset:CGPointMake(SCREEN_WIDTH, 0) animated:NO];
//設置分頁
_scrollView.pagingEnabled=YES;
//去掉滾動條
_scrollView.showsHorizontalScrollIndicator=NO;
}
#pragma mark 添加圖片三個控件
-(void)addImageViews{
_leftImageView=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];
_leftImageView.contentMode=UIViewContentModeScaleAspectFit;
[_scrollView addSubview:_leftImageView];
_centerImageView=[[UIImageView alloc]initWithFrame:CGRectMake(SCREEN_WIDTH, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];
_centerImageView.contentMode=UIViewContentModeScaleAspectFit;
[_scrollView addSubview:_centerImageView];
_rightImageView=[[UIImageView alloc]initWithFrame:CGRectMake(2*SCREEN_WIDTH, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];
_rightImageView.contentMode=UIViewContentModeScaleAspectFit;
[_scrollView addSubview:_rightImageView];
}
#pragma mark 設置默認顯示圖片
-(void)setDefaultImage{
//加載默認圖片
_leftImageView.image=[UIImage imageNamed:[NSString stringWithFormat:@"%i.jpg",_imageCount-1]];
_centerImageView.image=[UIImage imageNamed:[NSString stringWithFormat:@"%i.jpg",0]];
_rightImageView.image=[UIImage imageNamed:[NSString stringWithFormat:@"%i.jpg",1]];
_currentImageIndex=0;
//設置當前頁
_pageControl.currentPage=_currentImageIndex;
NSString *imageName=[NSString stringWithFormat:@"%i.jpg",_currentImageIndex];
_label.text=_imageData[imageName];
}
#pragma mark 添加分頁控件
-(void)addPageControl{
_pageControl=[[UIPageControl alloc]init];
//注意此方法可以根據頁數返回UIPageControl合適的大小
CGSize size= [_pageControl sizeForNumberOfPages:_imageCount];
_pageControl.bounds=CGRectMake(0, 0, size.width, size.height);
_pageControl.center=CGPointMake(SCREEN_WIDTH/2, SCREEN_HEIGHT-100);
//設置顏色
_pageControl.pageIndicatorTintColor=[UIColor colorWithRed:193/255.0 green:219/255.0 blue:249/255.0 alpha:1];
//設置當前頁顏色
_pageControl.currentPageIndicatorTintColor=[UIColor colorWithRed:0 green:150/255.0 blue:1 alpha:1];
//設置總頁數
_pageControl.numberOfPages=_imageCount;
[self.view addSubview:_pageControl];
}
#pragma mark 添加信息描述控件
-(void)addLabel{
_label=[[UILabel alloc]initWithFrame:CGRectMake(0, 10, SCREEN_WIDTH,30)];
_label.textAlignment=NSTextAlignmentCenter;
_label.textColor=[UIColor colorWithRed:0 green:150/255.0 blue:1 alpha:1];
[self.view addSubview:_label];
}
#pragma mark 滾動停止事件
-(void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
//重新加載圖片
[self reloadImage];
//移動到中間
[_scrollView setContentOffset:CGPointMake(SCREEN_WIDTH, 0) animated:NO];
//設置分頁
_pageControl.currentPage=_currentImageIndex;
//設置描述
NSString *imageName=[NSString stringWithFormat:@"%i.jpg",_currentImageIndex];
_label.text=_imageData[imageName];
}
#pragma mark 重新加載圖片
-(void)reloadImage{
int leftImageIndex,rightImageIndex;
CGPoint offset=[_scrollView contentOffset];
if (offset.x>SCREEN_WIDTH) { //向右滑動
_currentImageIndex=(_currentImageIndex+1)%_imageCount;
}else if(offset.x<SCREEN_WIDTH){ //向左滑動
_currentImageIndex=(_currentImageIndex+_imageCount-1)%_imageCount;
}
//UIImageView *centerImageView=(UIImageView *)[_scrollView viewWithTag:2];
_centerImageView.image=[UIImage imageNamed:[NSString stringWithFormat:@"%i.jpg",_currentImageIndex]];
//重新設置左右圖片
leftImageIndex=(_currentImageIndex+_imageCount-1)%_imageCount;
rightImageIndex=(_currentImageIndex+1)%_imageCount;
_leftImageView.image=[UIImage imageNamed:[NSString stringWithFormat:@"%i.jpg",leftImageIndex]];
_rightImageView.image=[UIImage imageNamed:[NSString stringWithFormat:@"%i.jpg",rightImageIndex]];
}
@end