IOS開發入門(10)-滾動

IOS開發(10)–滾動

前言:

  有時候,我們需要呈現的內容超出了屏幕所能容納的大小。例如,當我們把在汽車編輯頁面中,將屏幕橫向,然後隨便點擊一個輸入框,跳出的鍵盤會擋住一部分文本編輯框。我們想要的是能覆蓋更大內容的虛擬窗口——用戶可以操作這個窗口,使之顯示想要看到的某一部分內容。

  UIScrollView能幫助我們實現所有的這些,甚至更多。

  在本節中,我們將學習並實踐這種多功能視圖的威力

爲View/Edit場景添加滾動視圖

  小屏幕使智能手機便攜(然而吐槽一下現在越做越大的手機…),但它們也限制了可以顯示的信息量。有時候圖片太大了,一個屏幕放不下。更常見的例子就是我們用手機看小說,一個屏幕肯定不能放下整部小說。

  在iOS中,解決的方法是四處滾動。UIScrollView是更大內容至上的一個虛擬窗口,提供了所有用戶所需要的支持:四處拖動內容,放大和縮小,以及應用程序可能需要的其他功能。

  用戶在滾動視圖中拖動或輕掃手指,從而在固定的“窗口”之下四處滑動內容。

  設置滾動視圖的最簡單的方法就是,將所有我們想滾動的內容放到一個視圖中。這個新視圖變爲滾動視圖的內容視圖。對於Add/View場景,我們需要一個包含添加汽車區域、分隔符視圖以及查看汽車區域的UIView視圖。特別指出,UIViewController的視圖就是內容視圖。但是我們不能僅僅拖拽一個滾動視圖並使之成爲View/Add場景控制器的根視圖。

  這樣就剩下兩個選擇。其一,可以添加一個滾動視圖來作爲根視圖的子視圖,然後再給滾動視圖添加一個UIView子視圖,並將所有的內容區域(添加汽車區域、分隔符視圖、查看汽車區域)放進這個UIView姿勢圖。非常遺憾的是,我們需要重新設置佈局、約束以及屬性關聯。這樣做的話工作量巨大,而且很容易能引入新的BUG(顯然我們不會這麼做的)

  其二,使用與將添加汽車視圖控制器嵌入到導航控制器中時相同的基本技術。但是這一次,我們要使用Editor|Embed In|Scroll View。遺憾的是,並不像選擇當前頂層視圖並選擇這條命令一樣簡單。

  這是因爲那個視圖是添加汽車視圖控制器的可視部分。使用嵌入式命令之前,必須創建一個新的頂層視圖。這樣就需要打破控制器和視圖之間的連接。

  確保使用的是CH06 CarValet Starter項目

  • 將CarValet的根視圖名稱改爲Content View並拖到下圖位置

這裏寫圖片描述

  • 將一個UIView拖到原先的內容視圖所在的位置

這裏寫圖片描述

  • 將Content View拖到下圖位置

這裏寫圖片描述

  • 添加滾動

這裏寫圖片描述

  • 現在的根視圖樣子

這裏寫圖片描述

  • 接下來是解決約束的問題

    • 首先選擇新的滾動視圖,選中Scroll View,如下約束
      這裏寫圖片描述
    • 選中Content View,如下約束
      這裏寫圖片描述
    • 選中Content View,如下約束
      這裏寫圖片描述
    • 修改添加汽車視圖約束
      這裏寫圖片描述
    • 修改查看汽車分組視圖
      這裏寫圖片描述

        運行結果如下圖:

這裏寫圖片描述

  運行之後,我們會發現有一些東西不太正確,Total Cars標籤離導航欄太遠了。雖然這是似乎看起來是錯誤的行爲,但實際上卻是正確的

  視圖控制器有個automaticallyAdjustsScrollViewInsets屬性,它決定滾動視圖是否會爲導航欄、工具欄和其他類似元素嵌入或收縮內容區域。默認值是YES,這意味着滾動視圖調整了內容視圖的高度,所以其頂部正好在導航欄的正下方。

  在IB畫布上,從內容視圖頂部到添加汽車分組頂部的約束延伸到工具欄下。當內容視圖的頂部被移到工具欄下方時,添加汽車分組到內容視圖底部的距離仍爲72點。這意味着它距離導航欄下方72點,這顯然不是我們所想要的。

  有兩種方法來解決這個問題。第一種方法是將72點換成標準距離。這種方法唯一的問題是,在IB畫布上,添加汽車分組的頂部被移動到了導航欄下。如果在模擬器中運行,這可以工作,但卻難以維護。第二種方法更容易一些,將下面的代碼添加到ViewController.m文件中的viewDidLoad方法中,放到超類的下面

