iOS學習——ScrollView圖片輪播和同類控件優先級問題

歡迎到我的個人域名博客：http://zhoulingyu.com

---

iOS學習——ScrollView的使用和同類控件優先級問題

1. 佈置界面

ScrollView的使用非常簡單，只有三步
1.1 添加一個scrollview
1.2 向scrollview添加內容
1.3 告訴scrollview中內容的實際大小

首先做第一步，佈置界面。
拖拽一個scrollview就可以了

就這麼簡單

---

2. 添加內容，並告訴scrollview中內容的實際大小

先給scrollview拖線至viewController的.m文件類擴展中

@property (weak, nonatomic) IBOutlet UIScrollView *scrollView;

再要給scrollview設置代理，讓代理處理相應的事件、設置相應的數據。設置代理的方法有兩種：拖線和代碼設置。

拖線：

代碼設置，在viewDidLoad方法中設置scrollview的代理爲控制器本身。

self.scrollView.delegate = self;

注意，把控制器設爲代理需要實現相應代理的接口：

現在開始添加內容，向Images.xcassets放入要用的五張圖片素材，因爲博主做的5張圖是白色背景，爲了能看清，只能把控制器背景調成其他顏色。

- (void)viewDidLoad {
    [super viewDidLoad];
    // 動態創建UIImageView添加到滾動控件
    CGFloat imgW = 340;
    CGFloat imgH = 150;
    CGFloat imgY = 0;
    CGFloat imgX;
    // 加入五張圖片
    for (int i = 0; i < 5; i++) {
        UIImageView *imgView = [[UIImageView alloc] init];
        // 計算每張圖的x值
        imgView.image = [UIImage imageNamed:[NSString stringWithFormat:@"%d", i + 1]];
        imgX = i * imgW;
        imgView.frame = CGRectMake(imgX, imgY, imgW, imgH);
        [self.scrollView addSubview:imgView];
    }
    // 設置滾動控件內容大小
    self.scrollView.contentSize = CGSizeMake(5 * self.scrollView.frame.size.width, 150);
}

解釋爲什麼要計算每張圖片的x軸：
圖片實際上是這樣擺放的：

橘色的是scrollView，每張圖片和scrollView長寬一樣大，所以只能看到一張圖片，五張圖片並排放置，這樣滾動scrollView時候就能瀏覽後面的圖片，實現滾動效果。

如果不希望有滾動指示器，就是滾動條，可以加入：

// 設置滾動指示器不可見
self.scrollView.showsHorizontalScrollIndicator = NO;
self.scrollView.showsVerticalScrollIndicator = NO;

這時運行後發現可以滾動，但是圖片可以滾動到任何位置

如果希望能夠像平常淘寶看到的圖片輪播，輕輕劃一下，可以完整的翻到下一張圖片，可以加入：

// 實現分頁效果，原理是根據滾動控件的寬度，一個寬度是一頁
self.scrollView.pagingEnabled = YES;

---

3. 設置自動輪播

通過計時器控件計時

1 先爲控制器添加一個timer

@property (nonatomic, strong) NSTimer *timer;

2 viewDidLoad中創建計時器控件

// 創建計時器控件，設定每過兩秒執行`scrollImage`方法
self.timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(scrollImage) userInfo:nil repeats:YES];

3 實現@selector指定的方法

- (void) scrollImage {
    NSInteger page = self.scrollView.contentOffset.x / self.scrollView.frame.size.width;
    // 判斷是否在最後一頁，如果是最後一頁設置頁碼重新設置爲第一頁
    if (page == 4) {
        page = 0;
    } else {
        page ++;
    }
    CGFloat offsetX = page * self.scrollView.frame.size.width;
    [self.scrollView setContentOffset:CGPointMake(offsetX, 0) animated:YES];
}

這時候就能看見圖片2秒滾動一次了。

---

4. 同類控件優先級問題

問題描述

當界面中有兩個scrollview（或其子類控件）時，在滾動其中一個scrollview時候，設置了計時器的scrollview會暫定自動滾動。
比如拽入一個textView:

如果滾動下面的文字，上面的圖片輪播不會繼續自動滾動。

問題原因

問題的原因是因爲計時器的優先級和view（各種控件）的優先級不同，所以會優先執行view的動作。

解決方法

將計時器的優先級設置和view的優先級相同

// 修改優先級
// 獲取當前的消息循環
NSRunLoop *runLoop = [NSRunLoop currentRunLoop];
[runLoop addTimer:self.timer forMode:NSRunLoopCommonModes];

---

源代碼

如果需要源代碼，博主已經上傳：http://download.csdn.net/detail/u010127917/9042503

---

有什麼問題都可以在博文後面留言，或者私信，或者微博上找我。
博主主要寫javaee和iOS的。
希望大家一起進步。
我的微博：小魚周凌宇