您的位置:首页 > 产品设计 > UI/UE

UIScrollView+UIPageControl

2015-08-14 09:07 465 查看
#import "MainViewController.h"
#define WIDTH self.view.frame.size.width
#define HEIGHT self.view.frame.size.height
@interface MainViewController ()<UIScrollViewDelegate>

@end

@implementation MainViewController

- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];

// UIScrollView拓展了UIView滚动方面的功能,它是所有滚动视图的基类
// UITableView,UITextView都继承于该类
// 使用场景:单张大图(屏幕显示不下);内容太多(图文混排);滚动头条(图片);相册等
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, WIDTH, HEIGHT)];
scrollView.backgroundColor = [UIColor brownColor];
[self.view addSubview:scrollView];
[scrollView release];
// scrollView本身还默认拥有两个视图:横纵滚动条
// 它主要专长于两个方面
// 一.contentSize重要属性,它可以让scrollView滚动起来(当contentSize大于frame.size时)
// 内容大小;滚动范围
scrollView.contentSize = CGSizeMake(WIDTH * 12, HEIGHT);
// 按页进行滚动(是否整屏翻动)
//    scrollView.pagingEnabled = YES;
// 偏移量:视图左上角距离坐标原点的偏移量
scrollView.contentOffset = CGPointMake(WIDTH, 0);
// 二.自带缩放功能,可以指定缩放倍数
// 要实现缩放,还需要实现Delegate,指定缩放的视图是谁
// 设置代理人
scrollView.delegate = self;
scrollView.tag = 1000;
// 下边这几行一加上,轮播图就不能手动滑动了
//    scrollView.minimumZoomScale = 0.5;  // 缩小的最小比例
//    scrollView.maximumZoomScale = 1.5;  // 放大的最大比例
//    scrollView.zoomScale = 0.5;         // 设置变化比例
//    scrollView.bouncesZoom = YES;       // 控制缩放的时候是否会反弹
// scrollView.zooming = YES;        // 判断是否正在进行缩放反弹
// returns YES if user in zoom gesture,,不是这么用的

// 控制是否允许滚动 默认YES
scrollView.scrollEnabled = YES;

// 关掉边界回弹效果 默认是YES
scrollView.bounces = NO;
// 控制水平和垂直方向遇到边框是否反弹
scrollView.alwaysBounceHorizontal = NO;
scrollView.alwaysBounceVertical = NO;
// 水平和垂直的滚动条会作为两个子视图添加到scrollView的子视图里,如果把滚动条效果关闭,这两个视图就不会添加到scrollView的子视图里
//        NSLog(@"%@", scrollView.subviews);
// 关闭滚动条
scrollView.showsHorizontalScrollIndicator = NO; // 水平的
scrollView.showsVerticalScrollIndicator = NO;   // 垂直的
// 滑动到顶部(点状态条的时候)
scrollView.scrollsToTop = YES;

NSString *picNameStart = [NSString stringWithFormat:@"cymbal_09.jpg"];
UIImageView *imageViewStart = [[UIImageView alloc] initWithImage:[UIImage imageNamed:picNameStart]];
imageViewStart.frame = CGRectMake(0, 0, WIDTH, HEIGHT);
[scrollView addSubview:imageViewStart];
[imageViewStart release];

for (NSInteger i = 0; i < 10; i++) {
NSString *picName = [NSString stringWithFormat:@"cymbal_0%ld.jpg", i];
// 通过图片名来创建UIImageView
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:picName]];

imageView.frame = CGRectMake(WIDTH * (i + 1), 0, WIDTH, HEIGHT);
//
[scrollView addSubview:imageView];
[imageView release];
}

NSString *picNameLast = [NSString stringWithFormat:@"cymbal_00.jpg"];
UIImageView *imageViewLast = [[UIImageView alloc] initWithImage:[UIImage imageNamed:picNameLast]];
imageViewLast.frame = CGRectMake(11 * WIDTH, 0, WIDTH, HEIGHT);
[scrollView addSubview:imageViewLast];
[imageViewLast release];

// 创建一个计时器
//    [NSTimer scheduledTimerWithTimeInterval:0.5 target:self selector:@selector(changeImage) userInfo:nil repeats:YES];
// Do any additional setup after loading the view.
}

- (void)changeImage
{
// 通过tag值找scrollView
UIScrollView *scrollView = (UIScrollView *)[self.view viewWithTag:1000];
scrollView.contentOffset = CGPointMake(scrollView.contentOffset.x + WIDTH, 0);
// 带动画效果的,在这里反而效果差.
//    [scrollView setContentOffset:CGPointMake(scrollView.contentOffset.x + WIDTH, 0) animated:YES];
if (scrollView.contentOffset.x == 11 * WIDTH) {
scrollView.contentOffset = CGPointMake(WIDTH, 0);
}
}

