文档章节

UI_07 UIScrollView、UIPageControl

黑伞将军
 黑伞将军
发布于 2015/08/24 22:19
字数 1345
阅读 134
收藏 3

⼀、UIScrollView的常⽤属性

     UIScrollView是一个能够滚动的视图控件,可以用来展示大量的内容,并且可以通过滚动查看所有的内容。UIScrollView是所有滚动视图的基类。

1、UIScrollView核⼼功能

滚动:contentSize⼤于frame.size的时候,能够滚动。 缩放:⾃带缩放,可以指定缩放倍数。

2、UIScrollView滚动相关属性

  • contentSize //定义内容区域⼤⼩, contentSize>frame.size,可以滚动

  • contentOffset //视图左上⾓距离坐标原点的偏移量

  • contentInset //视图内边界大小,或者说增加UIScrollView额外的滚动区域

  • scrollsToTop //滑动到顶部(点状态条的时候)

  • pagingEnabled //是否整屏翻动

  • bounces //边界是否回弹

  • scrollEnabled //是否能够滚动

  • showsHorizontalScrollIndicator //控制是否显⽰⽔平⽅向的滚动条

  • showVerticalScrollIndicator //控制是否显⽰垂直⽅向的滚动条

  • alwaysBounceVertical //控制垂直⽅向遇到边框是否反弹

  • alwaysBounceHorizontal //控制⽔平⽅向遇到边框是否反弹

3、UIScrollView缩放相关属性

  • minimumZoomScale // 缩⼩的最⼩⽐例

  • maximumZoomScale //放⼤的最⼤⽐例

  • zoomScale //设置变化⽐例

  • zooming //判断是否正在进⾏缩放反弹

  • bouncesZoom //控制缩放的时候是否会反弹

     要实现缩放,还需要实现delegate,指定缩放的视图是谁。

     滚动、缩放都是相对于 ScrollView 中的内容的,相当于 ScrollView 是一个窗口,里面的内容被各种缩放、滚动改变位置,我们看到的窗口所在的位置没有发生改变,改变的只是里面的内容。

  • UIScrollView 中的缩放是缩放 contentSize

  • 设置 UIScrollView 中子 View 的 frame 时,是相对于 UIScrollView 的 frame 的,和 contentSize 无关。

  • 还原: scrollView.zoomScale = 1.0;



⼆、UIScrollView的常⽤代理⽅法

1、UIScrollView滚动

滚动就会触发

- (void)scrollViewDidScroll:(UIScrollView *)scrollView 

开始减速时触发(手指离开

- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView 

停止时触发

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView


2、UIScrollView缩放

代理⽅法

任何缩放放生时触发

- (void)scrollViewDidZoom:(UIScrollView *)scrollView NS_AVAILABLE_IOS(3_2);

开始缩放前触发

- (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(UIView *)view NS_AVAILABLE_IOS(3_2)

缩放结束触发

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

指定缩放视图

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

实现步骤

  • 设置UIScrollView的id<UISCrollViewDelegate> delegate代理对象

  • 设置minimumZoomScale :缩小的最小比例

  • 设置maximumZoomScale :放大的最大比例

  • 让代理对象实现上面“指定缩放视图”的方法,返回需要缩放的视图控件

3、UIScrollView拖拽

开始拖拽时触发

- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView 

将要结束拖拽时触发

- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inoutCGPoint *)targetContentOffset NS_AVAILABLE_IOS(5_0);

结束拖拽时触发

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate 


4、UIScrollViewdelegate的通信如下图所示



三、UIPageControl

     UIPageControl与UILabel相似,⽤于指⽰当前第⼏⻚(代码),通常与UIScrollView配合使⽤。

常用属性

     currentPage      //当前⻚

     numberOfPages  //⻚⾯的总数

     currentPageIndicatorTintColor //当前页码指示器的颜色

     pageIndicatorTintColor        //其他页码指示器的颜色的颜色

     hidesForSinglePage     //只有一页时,是否隐藏页码指示器    

UIPageControl的使用见下面- (void)createPageControl 方法

综合使用

自定义类Carousel继承自UIScrollView,在其中添加图片并设置代理UIScrollViewDelegate,通过方法 - (void)scrollViewDidZoom:(UIScrollView *)scrollView 实现缩放功能

Carousel.h

#import <UIKit/UIKit.h>

@interface Carousel : UIScrollView<UIScrollViewDelegate>

@property (nonatomic, retain) UIImageView *imgView;

- (instancetype)initWithFrame:(CGRect)frame andImage:(UIImage *)image;

@end

Carousel.m

#import "Carousel.h"

@implementation Carousel

- (
instancetype)initWithFrame:(CGRect)frame andImage:(UIImage *)image
{
   
self = [super initWithFrame:frame];
   
if (self) {
       
       
UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, frame.size.width, frame.size.height)];
       
_imgView = imgView;
        imgView.
image = image;
       
        [
self addSubview:imgView];
       
       
self.minimumZoomScale = 0.5;
       
self.maximumZoomScale = 2.0;
       
self.bounces = NO;
       
self.delegate = self;
       
self.showsHorizontalScrollIndicator = NO;
       
self.showsVerticalScrollIndicator = NO;
       
        [imgView
release];
    }
   