self.automaticallyAdjustsScrollViewInsets = NO;

  現在有了帶滾動視圖但沒有彈跳功能的Add/View場景。可以通過選擇滾動視圖,打開Attributes檢查器並選中Bounce Vertical複選框來添加彈跳功能。

  在模擬器中運行該應用程序並使主視圖彈跳。當內容視圖彈跳時,下方的區域是白色的,因爲滾動視圖使用默認顏色。如果想顯示內容視圖和空白區域之間的不同,請將滾動視圖的背景改成其他顏色。下圖是改成灰色的樣子。

這裏寫圖片描述

  彈跳效果的存在是爲了向用戶提供已經到達可滾動區域邊緣的反饋。到目前爲止,內容視圖和滾動視圖的大小相同,所以任何滾動嘗試都會導致彈跳。現在,是時候移到編輯界面並添加對內容的滾動支持了。在當前這種情況下,當鍵盤出現時,將文本框滾動到可查看的區域。

處理鍵盤

  我們還沒有完成編輯場景在所有屏幕尺寸和方向的任務。問題是,鍵盤有時候會蓋住輸入至少一行,並且在鍵盤打開時,沒有什麼佈局可以在所有方向和屏幕尺寸上都能夠工作。解決的辦法是將包含輸入框的視圖放在UIScrollView的裏面。當屏幕足夠大時,也就是說,當滾動視圖的大小足以顯示所有的內容時,它就只是彈跳滾動條(或者不彈)。用戶不能將內容移到屏幕外。但是,當鍵盤打開時,我們將調整滾動視圖的大小,使之處於鍵盤上方。內容視圖保持同樣的大小,因此,用戶可以額在輸入行中滾動。

添加滾動視圖

這裏寫圖片描述

  在編輯視圖中,我們首先想到的是,簡單的將上圖框住部分嵌入到滾動視圖中,就好比添加視圖的那個方法。然而在當前這種情況下,嵌入並不是我們想要的做法,原因是自動佈局。

  當內容視圖與滾動視圖具有相同大小的時候,可以創建一組規定內容視圖與滾動視圖之間關係的完整約束集合。當滾動視圖中的內容大小與滾動視圖的大小不同時,這不起作用。

  請記住,滾動視圖通過將原點相對於內容進行偏移來實現其功能,它是一個較大視圖之上的窗口。將內容針對滾動視圖制定約束,意味着它與滾動視圖具有固定的關係——沒有滾動。

  相反,我們需要內容視圖的約束獨立於滾動視圖,這樣內容視圖層次就存在於它自己的世界裏。這主要可以通過兩種方法來實現。IB的像素完美佈局會起作用,如果內容視圖的大小不會變化的話。這方面的一個示例是圖像,在接下來的內容中會看到的。如果內容的大小可以變化,那麼需要某種方式來更新內容視圖和滾動視圖容器的contenSize屬性。對於表單視圖,即使高度是靜態的,寬度也可以在設備旋轉時修改。

  最簡單的方法是使用代碼來添加和管理內容視圖和contenSize滾動視圖屬性。在完成添加滾動視圖的任務之後,我們不會再在畫布上看到表單視圖,雖然對於視圖控制器可用。按照下面步驟添加滾動視圖:

  • 先創鍵一個視圖命名爲Form View,將除了Car Number Label全扔進去,佈局啥的自行解決咯,怎麼好看怎麼來
    這裏寫圖片描述

  • 將Form View拖到First Responder下方

  • 將一個滾動視圖拖到場景中,使視圖的頂部位於Car Number標籤的下方。
  • 對滾動視圖進行約束(注意是距離Car Number標籤15點)
    • 這裏寫圖片描述
  • 最後將打開Assistant編譯器並顯示.h文件,創建兩個屬性:scrollView是滾動視圖的引用,fromView是表單視圖的引用(就是FormView)

      IB欄中應該是這個樣子的:

這裏寫圖片描述


  現在,我們有一個滾動視圖了,我們還需要做的是,將表單視圖扔到滾動視圖裏面並且管理他的大小。當更改表單視圖的大小時,我們還需要更新滾動視圖的contenSize屬性。

  不同於自動佈局和約束,我們需要設置表單視圖的邊框,並讓系統來做其餘的事情。我們好需要知道“約束”

  • 框架視圖的源點起始於x和y座標都爲0的位置
  • 框架視圖的高度固定爲200點,足以包含所有的標籤/輸入框
  • 框架視圖與滾動視圖(其父視圖)一樣寬

      現在的問題是在哪兒裏放置將框架視圖添加到滾動視圖中、設置框架視圖的大小和滾動視圖的contenSize屬性的代碼。

      我們回想一下編輯汽車場景時如何展現的:打開這一場景的唯一方法是點擊編輯按鈕。這意味着汽車界面每次都是新創建的。我們沒辦法返回到相同的編輯界面。所以說是一加載就要創建,也就是在vieDidLoad方法中。

      修改代碼如下:(這裏我就貼之前的代碼了,後面的也是如此)

- (void)viewDidLoad {
    [super viewDidLoad];

    defaultScrollViewHeightConstraint = self.scrollviewHeightConstraints.constant;

    self.formView.translatesAutoresizingMaskIntoConstraints = YES;//1 該框架視圖不具有任何相對於父視圖的約束。讓系統使用其當前邊框創建約束
    [self.scrollView addSubview:self.formView];//2 將表單視圖添加到滾動視圖
    self.formView.frame = CGRectMake(0.0, 0.0, self.scrollView.frame.size.width, self.scrollView.frame.size.height);//3確保表單視圖和滾動視圖一樣寬
    self.scrollView.contentSize = self.formView.bounds.size;//4根據需要設置滾動視圖的contenSize屬性
...
}

調整鍵盤大小

  滾動視圖添加完了,是時候處理一下鍵盤了。相信在很多程序裏面見到過,當我們點擊輸入框,鍵盤跳出來的時候,輸入框自動就網上調,以免被鍵盤圍住,我們現在要做的就是這個。

  我們要添加代碼去監聽鍵盤的打開與關閉,需要三個步驟:

  • 添加響應鍵盤開閉事件的方法
  • 當視圖打開時,爲鍵盤開閉通知註冊處理方法
  • 當視圖關閉時,爲鍵盤開閉通知註銷處理方法

調整滾動視圖的大小

  調整滾動視圖的大小意味着修改一個或多個約束,正如我們在之前自動佈局中的添加橫向佈局自動佈局2 。那麼我們要改什麼呢?滾動視圖有4個約束,到前後邊緣的約束和到Car Number標籤的約束不需要我們改,我們要改的只有Height。當鍵盤出現並覆蓋滾動視圖一部分的時候,我們要減少滾動視圖的高度,也就是減去滾動視圖與鍵盤重疊的地方。當鍵盤消失的時候,我們要恢復滾動視圖之前的高度,所以我們還需要一個用於保存原高度約束的實例變量,同樣需要一個隊高度約束的引用。

  • 創建高度約束並命名爲scrollviewHeightConstraints

  • 在CarEditViewController.m中,更改@implementation

@implementation CarEditViewController{
    CGFloat defaultScrollViewHeightConstraint;
}
  • 在viewDidLoad中,在調用父類後初始化默認值:
defaultScrollViewHeightConstraint = self.scrollviewHeightConstraints.constant;

查找重疊

  添加鍵盤開閉的方法:

- (void)keyboardDidShow:(NSNotification *)notification{
    NSDictionary *userInfo = [notification userInfo];//1獲取與通知相關聯的信息字典
    NSValue *aValue = userInfo[UIKeyboardFrameEndUserInfoKey];//2查找顯示的鍵盤的最終視圖邊框
    CGRect keyboardRect = [aValue CGRectValue];//3將最終視圖邊框的值轉爲CGRect,並將座標空間從設備主窗口轉換爲查看汽車分組使用的座標系,也就是說,轉換到編輯場景視圖控制器的根視圖的座標系
    keyboardRect = [self.view convertRect:keyboardRect fromView:nil];
    CGRect intersect = CGRectIntersection(self.scrollView.frame, keyboardRect);//4找到由滾動視圖和鍵盤的交集定義的矩形。如果滾動視圖和鍵盤不重疊,矩形是全0
    self.scrollviewHeightConstraints.constant -= intersect.size.height;//5降低滾動視圖的高度,者通過減少垂直的重疊量來完成,也就是相交的矩形的高度。
    [self.view updateConstraints];//6因爲滾動視圖的高度常量可能已經發生改變,更新約束
}

