在這篇文章中倒堕，將嘗試通過用幾行代碼編寫我自己的小滾動視圖來解釋 UIScrollView 是如何工作的.
但首先橄妆，讓我們仔細(xì)看看坐標(biāo)系統(tǒng)如何在UIKit中工作。 如果您只對滾動視圖實現(xiàn)感興趣况木，請隨意跳過下一節(jié)咐蚯。
坐標(biāo)系統(tǒng)
每個視圖都定義了自己的坐標(biāo)系。 看起來像這樣苛让，x軸指向右側(cè)沟蔑，y軸指向下：
請注意，這個邏輯坐標(biāo)系不關(guān)心視圖的寬度和高度狱杰。 它沒有邊界瘦材，在四個方向上無限延伸。 現(xiàn)在讓我們在這個坐標(biāo)系下列出幾個項目（又名子視圖）浦旱。 每個彩色矩形代表一個子視圖：
在代碼中宇色，設(shè)置將如下所示：
UIView *redView = [[UIView alloc] initWithFrame:CGRectMake(20, 20, 100, 100)];
redView.backgroundColor = [UIColor colorWithRed:0.815 green:0.007
blue:0.105 alpha:1];
UIView *greenView = [[UIView alloc] initWithFrame:CGRectMake(150, 160, 150, 200)];
greenView.backgroundColor = [UIColor colorWithRed:0.494 green:0.827
blue:0.129 alpha:1];
UIView *blueView = [[UIView alloc] initWithFrame:CGRectMake(40, 400, 200, 150)];
blueView.backgroundColor = [UIColor colorWithRed:0.29 green:0.564
blue:0.886 alpha:1];
UIView *yellowView = [[UIView alloc] initWithFrame:CGRectMake(100, 600, 180, 150)];
yellowView.backgroundColor = [UIColor colorWithRed:0.972 green:0.905
blue:0.109 alpha:1];
[mainView addSubview:redView];
[mainView addSubview:greenView];
[mainView addSubview:blueView];
[mainView addSubview:yellowView];
邊界(bounds)
UIView文檔說明了這個關(guān)于邊界屬性：
邊界矩形...在自己的坐標(biāo)系中描述視圖的位置和大小。
一個視圖可以被認(rèn)為是一個窗口或視口到由其坐標(biāo)系定義的平面的矩形區(qū)域颁湖。視圖邊界表示這個矩形的位置和大小宣蠕。
假設(shè)我們的視圖的邊界矩形的寬度和高度是320×480點，其原點是默認(rèn)的（0,0）甥捺。 視圖成為坐標(biāo)系平面的視口抢蚀，顯示整個平面的一小部分。 界外的一切仍然存在镰禾，只有隱藏：
坐標(biāo)(Frame)
接下來，我們將修改邊界矩形的原點：
CGRect bounds = mainView.bounds;
bounds.origin = CGPointMake(0, 100);
mainView.bounds = bounds;
邊界矩形的原點現(xiàn)在在（0吴侦，100）屋休，所以我們的場景如下所示：
看起來好像這個觀點已經(jīng)下降了100個點，事實上這個觀點對于它自己的坐標(biāo)系是正確的备韧。 視圖在屏幕上的實際位置（或者在其超視圖中劫樟，更準(zhǔn)確地說）仍然是固定的，然而织堂，由它的框架決定叠艳，它沒有改變：
框架矩形...在其超級視圖的坐標(biāo)系中描述視圖的位置和大小。
由于視圖的位置是固定的（從它自己的角度來看）易阳，所以把坐標(biāo)系平面看作是我們可以拖動的透明膠片附较，將視圖看作是我們正在查看的固定窗口。 調(diào)整邊界的原點相當(dāng)于移動透明膠片潦俺，使其另一部分通過視圖變得可見：
而這正是UIScrollView滾動時的功能。 請注意捕发，從用戶的角度來看疏旨，盡管視圖的子視圖在視圖的坐標(biāo)系統(tǒng)（換言之，就是他們的坐標(biāo)）方面的位置保持不變扎酷，但看起來好像視圖的子視圖正在移動檐涝。
我們來構(gòu)建UIScrollView
滾動視圖不需要不斷更新其子視圖的坐標(biāo)以使其滾動。 它所要做的就是調(diào)整邊界的起點法挨。 有了這些知識谁榜，實現(xiàn)一個非常簡單的滾動視圖是微不足道的。 我們設(shè)置了一個手勢識別器來檢測用戶的平移手勢凡纳，并且響應(yīng)一個手勢窃植，我們通過拖動的量來轉(zhuǎn)換視圖的邊界：
// CustomScrollView.h
@import UIKit;
@interface CustomScrollView : UIView
@property (nonatomic) CGSize contentSize;
@end
// CustomScrollView.m
#import "CustomScrollView.h"
@implementation CustomScrollView
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self == nil) {
return nil;
}
UIPanGestureRecognizer *gestureRecognizer = [[UIPanGestureRecognizer alloc]
initWithTarget:self action:@selector(handlePanGesture:)];
[self addGestureRecognizer:gestureRecognizer];
return self;
}
- (void)handlePanGesture:(UIPanGestureRecognizer *)gestureRecognizer
{
CGPoint translation = [gestureRecognizer translationInView:self];
CGRect bounds = self.bounds;
// Translate the view's bounds, but do not permit values that would violate contentSize
CGFloat newBoundsOriginX = bounds.origin.x - translation.x;
CGFloat minBoundsOriginX = 0.0;
CGFloat maxBoundsOriginX = self.contentSize.width - bounds.size.width;
bounds.origin.x = fmax(minBoundsOriginX, fmin(newBoundsOriginX, maxBoundsOriginX));
CGFloat newBoundsOriginY = bounds.origin.y - translation.y;
CGFloat minBoundsOriginY = 0.0;
CGFloat maxBoundsOriginY = self.contentSize.height - bounds.size.height;
bounds.origin.y = fmax(minBoundsOriginY, fmin(newBoundsOriginY, maxBoundsOriginY));
self.bounds = bounds;
[gestureRecognizer setTranslation:CGPointZero inView:self];
}
@end
就像真正的UIScrollView，我們的類有一個contentSize屬性荐糜，必須從外部設(shè)置來定義可滾動區(qū)域的范圍巷怜。 當(dāng)我們調(diào)整邊界時，我們確保只允許有效值暴氏。
結(jié)果：
結(jié)論
由于UIKit中坐標(biāo)系的嵌套特性关带，重新實現(xiàn)UIScrollView的本質(zhì)所需的代碼少于30行。 當(dāng)然沼撕，真正的UIScrollView還有比這更多的東西宋雏。 動量滾動，彈跳务豺，滾動指標(biāo)磨总，縮放和委托方法只是我們在這里沒有實現(xiàn)的一些功能。
