UIScrollerView && UIPageControl

一.滚动视图

1.简单认识

移动设备的屏幕⼤小是极其有限的,因此直接展⽰在⽤户眼前的内容也相当有限,当展⽰的内容较多超出一个屏幕时,用户可通过滚动操作来查看屏幕以外的内容,普通的UIView不具备滚动功能,不能显⽰过多的内容。UIScrollView是一个能够滚动的视图控件,可以⽤用来展⽰大量的内容,并且可以通过滚动查看所有的内容。

2.属性

  • contentOffset属性:UIScrollView滚动的位置;用来表示UIScrollView内容的尺寸,滚动范围(能滚多远)
  • contentSize属性:UIScrollView内容的尺⼨寸(相当于滚动的范围)
  • bounces属性:设置UIScrollView是否需要弹簧效果
  • alwaysBounceVertical属性:设置垂直方向是否有弹簧效果(必须在bounces设置为YES的前提下设置才有效)
  • alwaysBounceHorizontal属性:设置水平方向是否有弹簧效果(必须在bounces设置为YES的前提下设置才有效)
  • pagingEnabled属性:设置UIScrollView的滚动方式是否为翻页效果
  • scrollEnabled属性:设置UIScrollView是否能滚动
  • showsHorizontalScrollIndicator属性:是否显示水平方向的滑动条
  • showsVerticalScrollIndicator属性:是否显示垂直方向的滑动条
  • scrollIndicatorInsets属性:设置滚动条的位置,可以通过UIEdgeInsetsMake函数来指定该位置
  • indicatorStyle属性:设置滚动条的风格,有三个可选项:UIScrollViewIndicatorStyleDefault(灰)
    UIScrollViewIndicatorStyleBlack(黑)
    UIScrollViewIndicatorStyleWhite(白)
  • decelerationRate属性:减速比(通常是0-1的值 值越大减速越慢)
  • scrollsToTop属性:设置点击状态栏是否滑动到scrollView的顶部


    UIScrollerView && UIPageControl_第1张图片

3.方法

  • -setContentOffset:animated:方法:设置scrollView的位置
  • -scrollRectToVisible:animated:方法:将指定的区域滚动到可视范围之内,如果该地区已经在可视区域,则什么都不做

4.UIScrollViewDelegate

协议定义了滚动视图对应的事件的回调方法,下面的代码展示了其中的一部分方法


UIScrollerView && UIPageControl_第2张图片
屏幕快照 2016-08-26 下午3.17.30.png

5.UIScrollView不能滚动的几种情况

1.没有设置contentSize
2.scrollEnabled属性 = NO
3.userInteractionEnabled属性 = NO

  • 注意:enabled和userInteractionEnabled的区别
    enabled: 代表控件不可用
    userInteractionEnabled: 代表控件不可以和用户交互, 也就是不能响应用户的操作
    滚动条也是scrollView的子控件的一部分,所以以后在开发中不推荐大家通过subviews获取子控件的方式来操作子控件

6.UIScrollView常用功能

1.缩放功能

  • 1.设置UIScrollView的iddelegate代理对象
  • 2.设置minimumZoomScale:缩小的最小比例
  • 3.设置maximumZoomScale:放大的最大比例
  • 4.让代理对象实现下面的方法,返回需要缩放的视图控件
-(UIView*)viewForZoomingInScrollView:(UIScrollView*)scrollView;
  • 注意:跟缩放相关的其他代理方法
    缩放完毕的时候调用:
-(void)scrollViewWillBeginZooming:(UIScrollView*)scrollView withView:(UIView*)view;

正在缩放的时候调用

-(void)scrollViewDidZoom:(UIScrollView*)scrollView

7.实例演示

UIScrollerView && UIPageControl_第3张图片
屏幕快照 2016-11-02 上午10.40.50.png
UIScrollerView && UIPageControl_第4张图片
屏幕快照 2016-08-26 下午3.31.02.png

效果:6张图,加了个定时器,可以自己滚动,每次滚动的宽度是一张图片的宽度
如下图刚好是从当前图准备滚到下一张图的效果


UIScrollerView && UIPageControl_第5张图片
屏幕快照 2016-08-26 下午3.29.34.png

8.xib中设置ContentSize

http://blog.csdn.net/wokenshin/article/details/52239536

二.分页视图

1.简单认识

UIPageControl类提供一行点来指示当前显示的是多页面视图的哪一页, 当用户界面需要按页面显示时, 使用UIPageControl控件将要显示的用户界面内容分页进行显示会使编程工作变得更加方便快捷;如图


UIScrollerView && UIPageControl_第6张图片

2.基本属性 && 方法

1.属性


UIScrollerView && UIPageControl_第7张图片
屏幕快照 2016-08-26 下午3.44.20.png

备注:

defersCurrentPageDisplay属性:如果你希望直到有时间执行完你的操作之后,才更新当前指示器当前指示页,可以将该属性设为YES

2.UIPageControl的常用方法:
-updateCurrentPageDisplay:方法:更新页码指示器到当前页

给pageControl绑定事件
[pageControl addTarget:self action:@selector(pageControlChange:) 
forControlEvents:UIControlEventValueChanged];

实现pageControl的绑定事件()
- (void)pageControlChange:(UIPageControl *)pageControl {

 NSLog(@"点了"); // 更新当前页码 [pageControl updateCurrentPageDisplay];
}

3.通过KVC给UIPageControl的选中页面与非选中页面的控件的图片, 设置自定义滚动条图片(图片名随意加的)

[self.pageControl setValue:[UIImage imageNamed:@"current"] forKeyPath:@"_currentPageImage"];
[self.pageControl setValue:[UIImage imageNamed:@"other"] forKeyPath:@"_pageImage"];

3.实例演示(综合滚动视图)-->简单引导页

UIScrollerView && UIPageControl_第8张图片
屏幕快照 2016-08-26 下午3.52.16.png
UIScrollerView && UIPageControl_第9张图片
屏幕快照 2016-08-26 下午3.53.14.png
UIScrollerView && UIPageControl_第10张图片
屏幕快照 2016-08-26 下午3.58.10.png

效果图:


UIScrollerView && UIPageControl_第11张图片
屏幕快照 2016-08-26 下午4.00.17.png

(三张滚动图,滚到第三张加了个按钮,点击进入另一个控制器;在此做了个偏好设置,让该引导页在APP第一次启动时才出现,之后打开不再显示)
代码如下:


UIScrollerView && UIPageControl_第12张图片
屏幕快照 2016-08-26 下午4.04.32.png

代码69---72
UIScrollerView && UIPageControl_第13张图片
屏幕快照 2016-08-26 下午4.05.40.png

你可能感兴趣的:(UIScrollerView && UIPageControl)