- (void)keyboardWillHide:(NSNotification *)notification{//7當鍵盤關閉時,將高度約束設置爲默認值,並更新約束
    printf("1:%f/n",defaultScrollViewHeightConstraint);
    self.scrollviewHeightConstraints.constant = defaultScrollViewHeightConstraint;
    [self.view updateConstraints];
}

  現在完成了後兩部,剩下的就是在viewDidLoad:的下面添加viewDidAppear來未見怕開關通知進行註冊:

- (void)viewWillAppear:(BOOL)animated{
    [super viewWillAppear:animated];

    [[NSNotificationCenter defaultCenter]addObserver:self
                                            selector:@selector(keyboardDidShow:)
                                                name:UIKeyboardDidShowNotification
                                              object:nil];
    [[NSNotificationCenter defaultCenter]addObserver:self
                                            selector:@selector(keyboardWillHide:)
                                                name:UIKeyboardWillHideNotification
                                              object:nil];
}

  最後,刪除作爲鍵盤事件觀察者而註冊的視圖控制器,添加下列代碼:

- (void)viewWillDisappear:(BOOL)animated{
    [super viewWillDisappear:animated];

    [[NSNotificationCenter defaultCenter]removeObserver:self
                                                   name:UIKeyboardDidShowNotification
                                                 object:nil];
    [[NSNotificationCenter defaultCenter]removeObserver:self
                                                   name:UIKeyboardWillHideNotification
                                                 object:nil];
...
}

添加調整大小

  當屏幕旋轉時,滾動視圖和表單視圖都需要調整大小。然後contenSize屬性需要被更新。

  在keyboardDidShow:keyboardWillHide:方法最後添加代碼self.scrollView.contentSize = self.formView.frame.size;

  好了,到此爲止,我們把鍵盤添加完成咯。
  貼出效果圖
這裏寫圖片描述

這裏寫圖片描述

在內容中滾動

  下面將介紹一些UIScrollView中的高級特性

  我們要添加一個新的場景,對一組可縮放的汽車圖像進行分頁。分頁是指在內容單位間滾動,而不是流暢地在內容中滾動。在當前這種情況下,每個向左或向右手勢移動一輛車的距離。我們需要以下操作:

  • 創建一個新的視圖控制器類,用於查看汽車圖像
  • 添加一個新的帶有滾動視圖的場景,用於新建的類
  • 用汽車圖片填充滾動視圖
  • 設置滾動視圖,使之可在圖像之間反野
  • 增加方法和縮小汽車圖像的能力

  • 恩…創建一個叫做Car文件夾,自己找一些圖片扔進去,然後把Car添加到項目中的如下位置

這裏寫圖片描述

  • 創建一個新的視圖控制器(cocoa touch class 避免忘掉)名:CarImageViewController,並把它移到Supporting Files組上面

這裏寫圖片描述

  • 在故事面板中,添加一個新的視圖控制器,將類設置爲CarImageViewController(下圖是完整版)

這裏寫圖片描述

  • 選擇Add/View場景添加一個按鈕Car Images,並把它鏈接到CarImageViewController(push segue),標題命名爲Car Images

  • 添加Car Number標籤(從編輯場景複製就行了),約束爲到頂部15點,前邊緣0點,記得更新邊框(就是Update Frame)

  • 添加滾動視圖,約束到Car Number標籤15點,前後底部0點,更新邊框

  • 將滾動視圖和Car Number標籤引用拉到CarImageViewController.h中,滾動視圖命名爲scrollView,Car Number標籤爲carNumberLabel

      最後故事面板圖如下:

這裏寫圖片描述

  好了,可以正式開始了

添加滾動視圖

在CarImageViewController.m中

