UI基础之—UIScrollView,UIPageControl

1.  UIScrollview是 iOS 中提供滚动的控件,用于解决当内容区域大小大于可视区域大小时,可以通过滚动的方式查看全部内容, UIScrollView 滑动视图的基类, UITableView 和 UITextView 是它的子类,内部实现原理是修饰视图的 bounds

2.   UIScrollview 主要专长于两个方面:

滚动: contentSize 大于 frame.size 的时候,能够滚动

缩放:自带缩放,可以指定缩放倍数

bounds 影响的是子视图在父视图上的位置

3.   1⃣创建scrollView 的对象

UISrollView *scroll = [[UISrollViewalloc]initWithFrame:CGRectMake(20,30,280,500)];

2⃣配置属性

scroll.backgroundColor = [UIColorredColor];

3⃣设置内容大小

scroll.contentSize =CGSizeMake(560,1000);

4⃣设置相框对象并添加到 scrollView 上

UIImageView *imageView = [UIImageViewalloc]

initWithFrame:CGRectMake(0,0,scroll.contentSize.width,

scroll.contentSize.height);

[scroll addSubview:imageView];

5⃣添加图片

imageView.image = [UIImage imageNamed:@”Pic.jpg”];

6⃣设置内容区域的偏移量,默认的偏移量为(0,0)

scroll.contentOffset = CGPointMake(0,0);

7⃣设置水平位置的滚动条是否显示

scroll.showsHorizontalScrollIndicator =NO; 默认YES显示         

设置垂直位置的滚动条是否显示

scroll.showsVerticalScrollIndicator = NO;

8⃣设置滚动条的格式

scroll.indicatorStyle =UIScrollViewIndicatorStyleWhite;

9⃣设置是否能够滚动

scroll.scorllEnabled = YES;  默认为 YES

4.  1⃣方向锁(设置滑动的时候只能在一个方向滑动)

scroll.direationLockEnabled = YES;

2⃣设置 scrollView 的整屏滑动,一次滑动 scrollView 的大小

scroll.pagingEnabled = NO;

3⃣设置滑动到边界的是否有回弹的效果

scroll.bounces = YES; YES 是没有反弹效果, NO 是由反弹效果

4⃣  设置内容大小小于视图大小的时候,依然有边缘反弹效果 scroll.alwaysBounceHorizontal =YES;

scroll.alwaysBounceVertical = YES;

5⃣  设置滑动到顶部(点击状态条的时候)设置点击状态 栏,

scrollview是否能够回到顶部

scroll.scrollsToTop = YES;

5.  1⃣设置缩放的比例

scroll.minimumZoomScale = 1.0;

scroll.maximumZoomScale = 4.0;

 2⃣  设置代理中的属性

scroll.delegate = self;

首先在创建的UIScrollView对象中设置代理对象

接着,在需要设置代理的类中添加UIScrollViewDelegate协议,并实现需要是实现的方法,用来控制UIScrollView的操作. 

6. UIScrollViewDelegate 协议中的关于UIScrollView 的方法:

① 当在scrollView上滑动的时候触发,会触发很多次

-(void)scrollViewDidScroll:(UIScrollView *)scrollView;

② scrollView 将要开始拖拽的时候触发(手指刚刚触摸到 scrollView 的时候)

     -(void)scrollViewWillBeginDragging:(UIScrollView *)scrollView;

③ scrollView将要结束拖拽的时候触发

-(void)scrollViewWillEndDragging:(UIScrollView *)scrollView  

withVelocity:(CGPoint)velocity targetContentOffset:(inout

CGPoint *)targetContentOffset;

④ scorllView 已经结束拖拽的时候触发

     -(void)scrollViewDidEndDragging:(UIScrollView *)scrollView

     willDecelerate:(BOOL)decelerate;

⑤ scrollView 开始减速的时候触发(必须要有加速的过程才能触发,该方法不一定会被触发)

-(void)scrollViewWillBeginDecelerating: (UIScrollView *)

scrollView;

⑥ scrollView 结束减速时触发(停止时)该方法也不一定会被触发