#pragma mark UIScrollView滚动的一些代理方法
// 只要滚动就会触发协议方法
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
NSLog(@"开始滚动");
}

- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
NSLog(@"开始拖拽时触发");
}

- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
NSLog(@"结束拖拽时触发");
}

- (void)scrollViewWillBeginDecelerating:(UIScrollView *)scrollView
{
NSLog(@"开始减速时触发");
}

// 当滚动减速停止的时候会触发的协议方法
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
if (scrollView.contentOffset.x == 11 * WIDTH) {
scrollView.contentOffset = CGPointMake(WIDTH, 0);
} else if (scrollView.contentOffset.x == 0) {
scrollView.contentOffset = CGPointMake(WIDTH * 10, 0);
}
NSLog(@"滚动停止");
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

- (void)scrollViewWillBeginZooming:(UIScrollView *)scrollView withView:(UIView *)view
{
NSLog(@"开始缩放的时候调用");
}

- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{
NSLog(@"正在缩放的时候调用");
}

- (void)scrollViewDidEndZooming:(UIScrollView *)scrollView withView:(UIView *)view atScale:(CGFloat)scale
{
NSLog(@"完成放大缩小触发");
}

// 2.代码说明
// 实现缩放功能的4个步骤
// (1)为scrollview设置代理(self)
// (2)让控制器遵守scrollview的代理协议
// (3)调用代理方法,返回需要实现缩放功能的子控件
// (4)设置缩放的范围(最大和最小比例)
// 3.思路:
// a.需要告诉scrollview要缩放的时哪一个子控件,这里为scrollview内部的imageview控件
// b.谁来告诉scrollview缩放哪一个控件?代理
// 指定某个UISrollView的子视图可以被放大缩小
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
// 如何选定UISV的一个子视图
// 对轮播图进行缩放后恢复竟然还能进行滚动...
return scrollView.subviews[0];
}


UIPageControl

它一般不单独使用,需要和UIScrollView配合使用

#import "MainViewController.h"
#define WIDTH self.view.frame.size.width
#define HEIGHT self.view.frame.size.height
@interface MainViewController ()<UIScrollViewDelegate, UIPageViewControllerDelegate>

@property(nonatomic, retain)UIScrollView *scrollView;

@end

@implementation MainViewController

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

- (void)viewDidLoad {
[super viewDidLoad];
//     Do any additional setup after loading the view.
self.scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height)];
self.scrollView.contentSize = CGSizeMake(19 * WIDTH, HEIGHT);
self.scrollView.pagingEnabled = YES;
[self.view addSubview:self.scrollView];
[self.scrollView release];
self.scrollView.delegate = self;

// scrollView的缩放
// 最大缩放比例
self.scrollView.maximumZoomScale = 1.4;
// 最小缩放比例
self.scrollView.minimumZoomScale = 0.5;
// 这里的scrollView设置缩放比例还能手动滚动,为什么之前的程序不能?
// 原始的缩放比例
self.scrollView.zoomScale = 1;

for (NSInteger i = 1; i < 20; i++) {
UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:[NSString stringWithFormat:@"image%ld.jpg", i]]];
imageView.frame = CGRectMake(WIDTH * (i - 1), 0, WIDTH, HEIGHT);
[self.scrollView addSubview:imageView];
[imageView release];
}

UIPageControl *pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(0, 300, 375, 20)];
pageControl.backgroundColor = [UIColor lightGrayColor];
pageControl.alpha = 0.4;
[self.view addSubview:pageControl];
[pageControl release];
pageControl.numberOfPages = 19;
// 点的背景颜色
pageControl.pageIndicatorTintColor = [UIColor whiteColor];
// 被选中的原点颜色
pageControl.currentPageIndicatorTintColor = [UIColor blackColor];
pageControl.tag = 1000;

// 它可以向button一样添加事件,只不过事件触发使用的是valuechanged
[pageControl addTarget:self action:@selector(pageAction:) forControlEvents:UIControlEventValueChanged];
}

// 专门用来缩放的协议方法
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
// scrollView的子视图, 只对第一张进行缩放
return [scrollView.subviews firstObject];
}

- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
// 滑动图片,让圆点跟着一起动
UIPageControl *page = (UIPageControl *)[self.view viewWithTag:1000];
page.currentPage = self.scrollView.contentOffset.x / WIDTH;
}

- (void)pageAction:(UIPageControl *)pageControl
{
// 点的个数从第0张开始计算
NSLog(@"%ld", pageControl.currentPage + 1);
// 触发事件,进行图片的切换
//    self.scrollView.contentOffset = CGPointMake(pageControl.currentPage * WIDTH, 0);
[self.scrollView setContentOffset:CGPointMake(pageControl.currentPage * WIDTH, 0) animated:YES];
}

- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}

@end
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: