一、常用屬性
Snip20151025_12.png
// 用來(lái)表示UIScrollView滾動(dòng)的位置,其實(shí)就是內(nèi)容左上角與scrollView左上角的間距值
@property(nonatomic)CGPoint contentOffset;
// 屬性用來(lái)表示UIScrollView內(nèi)容的尺寸洪燥，滾動(dòng)范圍（能滾多遠(yuǎn)）
@property(nonatomic)CGSize contentSize;
// 能夠在UIScrollView的4周增加額外的滾動(dòng)區(qū)域妥曲，一般用來(lái)避免scrollView的內(nèi)容被其他控件擋住
@property(nonatomic)UIEdgeInsets contentInset;
// 是否需要彈簧效果
BOOL bounces;
// UIScrollView是否能滾動(dòng)
BOOL scrollEnabled;
// 是否顯示水平滾動(dòng)條
BOOL showsHorizontalScrollIndicator;
// 是否顯示垂直滾動(dòng)條
BOOL showsVerticalScrollIndicator;
二守谓、UIScrollView不能滾動(dòng)的幾種情況
- 1.沒(méi)有設(shè)置contentSize
- 2.scrollEnabled屬性 = NO
- 3.userInteractionEnabled屬性 = NO
注意：
- enabled和userInteractionEnabled的區(qū)別
- enabled: 代表控件不可用
- userInteractionEnabled: 代表控件不可以和用戶交互, 也就是不能響應(yīng)用戶的操作
- 滾動(dòng)條也是scrollView的子控件的一部分
- 所以以后在開(kāi)發(fā)中不推薦大家通過(guò)subviews獲取子控件的方式來(lái)操作子控件
三瞎抛、UIScrollView常用功能
1墙贱、縮放功能
- 1.設(shè)置UIScrollView的id<UISCrollViewDelegate>delegate代理對(duì)象
- 2.設(shè)置minimumZoomScale：縮小的最小比例
- 3.設(shè)置maximumZoomScale：放大的最大比例
- 4.讓代理對(duì)象實(shí)現(xiàn)下面的方法热芹，返回需要縮放的視圖控件
-(UIView*)viewForZoomingInScrollView:(UIScrollView*)scrollView;
- 注意：跟縮放相關(guān)的其他代理方法
- 縮放完畢的時(shí)候調(diào)用
-(void)scrollViewWillBeginZooming:(UIScrollView*)scrollView withView:(UIView*)view
- 正在縮放的時(shí)候調(diào)用
-(void)scrollViewDidZoom:(UIScrollView*)scrollView
- 通過(guò)
KVC給UIPageControl的選中頁(yè)面與非選中頁(yè)面的控件的圖片, 設(shè)置自定義滾動(dòng)條圖片
[self.pageControl setValue:[UIImage imageNamed:@"current"] forKeyPath:@"_currentPageImage"];
[self.pageControl setValue:[UIImage imageNamed:@"other"] forKeyPath:@"_pageImage"];
+ 自定義View的步驟
- 1.重寫(xiě)初始化方法 (在里面進(jìn)行一次性的初始化)
- xib :awakeFromNib
- 純代碼:initWithFrame
- 2.重寫(xiě)layoutSubviews, 在里面布局子控件
- 3.接收外界傳入的數(shù)據(jù), 重寫(xiě)set方法
##### 2、圖片輪播器封裝
+ 1.布局輪播器界面
+ 2.自定義圖片輪播器View
- 1 .h頭文件惨撇，提供一個(gè)快速創(chuàng)建方法和一個(gè)接口：讓用戶來(lái)設(shè)置輪播的圖片
```objc
#import <UIKit/UIKit.h>
@interface JPPageView : UIView
+ (instancetype)pageView;
/** 所有需要展示的圖片名稱*/
@property (nonatomic, strong)NSArray *imageNames;
@end
- 2 .m文件伊脓，提供具體實(shí)現(xiàn)：
- 設(shè)置圖片數(shù)據(jù)，設(shè)置頁(yè)面條魁衙，設(shè)置scrollView的滾動(dòng)范圍报腔，以及scrollView的偏移量設(shè)置，布局子控件剖淀，定時(shí)器監(jiān)聽(tīng)輪播器的滾動(dòng)纯蛾，定時(shí)器添加到運(yùn)行循環(huán)中，切換頁(yè)面
#import "JPPageView.h"
@interface JPPageView ()<UIScrollViewDelegate> // 遵守協(xié)議
@property (weak, nonatomic) IBOutlet UIScrollView *sc;
@property (weak, nonatomic) IBOutlet UIPageControl *pageControl;
// 注意:NSTimer應(yīng)該是weak
@property (weak, nonatomic) NSTimer *timer;
@end
@implementation JPPageView
+ (instancetype)pageView
{
#warning 注意.這里有知識(shí)點(diǎn)
return [[[NSBundle mainBundle] loadNibNamed:@"JPPageView" owner:nil options:nil] lastObject];
}
// xib纵隔，初始化子控件
- (void)awakeFromNib
{
self.sc.delegate = self; // 設(shè)置scrollView的代理
// 1.隱藏滾動(dòng)條
self.sc.showsHorizontalScrollIndicator = NO;
self.sc.showsVerticalScrollIndicator = NO;
// 2.設(shè)置UIScrollView的其它屬性
self.sc.bounces = NO;
self.sc.pagingEnabled = YES;
// 3.監(jiān)聽(tīng)PageControl的點(diǎn)擊事件
[self.pageControl addTarget:self action:@selector(pageControlClick:) forControlEvents:UIControlEventValueChanged];
// 4.通過(guò)KVC給UIPageControl的私有屬性賦值, 設(shè)置自定義圖片
[self.pageControl setValue:[UIImage imageNamed:@"current"] forKeyPath:@"_currentPageImage"];
[self.pageControl setValue:[UIImage imageNamed:@"other"] forKeyPath:@"_pageImage"];
// 5.讓UIScrollView每隔一段事件就切換一頁(yè)
[self startTimer];
}
#pragma mark - 內(nèi)部監(jiān)聽(tīng)
- (IBAction)pageControlClick:(UIPageControl *)sender
{
self.sc.contentOffset = CGPointMake(sender.currentPage * self.sc.frame.size.width , 0);
}
#pragma mark - 定時(shí)器相關(guān)
- (void)startTimer
{
// 打開(kāi)定時(shí)器
self.timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(nextPage:) userInfo:@"lnj" repeats:YES];
// 主線程在處理其它事件的時(shí)候, 分一點(diǎn)時(shí)間來(lái)處理NSTimer
[[NSRunLoop mainRunLoop] addTimer:self.timer forMode:NSRunLoopCommonModes];
}
// 切換到下一頁(yè)
- (void)nextPage:(NSTimer *)timer
{
// 1.獲取下一頁(yè)的頁(yè)碼
NSUInteger page = self.pageControl.currentPage + 1;
// 2.判斷頁(yè)碼是否越界
if (page >= _imageNames.count) {
// 如果越界就回到第0頁(yè)
self.pageControl.currentPage = 0;
}else
{
// 如果沒(méi)有越界, 就進(jìn)入到下一頁(yè)
self.pageControl.currentPage = page;
}
[self pageControlClick:self.pageControl];
}
- (void)stopTimer
{
// 關(guān)掉定時(shí)器
[self.timer invalidate];
}
#pragma mark - UIScrollViewDelegate
// 只要滾動(dòng)就會(huì)調(diào)用
- (void)scrollViewDidScroll:(nonnull UIScrollView *)scrollView
{
// 1.計(jì)算頁(yè)碼
// 當(dāng)前頁(yè)碼 = 偏移位 / UIScrollView的寬度
CGFloat page = scrollView.contentOffset.x / scrollView.frame.size.width;
int currnetPage = page + 0.5;
// 2.修改頁(yè)碼
self.pageControl.currentPage = currnetPage;
}
// 開(kāi)始拖拽
- (void)scrollViewWillBeginDragging:(nonnull UIScrollView *)scrollView
{
[self stopTimer];
}
// 結(jié)束拖拽
- (void)scrollViewDidEndDragging:(nonnull UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
[self startTimer];
}
- (void)setImageNames:(NSArray *)imageNames
{
_imageNames = imageNames;
// 0.每次重新設(shè)置圖片, 都需要情空以前的圖片
for (UIView *subView in self.sc.subviews) {
[subView removeFromSuperview];
}
// 1.創(chuàng)建圖片
// 1.初始化子控件, 添加圖片
for (int i = 0; i < _imageNames.count; i++) {
// 1.創(chuàng)建UIImageView
UIImageView *iv = [[UIImageView alloc] init];
// 2.創(chuàng)建圖片
NSString *imageName = _imageNames[i];
UIImage *image = [UIImage imageNamed:imageName];
iv.image = image;
// 4.添加到父控件
[self.sc addSubview:iv];
}
// 2.設(shè)置pageControl的頁(yè)碼數(shù)量
self.pageControl.numberOfPages = _imageNames.count;
}
- (void)layoutSubviews
{
[super layoutSubviews];
CGFloat width = self.sc.frame.size.width;
CGFloat height = self.sc.frame.size.height;
NSUInteger imageCount = self.imageNames.count;
// 1.設(shè)置每個(gè)UIImageView的frame
for (int i = 0; i < imageCount; i++) {
UIImageView *iv = self.sc.subviews[i];
iv.frame = CGRectMake(i * width, 0, width, height);
}
// 2.設(shè)置滾動(dòng)范圍
self.sc.contentSize = CGSizeMake(imageCount * width, height);
}
@end
- 3.使用封裝好的圖片輪播器
- 創(chuàng)建圖片輪播器視圖對(duì)象翻诉，設(shè)置圖片數(shù)據(jù)即可
// 1.創(chuàng)建圖片輪播器
JPPageView *pageView = [JPPageView pageView];
// 2.設(shè)置圖片輪播器的frame
pageView.imageNames = @[@"img_01", @"img_02", @"img_03", @"img_04", @"img_05"];
pageView.frame = CGRectMake(27, 97, 320, 128);
// pageView.frame = CGRectMake(0, 97, 330, 200);
[self.view addSubview:pageView];
self.pageView = pageView;