-(void)scrollViewDidEndDecelerating: (UIScrollView *)scrollView{

//当 scrollView 停止滑动时,回到最初的位置

scrollView.contentOffset = CGPointMake(0,0);

//不加动画效果回到最初的位置,特别生硬,带动画视图会慢慢移动

[scrollView setContentOffset:CGPointZero animated:YES];

}

⑦ scrollView结束滑动并且带有动画效果时触发(必须带有动画)

-(void)scrollViewDidEndScrollingAnimation: (UIScrollView *)

scrollView;

⑧ 回到顶部的操作:

当点击状态栏时,调用该方法,询问点击状态栏的scrollview 是否可以回到顶部(前提是:scrollToTop = YES)

-(BOOL)scrollViewShouldScrollToTop: (UIScrollView *)scrollView;

scrollView 已经回到顶部时触发(此时可以做刷新)

-(void)scrollViewDidScrollToTop: (UIScrollView *)scrollView;

⑨ 下面的四个方法,是对 scrollView进行扩充和缩放的时候触发的:

-(void)scrollViewDidZoom: (UIScrollView *)scrollView; 只要进行缩放,就会触发.

指定某个 UIScrollView 的子视图可以被放大缩小,返回值只能是 scrollView 上的子视图.

-(UIIView *)viewForZoomingInScrollView: (UIScrollView *)

scrollView{

return [scrollView viewWithTag:100];

}

将要开始缩放的时候触发:

-(void)scrollViewWillBeginZooming: (UIScrollView *)scrollView withView:(UIView *)view;

完成放大缩小的时候触发:

-(void)scrollViewDidEndZooming: (UIScrollView *)scrollView withView:(UIView *)view atScale: (CGFloat)scale{

// 重置为原来的大小

[scrollView setZoomScale:1.0 animated:YES];

}

#import "RootViewController.h"
@interface RootViewController ()<UIScrollViewDelegate>
@end
@implementation RootViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    //UIScrollView 是 iOS 中提供滚动的控件,用于解决当内容区域大小大于可视区域大小时,可以通过滚动的方式查看全部内容, UIScrollView 滑动视图的基类. UITableView 和 UITextView 是他的子类,内部实现原理是修饰视图的 bounds
    /*
     UIScrollview主要专长于两个方面:
     滚动: contentSize 大于 frame.size 的时候,能够滚动
     缩放:自带缩放,可以指定缩放倍数
     bounds影响的是子视图在父视图上的位置
     */
    // 1.创建 scrollView的对象
    UIScrollView *scroll = [[UIScrollView alloc]initWithFrame:CGRectMake(20, 30, 280,500)];
     // 2.配置属性
    scroll.backgroundColor = [UIColor redColor];
    // 2.1设置内容大小
    scroll.contentSize =CGSizeMake(280, 500);
     // 2.2设置图片
    UIImageView *imageView =[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, scroll.contentSize.width, scroll.contentSize.height)];
    imageView.tag = 100;
    // 2.3添加图片
    imageView.image = [UIImage imageNamed:@"Pic.jpg"];
    // 2.4设置内容区域的偏移量,默认的偏移量为(0,0)
    scroll.contentOffset = CGPointMake(0, 0);
    // 2.5设置水平位置的滚动条是否显示
    scroll.showsHorizontalScrollIndicator = NO;  //默认为 YES显示
    // 2.6设置垂直方向滚动条的显隐
    scroll.showsVerticalScrollIndicator = NO;  // 默认为 YES 显示
    // 2.7设置滚动条的格式
    scroll.indicatorStyle = UIScrollViewIndicatorStyleWhite;
    // 2.8设置是否能够滚动
    scroll.scrollEnabled = YES;// 默认是 YES
    // 2.9方向锁(设置滑动的时候只能在一个方向滑动)
    scroll.directionalLockEnabled = YES;
    // 2.10设置 ScrollView的整屏滑动,一次滑动 scrollView 的大小
    scroll.pagingEnabled = NO;
    // 2.11设置滑动到边界的是否有回弹效果
    scroll.bounces = YES;// YES 是没有反弹效果, NO 是由反弹效果
    // 2.12设置内容大小小于视图大小的时候,依然有边缘反弹效果
    scroll.alwaysBounceHorizontal = YES;
    scroll.alwaysBounceVertical = YES;
    // 2.13设置滑动到顶部(点击状态条的时候)设置点击状态栏, scrollview 是否能够回到顶部
    scroll.scrollsToTop = YES;
    // 2.12设置代理属性
    scroll.delegate = self;
    // 2.13设置缩放比例
    scroll.minimumZoomScale = 1.0;
    scroll.maximumZoomScale = 4.0;
    // 3.向 scroll 添加一个 UIImageVIew
    [scroll addSubview:imageView];
    [imageView release];
    [self.view addSubview:scroll];
    // 4.释放
    [scroll release];
    
   }
#pragma mark ------------协议中的方法------------------
//触发时机: scrollView 在滑动的时候触发,会触发很多次
- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
    //NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
// 触发时机:只要缩放,就会触发
- (void)scrollViewDidZoom:(UIScrollView *)scrollView{
NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
// 触发时机: scrollView 将要开始拖拽的时候触发(手指刚刚触摸到 scrollView 的时候)
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{
//NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
// 触发时机: scrollView 将要结束拖拽的时候被触发
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset{
//NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
// 触发时机: scrollView 已经结束拖拽的时候触发
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{
  //NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
// 触发时机: scrollView 开始减速的时候触发(必须有加速的过程才能触发,该方法不一定会被触发)
- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView{
  //NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
//触发时机 scrollView结束减速时触发(停止时)该方法也不一定会被触发
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
//NSLog(@"%s %d",__FUNCTION__,__LINE__);
    // 当 scorllView 停止滑动时,回到最初的位置
    //scrollView.contentOffset = CGPointMake(0, 0);
    // 不加动画效果会最初位置特别生硬,带动画效果视图会慢慢移动
    //[scrollView setContentOffset:CGPointZero animated:YES];
}
// 触发时机: scrollView 结束滑动并且带有动画效果时触发(必须要有动画)
- (void)scrollViewDidEndScrollingAnimation:(UIScrollView *)scrollView{
NSLog(@"%s %d",__FUNCTION__,__LINE__);
}

// 触发时机:指定某个 UIScrollView 的子视图可以被放大缩小.返回值只能是 scrollView 上的子视图
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView{
    NSLog(@"%s %d",__FUNCTION__,__LINE__);
    return [scrollView viewWithTag:100];  // 返回缩放的 imageView
}
//触发时机:将要开始缩放的时候触发
- (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(UIView *)view {
NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
//触发时机:完成放大缩小的时候触发
- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale{
NSLog(@"%s %d",__FUNCTION__,__LINE__);
    [scrollView setZoomScale:1.0 animated:YES];
};

// 触发时机:点击状态栏时,调用该方法,询问点击状态栏的 scrollView 是否可以回到顶部(前提是: scrollToTop = YES)
- (BOOL)scrollViewShouldScrollToTop:(UIScrollView *)scrollView{
   // NSLog(@"%s %d",__FUNCTION__,__LINE__);
    return YES;
}
// 触发时机:scrollView 已经回到顶部时触发(此时可以做刷新用)
- (void)scrollViewDidScrollToTop:(UIScrollView *)scrollView{
NSLog(@"%s %d",__FUNCTION__,__LINE__);
}
- (void)didReceiveMemoryWarning {
   // [super didReceiveMemoryWarning];
}
@end

6.  自定义协议和系统协议的使用流程:

1⃣自定义协议和代理  例如:DeleagateViewDelegate

1> 定义协议,(协议中的方法都是代理要做的任务)

2> 定义代理属性(存放从别的文件中传入的代理对象, id类型,服从协议,属性的属性 assign,实例变量名称一般为delegate)

3> 在其他文件中指定代理对象(找谁去干活)

4> 让代理对象类遵循协议(答应去干活)

5> 代理对象类实现协议中的方法(知道怎么去干活)

6> 委托人通知代理去执行协议中的方法(知道什么时候去干活)

2⃣系统类 代理和协议的使用流程

1> 在其他文件中指定协议对象(找谁去干活)

2> 让代理对象类遵循协议

3> 代理对象类实现协议的方法

二    UIPageControl 和 UILable 相似是iOS 中提供的分页控件,用来标识页数,可以通过点击 pageControl 切换分页,继承自 UIControl,通常跟 UIScrollView 配合使用.

(下面有配合使用编写的程序启动引导图程序)

1⃣创建一个UIPageControl 对象

UIPageControl *pageControl = [[UIPageControl alloc]

initWithFrame:CGRectMake(10,100,300,40)];

2⃣配置属性

设置总页数 pageControl.numberOfPages = 5;

设置颜色 pageControl.backgroundColor = [UIColor redColor];

配置当前页的颜色

pageControl.currentPageIndicatorTintColor = [UIColor greenColor];

配置其他分页的颜色

pageControl.pageIndicatorTintColor = [UIColor blueColor];

默认显示分页

pageControl.currentPage = 2;

3⃣为UIPageControl 添加单击事件

[pageControl addTarget:self action:@selector(pageControl:)forControlEvents: UIControlEventValueChanged];

实现方法:

 - (void) pageControl: (UIPageControl*)sender{

// 打印当前的页面

NSLog(@”%@”,sender.currenPage);

}

#import "RootViewController.h"

@interface RootViewController ()

@end

@implementation RootViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
      // UIPageControl 和 UILable 相似  是 iOS 中提供的分页控件,用来标识页数,可以通过点击 pageControl 切换分页,继承自 UIControl
      // 用于指示当前第几页(代码)
     // 通常与 UIScrollView 配合使用
    
    //self.view.backgroundColor = [UIColor blackColor];
    
    UIPageControl *pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(10, 100, 300, 40)];
    // 配置属性
    // 设置总页数
    pageControl.numberOfPages = 5;
    // 设置颜色
    pageControl.backgroundColor = [UIColor redColor];
    // 配置当前页的颜色
    pageControl.currentPageIndicatorTintColor = [UIColor greenColor];
    // 配置其他分页的颜色
    pageControl.pageIndicatorTintColor = [UIColor blueColor];
    // 默认显示分页
    pageControl.currentPage = 2;
    [pageControl addTarget:self action:@selector(pageControl:) forControlEvents:UIControlEventValueChanged];
     [self.view addSubview:pageControl];
    [pageControl release];
}

#pragma mark ----------实现方法----------
- (void)pageControl:(UIPageControl *) sender{
    NSLog(@"%ld",sender.currentPage);
    NSLog(@"打印当前页");

}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
}

@end

8.懒加载(LazyLoading)

  实现懒加载的步骤:

    1⃣写属性

    2⃣重写 get 方法,并且在内部进行判断,如果没有创建,再对其进行创建

    3⃣注意:使用懒加载技术,以后在使用的时候必须加上(self.)

    4⃣懒加载的好处

     1>当使用对象的时候,才对其进行创建,有效的节省内存

     2>通过懒加载可以实现分段代码分段

懒加载的使用:

1>定义一个视图控制器

#import "LanchpadViewController.h"
#import "RootViewController.h"
#define kScreenWidth  [[UIScreen mainScreen] bounds].size.width
#define kScreenHeight [[UIScreen mainScreen] bounds].size.height
#define kImageCount 6
@interface LanchpadViewController ()<UIScrollViewDelegate>
@property (nonatomic,retain) UIScrollView *scorllView;
@property (nonatomic,retain) UIPageControl *pageControl;
@end
@implementation LanchpadViewController
// 懒加载(LazyLoading)
// 实现懒加载的步骤:
/*
 1.写属性
 2.重写 get 方法,并且在内部进行判断,如果没有创建,再对其进行创建
 3.注意:使用懒加载技术,以后在使用的时候必须要加上(self.)
 4.懒加载的好处:
 1>当使用对象的时候,才对其进行创建,有效的节省内存
 2>通过懒加载可以实现代码分段
 */
- (void)dealloc{
    [_scorllView release];
    [_pageControl release];
    [super dealloc];
}
- (UIScrollView *)scorllView{
    if (_scorllView == nil) {
        _scorllView = [[UIScrollView alloc]initWithFrame:[UIScreen mainScreen].bounds];
    }
    return _scorllView;
}
- (UIPageControl *)pageControl{
    if (_pageControl == nil) {
        _pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake((kScreenWidth - 200) /2, kScreenHeight - 50, 200, 40)];
    }
    return _pageControl;
}
// 布局 scrollView
- (void)layoutScrollView{
   // 设置 scrollView 的内容的大小
    self.scorllView.contentSize = CGSizeMake(kScreenWidth *  kImageCount , kScreenHeight);
    // 设置屏幕滚动
    self.scorllView.pagingEnabled = YES;
    self.scorllView.delegate = self;
    self.scorllView.showsHorizontalScrollIndicator = NO;
    [self.view addSubview:self.scorllView];
    // 放置主视图
    for (int i= 0;  i < kImageCount; i++) {
        UIImageView *imageView = [[UIImageView alloc]initWithFrame:CGRectMake(kScreenWidth * i, 0, kScreenWidth, kScreenHeight)];
        NSString *imageName = [NSString stringWithFormat:@"v6_guide_%d", i + 1];
        imageView.image = [UIImage imageNamed:imageName];
        [self.scorllView addSubview:imageView];
        [imageView release];
        if (i == kImageCount - 1) {
            UITapGestureRecognizer *tapGR = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(handleTap:)];
            // 将 UIImageView 的交互打开
            imageView.userInteractionEnabled = YES;
            [imageView addGestureRecognizer:tapGR];
            [tapGR release];
        }
    }
}

// 实现手势的方法
- (void)handleTap:(UITapGestureRecognizer *)sende{
    // 1.当点击最后一张图片时,意味着用户引导界面启动结束,这是需要存储用户的操作信息
    NSUserDefaults *user = [NSUserDefaults standardUserDefaults];
    
    [user setBool:YES forKey:@"r"];
    [user synchronize];  // 立即同步用户信息,就是执行了存储操作
    
    // 2.进入程序主界面
    RootViewController *rootVC = [[RootViewController alloc]init];
    // 获取我们当前的主程序(应用程序)
    [UIApplication sharedApplication]. keyWindow.rootViewController = rootVC;
    // 释放
    [rootVC release];
    
}
// 布局 pageControl
- (void)layoutPageControl{
    // 添加到父视图
    [self.view addSubview:self.pageControl];
    self.pageControl.numberOfPages = kImageCount;
    self.pageControl.currentPageIndicatorTintColor = [UIColor orangeColor];
    self.pageControl.pageIndicatorTintColor = [UIColor lightGrayColor];
    [self.pageControl addTarget:self action:@selector(handlePage:) forControlEvents:UIControlEventValueChanged];
}
// 实现方法
- (void)handlePage:(UIPageControl *)sender{
    [self.scorllView setContentOffset:CGPointMake((kScreenWidth * sender.currentPage), 0)  animated:YES];
}
#pragma mark ----------实现协议中的方法------------
// 滑动结束的时候触发
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{
    // 获取 scrollView 的偏移量
    NSInteger index = scrollView.contentOffset.x / kScreenWidth;
    self.pageControl.currentPage = index;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    [self layoutScrollView];
    [self layoutPageControl];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
}
@end

2>在 AppDelegate.m文件中,设置引导图的启动(判断用户是否是第一次运行程序,如果是第一次运行程序,就启动引导图,如果不是第一次启动程序,就直接进入程序主界面)

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]]autorelease];
    // Override point for customization after application launch.
    self.window.backgroundColor = [UIColor whiteColor];
    [self.window makeKeyAndVisible];
    // 根据判断程序运行时是否需要启动引导图
    // 用户索引项,用户的一些偏好设置
    NSUserDefaults *user = [NSUserDefaults standardUserDefaults];
    
    if ( ![user boolForKey:@"r"]) {
        // 一旦发现返回值为 NO, 说明是第一次,之前没有存储过@"龙庆",则将用户引导界面作为我们 window 的根视图界面
        LanchpadViewController *lanchPad = [[LanchpadViewController alloc]init];
        self.window.rootViewController = lanchPad;
        [lanchPad release];
    }else{
        // 一旦发现为 YES, 说明不是第一次启动程序,,之前启动过,这个时候将 PageViewController 设定为我们 window 的跟视图控制器
        RootViewController *rootVC = [[RootViewController alloc]init];
        self.window.rootViewController = rootVC;
        [rootVC release];
    }
    return YES;
}