- (void)setupScrollContent{
    NSMutableArray *imageViews = [NSMutableArray new];//2

    CGFloat atX = 0.0;
    CGFloat maxHeight = 0.0;
    UIImage *carImage;
    UIImageView *atImageView;

    for (NSString *atCarImageName in carImageNames) {//3
        carImage = [UIImage imageNamed:atCarImageName];
        atImageView = [[UIImageView alloc] initWithImage:carImage];

        atImageView.frame = CGRectMake(atX, 0.0, atImageView.bounds.size.width, atImageView.bounds.size.height);//4

        [imageViews addObject:atImageView];

        atX += atImageView.bounds.size.width;//5
        if (atImageView.bounds.size.height > maxHeight) {//6
            maxHeight = atImageView.bounds.size.height;
        }
    }

    UIView *carImageContainerView = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, atX, maxHeight)];//7

    for (UIImageView *atImageView in imageViews) {//8
        [carImageContainerView addSubview:atImageView];
    }

    [self.scrollView addSubview:carImageContainerView];//9
    self.scrollView.contentSize = carImageContainerView.bounds.size;
}

- (void)viewDidLoad {
    [super viewDidLoad];

    self.resetZoomButton.enabled = NO;

    carImageNames = @[ @"Car/1.jpg",@"Car/2.jpg",@"Car/3.jpeg",@"Car/4.jpg",@"Car/5.jpg"];//10
    [self setupScrollContent];
    // Do any additional setup after loading the view.
}

註釋:

  1. 爲車名數組創建私有的實例變量。如果數組的內容可以修改,那麼可以使用NSMutableArray
  2. 創建可變數組用於添加圖像視圖。
  3. 遍歷每個圖像文件名,創建UIImage並放在圖像視圖中
  4. 更改圖像視圖邊框的起始x位置,使它挨着上一幅圖像。將第一幅圖像的源點的x左邊設置爲0,然後在5中將上一幅圖像的寬度添加到原點
  5. 將當前圖像的寬度添加到起始位置,得到下一幅圖像的起始位置(如果這是最後一幅圖像,那麼得到該視圖的最終寬度)
  6. 將內容視圖的最大寬度設置爲最高圖像的高度
  7. 分配具有所有圖像寬度和最高圖像高度的容器視圖
  8. 將每幅圖像添加到新的容器視圖中
  9. 將容器視圖添加爲滾動視圖的子視圖,並設置其內容大小
  10. 初始化汽車圖像文件名的靜態數組

      運行結果如下圖:(他是連續的,不是分頁的這裏)

這裏寫圖片描述

  它們具有不同的寬度和高度。更好的體驗是讓所有的圖像具有相同的寬度。在調整圖像尺寸之後,可以使用分頁在圖像之間移動。

用下面代碼更換setupScrollContent

- (void)setupScrollContent{
    if (carImageContainerView != nil) {
        [carImageContainerView removeFromSuperview];
    }


    CGFloat scrollWidth = self.view.bounds.size.width;//1
    CGFloat totalWidth = scrollWidth * [carImageNames count];//2

UIView *carImageContainerView = [[UIView alloc]initWithFrame:CGRectMake(0.0, 0.0, totalWidth, self.scrollView.frame.size.height)];

    CGFloat atX = 0.0;
    CGFloat maxHeight = 0.0;
    UIImage *carImage;

    for (NSString *atCarImageName in carImageNames) {
        carImage = [UIImage imageNamed:atCarImageName];
        CGFloat scale = scrollWidth / carImage.size.width;//3

        UIImageView *atImageView = [[UIImageView alloc]initWithImage:carImage];

        CGFloat newHeight = atImageView.bounds.size.height;//4

        atImageView.frame = CGRectMake(atX, 0.0, scrollWidth, newHeight);

        if (newHeight > maxHeight) {
            maxHeight = newHeight;
        }

        atX += scrollWidth;

        [carImageContainerView addSubview:atImageView];
    }
    CGRect newFrame = carImageContainerView.frame;
    newFrame.size.height = maxHeight;
    carImageContainerView.frame = newFrame;

    [self.scrollView addSubview:carImageContainerView];
    self.scrollView.contentSize = carImageContainerView.bounds.size;
}

註釋:

  • 獲得滾動視圖的寬度,用於設置各圖像的寬度
  • 爲容器視圖計算總寬度
  • 計算使當前圖像與滾動視圖寬度相等的比例因子
  • 基於新的高度縮放圖像視圖。同時檢查最大高度值,用於設置內容視圖

運行結果如下圖:

這裏寫圖片描述

  滾動的時候就會發現分頁的不同。

添加縮放

  爲了允許UIScrollView進行縮放,需要進行4處主要修改:

  • 在汽車圖像視圖控制器中採用UIScrollViewDelegate協議
  • 實現viewForZoomingInScrollView:協議方法
  • 將滾動視圖委託連接到視圖控制器
  • 指定大於1.0的最大縮放級別和/或小於1.0的最小縮放級別

  • 在在汽車圖像視圖控制器中採用UIScrollViewDelegate協議,在CarImageViewController.h中修改:
@interface CarImageViewController : UIViewController
<UIScrollViewDelegate>
  • 爲縮放的視圖創建一個私有變量,在當前這種情況下,即汽車圖像容器視圖。在CarImageViewController.m中
@implementation CarImageViewController{
    NSArray *carImageNames; 
    UIView *carImageContainerView;
}
  • 在setupScrollContent中爲容器視圖創建新的實例變量
- (void)setupScrollContent{
    CGFloat scrollWidth = self.view.bounds.size.width;//1
    CGFloat totalWidth = scrollWidth * [carImageNames count];//2

    carImageContainerView = [[UIView alloc] initWithFrame:CGRectMake(0.0, 0.0, totalWidth, self.scrollView.frame.size.height)];

//    UIView *carImageContainerView = [[UIView alloc]initWithFrame:CGRectMake(0.0, 0.0, totalWidth, self.scrollView.frame.size.height)];
...
}
  • 在vieDidLoad的下方添加
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView {
    return carImageContainerView;
}

  這是用於返回要縮放視圖的滾動視圖委託協議方法。在當前這種情況下,只有一個可縮放的視圖——它包含所有的圖像視圖。

  上面的步驟處理了增加縮放視圖的前兩部分工作。現在,我們需要連接滾動視圖委託。

  打開故事面板

這裏寫圖片描述

  設置縮放倍數

這裏寫圖片描述

  ok,縮放完成,在模擬器上,按住option模擬兩個手指頭,效果如下:

這裏寫圖片描述

  現在來添加一個按鈕,用來一鍵恢復圖片圓形,按鈕如下面的樣子,注意一開始沒有縮放的時候,按鈕是禁止狀態。

這裏寫圖片描述

  然後爲這個按鈕創建一個引用和一個action,引用的名稱是resetZoomButton,action的名稱resetZoom

  在action中作如下修改:

- (IBAction)resetZoom:(id)sender {
    [self.scrollView setZoomScale:1.0 animated:YES];
}

  對了,可能有的會發現一開始按鈕是可以按的,爲了以防萬一,在viewDidLoad中添加:

- (void)viewDidLoad {
    [super viewDidLoad];
    self.resetZoomButton.enabled = NO;
    ...
}

  現在差不多完成啦,但是但我們在查看圖片的時候,將屏幕橫向,會發現又出現問題了。

  爲了解決這個問題,在轉向的時候,生成新的視圖,在vieDidload下添加代碼:

- (void)willAnimateRotationToInterfaceOrientation:(UIInterfaceOrientation)toInterfaceOrientation duration:(NSTimeInterval)duration{
    [super willAnimateRotationToInterfaceOrientation:toInterfaceOrientation duration:duration];

    [self setupScrollContent];
}

  然後,如果已經存在一個容器視圖,就修改setupScrollContent來移除該容器視圖,添加代碼:

- (void)setupScrollContent{

    if (carImageContainerView != nil) {
        [carImageContainerView removeFromSuperview];
    }

    ...
}

  哦,對了,忘了弄Car Number了

  在CarImageViewController.m中添加

- (void)updateCarNumberLabel {
    NSInteger carIndex = [self carIndexForPoint:self.scrollView.contentOffset];

    NSString *newText = [NSString stringWithFormat:@"Car Number: %ld",carIndex+1];

    self.carNumberLabel.text = newText;
}

- (NSInteger)carIndexForPoint:(CGPoint)thePoint {
    CGFloat pageWidth = self.scrollView.frame.size.width;

    pageWidth *= self.scrollView.zoomScale; //1

    return (NSInteger)(thePoint.x/pageWidth);//2
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
    [self updateCarNumberLabel];//3
}

註釋:

  1. 用縮放倍數乘以滾動視圖的寬度,獲得實際的頁面寬度
  2. 將浮點除法的結果轉換成整型
  3. 當滾動時,自動更新Car Number標籤

      我們還需要在視圖第一次出現時設置汽車車牌。在viewDidLoad下面添加

- (void)viewDidAppear:(BOOL)animated {
    [super viewDidAppear: animated];

    [self updateCarNumberLabel];
}

今天的介紹就到這裏咯

我的另一個博客站點:Arnold-你們好啊

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章