Objective-C:UIScrollView控制項和UIPageControl控制項的詳解

標籤：

UIScrollView控制項和UIPageControl控制項：   UIScrollView用於顯示多於一個螢幕的內容，超出螢幕範圍的內容可以通過滑動進行查看，當然UIPagecontrol也能實現圖片分頁查看。   UIScrollView往往搭配UIPageControl一起使用，當UIScrollView進行分頁時，UIPagecontrol對應的點也會相應的變動，圖片翻轉，反之亦然。 一、UIScrollView常見屬性：@interface UIScrollView : UIView <NSCoding> {

@property(nonatomic) CGPoint contentOffset; // UIScrollView當前滾動的位置

@property(nonatomic) CGSize  contentSize;    // 設定UIScrollView的滾動範圍(滾動圖大小)

@property(nonatomic) UIEdgeInsets  contentInset; // 這個屬性可以在四周增加滾動範圍(即增減周邊空白部分)

@property(nonatomic,assign) id<UIScrollViewDelegate> delegate; //滾動視圖的代理

@property(nonatomic,getter=isDirectionalLockEnabled) BOOL directionalLockEnabled; // 控制項是否只在一個方向滾動

@property(nonatomic)  BOOL bounces;  // 是否有彈簧效果

@property(nonatomic)  BOOL    alwaysBounceVertical;  //設定垂直方向的彈簧效果

@property(nonatomic)  BOOL    alwaysBounceHorizontal; // 設定水平方向的彈簧效果

@property(nonatomic,getter=isPagingEnabled) BOOL  pagingEnabled; //控制控制項是否整頁翻動

@property(nonatomic,getter=isScrollEnabled) BOOL  scrollEnabled;  //是否能滾動

@property(nonatomic)  BOOL    showsHorizontalScrollIndicator; // 是否顯示水平方向的捲軸

@property(nonatomic)  BOOL    showsVerticalScrollIndicator;   // 是否顯示垂直方向的捲軸

@property(nonatomic)  UIEdgeInsets  scrollIndicatorInsets;  // 設定滾動範圍

@property(nonatomic)  UIScrollViewIndicatorStyle   indicatorStyle;  //設定捲軸樣式

@property(nonatomic)  CGFloat     decelerationRate ; //設定手指放開後的減速率 

@property(nonatomic) CGFloat zoomScale  //放縮比例

@property(nonatomic) BOOL  bouncesZoom   //是否實現所給的彈簧比例

@property(nonatomic) BOOL  scrollsToTop  //是否能夠滾動到頂部

}@end

UIScrollView常見方法：

- (void)setContentOffset:(CGPoint)contentOffset animated:(BOOL)animated; // 以恒定速度為動畫設定新的位移量

- (void)scrollRectToVisible:(CGRect)rect animated:(BOOL)animated; //設定由rect定義的地區僅僅是滾動視圖內是可見的

- (void)flashScrollIndicators;  //閃一下捲軸,暗示是否有可滾動的內容

二、UIScrollView手勢縮放設定UIScrollView的id<UISCrollViewDelegate> delegate代理對象設定minimumZoomScale ：縮小的最小比例設定maximumZoomScale ：放大的最大比例讓代理對象實現下面的方法，返回需要縮放的視圖控制項

