簡單的整理一下實現的思路:
1. 既然是要顯示半透明的蒙板圖片,UIImageView肯定是少不了了。
2. 要多頁顯示且能左右滑動,把UIImageView嵌入到UIScrollView中,並將UIScrollView的pagingEnabled屬性設為YES,即可實現整頁的滑動。
3. 按當下流行的設計方案,圖片滑動時,用點來表示當前頁和總頁數,這個就要用到UIPageControl控件了。
4. 這些用於顯示幫助的元素不應擾亂xib界面文件對頁面的定義,所以使用動態加載的方式添加到頁面上。
下面結合代碼來講解一下實現的方法:
在頭文件中,添加UIScrollView和UIPageControl類型的成員變量,並實現UIScrollViewDelegate。
@interface ViewController : UIViewController<UIScrollViewDelegate>
{
UIScrollView* helpScrView;
UIPageControl* pageCtrl;
}
在.m文件中,首先實現viewDidLoad函數,該函數在界面即將顯示前被調用。
- (void)viewDidLoad
{
[super viewDidLoad];
CGRect bounds = self.view.frame; //獲取界面區域
//加載蒙板圖片,限於篇幅,這裡僅顯示一張圖片的加載方法
UIImageView* imageView1 = [[[UIImageView alloc] initWithFrame:CGRectMake(bounds.origin.x, bounds.origin.y, bounds.size.width, bounds.size.height)] autorelease]; //創建UIImageView,位置大小與主界面一樣。
[imageView1 setImage:[UIImage imageNamed:@"help01.png"]]; //加載圖片help01.png到imageView1中。
imageView1.alpha = 0.5f; //將透明度設為50%。
//繼續加載圖片
//。。。。
//創建UIScrollView
helpScrView = [[UIScrollView alloc] initWithFrame:CGRectMake(bounds.origin.x, bounds.origin.y, bounds.size.width, bounds.size.height)]; //創建UIScrollView,位置大小與主界面一樣。
[helpScrView setContentSize:CGSizeMake(bounds.size.width * 3, bounds.size.height)]; //設置全部內容的尺寸,這裡幫助圖片是3張,所以寬度設為界面寬度*3,高度和界面一致。
helpScrView.pagingEnabled = YES; //設為YES時,會按頁滑動
helpScrView.bounces = NO; //取消UIScrollView的彈性屬性,這個可以按個人喜好來定
[helpScrView setDelegate:self]; //UIScrollView的delegate函數在本類中定義
helpScrView.showsHorizontalScrollIndicator = NO; //因為我們使用UIPageControl表示頁面進度,所以取消UIScrollView自己的進度條。
[helpScrView addSubview:imageView1]; //將UIImageView添加到UIScrollView中。
[self.view addSubView:helpScrView]; //將UIScrollView添加到主界面上。
//創建UIPageControl
pageCtrl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, bounds.size.height - 30, bounds.size.width, 30)]; //創建UIPageControl,位置在屏幕最下方。
pageCtrl.numberOfPages = 3; //總的圖片頁數
pageCtrl.currentPage = 0; //當前頁
[pageCtrl addTarget:self action:@selector(pageTurn:) forControlEvents:UIControlEventValueChanged]; //用戶點擊UIPageControl的響應函數
[self.view addSubview:pageCtrl]; //將UIPageControl添加到主界面上。
}
其次是UIScrollViewDelegate的scrollViewDidEndDecelerating函數,用戶滑動頁面停下後調用該函數。
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
//更新UIPageControl的當前頁
CGPoint offset = scrollView.contentOffset;
CGRect bounds = scrollView.frame;
[pageCtrl setCurrentPage:offset.x / bounds.size.width];
}
然後是點擊UIPageControl時的響應函數pageTurn
- (void)pageTurn:(UIPageControl*)sender
{
//令UIScrollView做出相應的滑動顯示
CGSize viewSize = helpScrView.frame.size;
CGRect rect = CGRectMake(sender.currentPage * viewSize.width, 0, viewSize.width, viewSize.height);
[helpScrView scrollRectToVisible:rect animated:YES];
}
最後別忘了在viewDidUnload中釋放UIScrollView和UIPageControl對象。