滚动视图 UIScrollerView、分页控件

一、滚动视图

  1>核心属性

   frame 可视化区域

   contentSize 全部的内容区域大小

   contentOffset  内容偏移量 

内容的偏移量：

  a. (当前正在显示的区域的左顶点,距离全部内容区域左顶点的位置)

  b.此属性既可以通过用户交互动作(拨动),被系统自动修改,也可以由代码来修改,就是会实现内容的移动的效果

  2>滚动视图的应用—— 编写欢迎界面

   a.核心理念:将多张图片,依次,按顺序,算好位置,添加到滚动视图中

   b.滚动视图的其他可配置属性:

bounces   边缘是否可以弹跳

pagingEnable   是否整页滚动

showsHorizontalScrollIndicator  是否显示水平指示器

   c.圆点提示:UIPageControl

step1:创建UIPageControl的实例

step2:设置pageControl的frame

step3:添加当前控制器的view中

   d.如何实现在滚动时,修改PageControl中被选中的小圆点的位置?

为了捕获滚动视图与用户发生了交互,获取到滚动事件,需要设置 当前(图片视图)控制器为滚动视图的代理,那么当滚动视图有任何变化时,都会给代理发消息,于是,当前控制器就能捕获到滚动视图的滚动事件了

step1: 设置滚动视图的delegate属性（数据代理）

step2: 控制器遵守协议

step3: 实现协议中的方法

   e.如何实现在最后一屏中,出现一个可点击的按钮

方案一:在scrollView中添加一个按钮,横向坐标要参照scrollView的左顶点来计算,所以需要知道最后一屏之前越过了几屏

方案二:在最后一屏的 UIImageView中添加一个按钮,这个按钮的frame计算x时,就要以图片的左顶点做参考点

二、分页控件

 

UIPageControl *pageControl = [[UIPageControl alloc]init];//创建pageControl实例

self.pageControl = pageControl;//将该对象作实例赋给当前控制器

pageControl.frame = CGRectMake(0, self.view.bounds.size.height-60, self.view.bounds.size.width, 30);//设置pageControl的frame

[self.view addSubview:pageControl];//添加pageControl到当前控制器的view中

pageControl.numberOfPages = 4;//配置pageControl所指示的页数

pageControl.pageIndicatorTintColor = [UIColor blackColor];//配置提示符的颜色

pageControl.currentPageIndicatorTintColor = [UIColor redColor];//配置选中的提示符的颜色

pageControl.userInteractionEnabled = NO;//关闭圆点与用户的交互功能 

 

 

 

CGFloat yOffset = scrollView.contentOffset.y;//这个属性是用来查看scrollerview当前的偏移量

2..配置滚动视图

UIScrollView *sv = [[UIScrollView alloc]init];//创建滚动视图

sv.delegate = self;//设置当前控制器为滚动视图的代理类,响应滚动视图发出的各种消息

sv.frame = self.view.bounds;//设置滚动视图的可见区域与控制器的view一样大

sv.contentSize = CGSizeMake(4*sv.bounds.size.width, sv.bounds.size.height);//设置滚动视图的内容大小

sv.bounces = NO;//配置滚动视图到达边缘时不弹跳

sv.pagingEnabled = YES;//配置滚动视图整页滚动

sv.showsHorizontalScrollIndicator = NO;//配置滚动视图不显示水平滚动条提示

for (int i=0; i<<span style="font-kerning: none; color: #0435ff">4; i++) {//向滚动视图中添加多个图片子视图        

   NSString *imageName = [NSString stringWithFormat:@"welcome%d.png",i+1];//格式化出图片的名称       

    UIImageView *imageView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:imageName]]; //创建一个图片视图对象

     CGRect iFrame = CGRectZero;//声明了一个结构体的变量,其中x和y和w和h初始化为0

     iFrame.origin = CGPointMake(i*sv.bounds.size.width, 0);

     iFrame.size = sv.bounds.size;

     imageView.frame = iFrame;//引入第三方变量设置图片视图的位置及大小   

     [sv addSubview:imageView];//将图片视图添加到滚动视图中

  icon.contentMode = UIViewContentModeScaleAspectFill;

icon.clipsToBounds = YES;

    if (i == 3) { 

         [self addEnterButton:imageView]; //向图片视图中添加按钮

     }

}  

 [self.view addSubview:sv];//将滚动视图添加到控制器的view中#pragma mark - UIScrollViewDelegate 协议(利用滚动视图代理协议的某个方法设置分页控件)

- (void)scrollViewDidScroll:(UIScrollView *)scrollView{//任何偏移量改变响应

   int index = round(scrollView.contentOffset.x / self.view.bounds.size.width); //round函数的功能是四舍五入

   self.pageControl.currentPage = index;

}

3.向图片视图中添加按钮的方法

-(void)addEnterButton:(UIImageView *)iv{

    iv.userInteractionEnabled = YES;//开启图片视图的用户交互功能,否则里面的子视图按钮是不能接收用户的交互的

   UIButton *button = [[UIButton alloc]init];//创建按钮实例

    button.frame = CGRectMake((iv.bounds.size.width-150)/2,iv.bounds.size.height*0.6, 150, 40);//设置按钮的frame

    [button setTitle:@"进入应用" forState:UIControlStateNormal];//设置按钮的名称及类型

    button.backgroundColor = [UIColor lightGrayColor]; //设置按钮的背景色

    [iv addSubview:button];//将按钮添加到图片视图中

    [button addTarget:self action:@selector(enterApp:) forControlEvents:UIControlEventTouchUpInside];//为按钮添加事件响应

}

4.点击进入应用按钮后,执行该方法

-(void)enterApp:(UIButton *)button{//由于welcomeVC不再是window的根视图控制器了,所以就会被释放掉,但是使用present方式切换就不会释放掉welcomevc

    MainViewController *mainVC = [[MainViewController alloc]init];

    UIWindow *window = [UIApplication sharedApplication].keyWindow;//获取应用的主window对象,先获取应用程序对象

    window.rootViewController = mainVC;//更换window的根视图控制器为mainVC   

}

 

三.获取scrollerView中的宽高

 

    CGFloat documentWidth = [[webView stringByEvaluating.offsetWidth"] floatValue];

    CGFloat documentHeight = [[webView stringByEvaluatingJavaScriptFromString:@"document.body.scrollHeight"] floatValue];

 

    NSLog(@"documentSize = {%f, %f}", documentWidth, documentHeight);