-(UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView

跟縮放相關的常用方法還有

-(void)scrollViewDidZoom:(UIScrollView *)scrollView 正在縮放的時候調用

-(void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(float)scale  縮放完畢的時候調用

三、 UIPagecontrol分頁效果

設定pagingEnabled=YES即可，UIScrollView會被分割成多個獨立頁面，使用者的滾動體驗則變成了頁面翻轉一般會配合UIPageControl增強分頁效果 UIPageControl常用屬性： NSInteger numberOfPages : 總頁數NSInteger currentPage : 當前的頁碼BOOL hidesForSinglePage : 當只有一頁的時候，是否要隱藏視圖

@property(nonatomic,retain) UIColor *pageIndicatorTintColor;設定控制器頁碼點得顏色

@property(nonatomic,retain) UIColor *currentPageIndicatorTintColor;設定控制器當前所在頁碼點的顏色

監聽UIPageControl的頁面改變：

// 添加監聽器

[pageControl addTarget:self action:@selector(pageChange:) 

forControlEvents:UIControlEventValueChanged];

// 監聽方法

- (void)pageChange:(UIPageControl *)pageControl

{  

}

四、UIScrollView滾動視圖要實現的協議：UIScrollViewDelegate

@protocol UIScrollViewDelegate<NSObject>

@optional

- (void)scrollViewDidScroll:(UIScrollView *)scrollView；//正在執行滾動視圖的滾動操作時調用

- (void)scrollViewDidZoom:(UIScrollView *)scrollView ; //正在執行滾動視圖的放縮操作時調用

- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;//執行滾動視圖的拖拽開始時調用

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset ; //執行滾動視圖的拖拽結束時調用

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate;//執行滾動視圖的拖拽結束時調用(是否減速)

- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView; // 執行滾動視圖減速開始時調用 

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView;  // 執行滾動視圖減速結束時調用  

- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView; //滾動視圖動畫結束時調用

- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView;//執行滾動視圖放縮時返回新的視圖    

- (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(UIView *)view ; //滾動視圖放縮開始時調用

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale; //滾動視圖放縮結束時調用

- (BOOL)scrollViewShouldScrollToTop:(UIScrollView *)scrollView;  //滾動視圖是否滾動到頂部 

- (void)scrollViewDidScrollToTop:(UIScrollView *)scrollView;   //滾動視圖滾動到頂部時調用

@end

  代碼範例解析：  一、單張圖片案例：   (1)

    //設定imageView，擷取圖片資源

    UIImage *img = [UIImage imageNamed:@"landscape.jpg"];

    self.imageview = [[UIImageView alloc]init];

    [self.imageview setImage:img];

    self.imageview.contentMode = UIViewContentModeScaleAspectFit;//防止圖片在變換的過程中失真

    self.imageview.frame = CGRectMake(0, 0, img.size.width, img.size.height);

        

    //設定scrollView(位置和大小即 origin.x 、origin.y、 size.width 、size.height)

    self.scrollview.contentSize = img.size; //直接將滾動視圖中存放內容的範圍大小設定為圖片的大小

    self.scrollview.contentOffset = CGPointZero;//預設origin.x = 0,orgin.y = 0

    

    //彈簧效果(所謂彈簧效果就是不論圖片被拽托到滾動圖內那兒鬆開後都會返回原來的位置上)

    self.scrollview.bounces = NO;

    

    //添加四條邊距(相當於相框部分)

    self.scrollview.contentInset = UIEdgeInsetsMake(10, 10, 10, 10);

    

    //滾動效果(圖片太大時,能否拖拽著移動查看其他部分)

    self.scrollview.scrollEnabled = YES;

    

    //捲軸的設定(類似於滑塊,有上下滑動的，也有左右滑動的)

    //self.scrollview.showsHorizontalScrollIndicator = NO;//水平方向

    //self.scrollview.showsVerticalScrollIndicator = NO;  //垂直方向

    

    //設定捲軸的樣式

    self.scrollview.indicatorStyle = UIScrollViewIndicatorStyleBlack;

    

    //將視圖添加到滾動視圖中

    [self.scrollview addSubview:self.imageview];

 

    //將視圖設定到滾動視圖最後面(如果在滾動視圖上添加其他的控制項如UIButton，採取這種方式可以避免button控制項被圖片遮蓋)

    [self.scrollview sendSubviewToBack:self.imageview];

 

 //添加按鈕事件來滾動圖片

   - (IBAction)buttonClicked:(UIButton *)sender

    {

       CGPoint point = self.scrollview.contentOffset;

       self.scrollview.contentOffset = CGPointMake(point.x+20, point.y);

     }

 二、圖片輪轉播放器案例：

 

Objective-C:UIScrollView控制項和UIPageControl控制項的詳解