return self;
}

- (
UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
   
return _imgView;
}

- (
void)scrollViewDidZoom:(UIScrollView *)scrollView
{
   
if (self.zoomScale < 1) {
       
_imgView.center = self.center;
    }
}

@end

RootViewController.m

#import "RootViewController.h"
#import
"Carousel.h"

int imgNum = 3;
@interface RootViewController ()<UIScrollViewDelegate>
@property (nonatomic, retain) UIScrollView *scrollView;
@property (nonatomic, retain) UIPageControl *pageControl;
@end

@implementation RootViewController

- (
void)dealloc
{
    [
_scrollView release];
    [
_pageControl release];
    [
super dealloc];
}

- (
void)viewDidLoad {
    [
super viewDidLoad];
   
    [
self createScrollView];
   
    [
self createPageControl];

     NSTimer *timer = [NSTimertimerWithTimeInterval:1.75 target:self selector:@selector(pageChanged:) userInfo:nil repeats:YES];      [[NSRunLoop currentRunLoop] addTimer:timer forMode:NSDefaultRunLoopMode];

    [timer fire];
   
NSLog(@"%d", -1%+3);
}

// 定时器调用此方法

- (void)pageChanged:(NSTimer *)timer;
{
   
static int i=0;
   
_pageControl.currentPage = i%3;
    i++;
    [
self changePages:_pageControl];

}


- (
void)createScrollView
{
   
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.frame];
   
self.scrollView = scrollView;
   
    scrollView.
contentSize = CGSizeMake(CGRectGetWidth(scrollView.frame)*imgNum, CGRectGetHeight(scrollView.frame));
    scrollView.
pagingEnabled = YES;
   
    scrollView.
backgroundColor = [UIColor blueColor];
   
    scrollView.
delegate = self;
    scrollView.
showsHorizontalScrollIndicator = NO;
   
    scrollView.
bounces = NO;
    
   
for (int i = 0; i<imgNum; i++) {
       
NSString *imgName = [NSString stringWithFormat:@"image%d", i+1];
       
Carousel *carouselScroll = [[Carousel alloc] initWithFrame:CGRectMake(CGRectGetWidth(scrollView.frame)*i, 0, CGRectGetWidth(scrollView.frame), CGRectGetHeight(scrollView.frame)) andImage:[UIImage imageNamed:imgName]];
       

        [scrollView addSubview:carouselScroll];

    }

    scrollView.scrollEnabled = YES;
   
    [
self.view addSubview:scrollView];
    [scrollView
release];
}

- (
void)createPageControl
{
   
UIPageControl *pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(78, 600, 200, 30)];
   
self.pageControl = pageControl;
   
//    pageControl.backgroundColor = [UIColor redColor];
    pageControl.
numberOfPages = imgNum;
   
    [pageControl
addTarget:self action:@selector(changePage:) forControlEvents:UIControlEventValueChanged];
   
    [
self.view addSubview:pageControl];
    [pageControl
release];
}

- (
void)changePage:(UIPageControl *)pageControl
{
    [
_scrollView setContentOffset:CGPointMake(CGRectGetWidth(_scrollView.frame)*pageControl.currentPage, 0) animated:YES];
}

- (
void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
   
_pageControl.currentPage = _scrollView.contentOffset.x/CGRectGetWidth(_scrollView.frame);
   
for (Carousel * obj in _scrollView.subviews) {
       
if ([obj isKindOfClass:[Carousel class]]) {
           
if (obj.zoomScale != 1) {
                obj.
zoomScale = 1.0;
                obj.
imgView.center = obj.center;
            }
        }
    }
}

@end

注:使用MRC



四、NSTimer

     NSTimer叫做“定时器”,它的作用如下

  • 在指定的时间执行指定的任务

  • 每隔一段时间执行指定的任务

 

开启:

     每隔ti秒,调用一次aTargetaSelector方法,yesOrNo决定了是否重复执行这个任务

+ (NSTimer *)scheduledTimerWithTimeInterval:(NSTimeInterval)ti target:(id)aTarget selector:(SEL)aSelector userInfo:(id)userInfo repeats:(BOOL)yesOrNo;

停止:

     通过invalidate方法可以停止定时器的工作,一旦定时器被停止了,就不能再次执行任务。只能再创建一个新的定时器才能执行新的任务

- (void)invalidate;



注意:UIScrollView无法滚动的解决办法

如果UIScrollView无法滚动,可能是以下原因:

  • 没有设置contentSize

  • scrollEnabled = NO

  • 没有接收到触摸事件:userInteractionEnabled = NO

  • 没有取消autolayout功能(如果在Storyboard中添加了ScrollView的子控件,要想scrollView滚动,必须取消autolayout)


© 著作权归作者所有

黑伞将军
粉丝 1
博文 33
码字总数 34553
作品 0
张家口
程序员
私信 提问
iOS引导界面与主界面之间切换

第一部分 预习部分 笔者所用的开发工具是苹果的Xcode6.0.1,模拟器是iOS8.0的。做这部分的工作需要对两个ui控件要有所熟悉:一个是UIscrollView,另一个是UIPageControl。这两个控件经常混在一...

不孤独的美食家
2015/06/09
3.2K
0
UIScrollView 和UIPageControl 实现app启动滑动图

一、使用NSUserDefaults 判断滑动图有没有出现过,加载滑动图 二、初始化 UIScrollView 和 UIPageControl 为启动滑动图做准备 三、实现UIScrollView的代理方法 四、从屏幕上移除UIScrollVie...

蝴蝶庆庆
2016/05/03
40
0
UIScrollView 和UIPageControl 实现app启动滑动图

一、使用NSUserDefaults 判断滑动图有没有出现过,加载滑动图 NSUserDefaults 简介: NSUserDefaults可以将数据永久的保存在手机中,他是一个单例,用起来很方便,所以很适合用于保存简单的数...

lady-奕奕
2014/07/23
17.4K
4
01-UI基础-04-00-UIScrollView

继承关系 1、 基本概念 1.1 什么是UIScrollView 移动设备的屏幕大小是有限的,现在直接展示用户眼前的内容也相当有限 砀山是的内容较多,超出一个屏幕时,用户可通过滚动手势来查看屏幕以为的...

口十耳
2016/01/04
22
0
UI 基础----UIScrollView 的基本属性使用以及代理的使用方法

咱们先来介绍几个 UIScrollView 的基本属性 •@property(nonatomic) CGPoint contentOffset; 这个属性用来表示UIScrollView滚动的位置 •@property(nonatomic) CGSize contentSize; 这个属性...

周绪刚
2016/01/03
64
0

没有更多内容

加载失败,请刷新页面

加载更多

OSChina 周六乱弹 —— 早上儿子问我他是怎么来的

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @凉小生 :#今日歌曲推荐# 少点戾气,愿你和这个世界温柔以待。中岛美嘉的单曲《僕が死のうと思ったのは (曾经我也想过一了百了)》 《僕が死の...

小小编辑
32分钟前
29
0
Excption与Error包结构,OOM 你遇到过哪些情况,SOF 你遇到过哪些情况

Throwable 是 Java 中所有错误与异常的超类,Throwable 包含两个子类,Error 与 Exception 。用于指示发生了异常情况。 Java 抛出的 Throwable 可以分成三种类型。 被检查异常(checked Exc...

Garphy
今天
9
0
计算机实现原理专题--二进制减法器(二)

在计算机实现原理专题--二进制减法器(一)中说明了基本原理,现准备说明如何来实现。 首先第一步255-b运算相当于对b进行按位取反,因此可将8个非门组成如下图的形式: 由于每次做减法时,我...

FAT_mt
昨天
6
0
好程序员大数据学习路线分享函数+map映射+元祖

好程序员大数据学习路线分享函数+map映射+元祖,大数据各个平台上的语言实现 hadoop 由java实现,2003年至今,三大块:数据处理,数据存储,数据计算 存储: hbase --> 数据成表 处理: hive --> 数...

好程序员官方
昨天
7
0
tabel 中含有复选框的列 数据理解

1、el-ui中实现某一列为复选框 实现多选非常简单: 手动添加一个el-table-column,设type属性为selction即可; 2、@selection-change事件:选项发生勾选状态变化时触发该事件 <el-table @sel...

everthing
昨天
6
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部