01-UIScrollView

---恢复内容开始---

ScrollView

一、基本使用

1. 作用

UIScrollView可以用于显示多于一个屏幕的内容，超出屏幕范围的内容可以通过滑动进行查看 ,同时通过捏合手势缩放视图中的内容

2. 常见属性

CGSize contentSize ：设置UIScrollView的滚动范围
CGPoint contentOffset ：UIScrollView当前滚动的位置
UIEdgeInsets contentInset ：这个属性可以在四周增加滚动范围

3. 其他属性

BOOL bounces 是否有弹簧效果

BOOL scrollEnabled 是否能滚动

BOOL showsHorizontalScrollIndicator 是否显示水平方向的滚动条

BOOL showsVerticalScrollIndicator 是否显示垂直方向的滚动条

UIScrollViewIndicatorStyle indicatorStyle 设定滚动条的样式

BOOL dragging 是否正在被拖拽

BOOL tracking 当touch后还没有拖动的时候值是YES，否则NO

BOOL decelerating 是否正在减速

BOOL zooming 是否正在缩放

二、手势缩放

设置UIScrollView的id<UISCrollViewDelegate> delegate代理对象
设置minimumZoomScale ：缩小的最小比例
设置maximumZoomScale ：放大的最大比例
让代理对象实现下面的方法，返回需要缩放的视图控件

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

跟缩放相关的常用方法还有

正在缩放的时候调用

-(void)scrollViewDidZoom:(UIScrollView *)scrollView

缩放完毕的时候调用

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

三、分页效果

设置pagingEnabled=YES即可，UIScrollView会被分割成多个独立页面，用户的滚动体验则变成了页面翻转
一般会配合UIPageControl增强分页效果，UIPageControl常用属性：

　　　　NSInteger numberOfPages : 总页数

　　　　NSInteger currentPage : 当前的页码

　　　　BOOL hidesForSinglePage : 当只有一页的时候，是否要隐藏视图

监听UIPageControl的页面改变：

// 添加监听器
[pageControl addTarget:self action:@selector(pageChange:)  forControlEvents:UIControlEventValueChanged];

// 监听方法
- (void)pageChange:(UIPageControl *)pageControl
{ 

}

四、图片全屏浏览例子

　　实现如下所示通过触摸界面左右滑动显示对应的ImageView

　　实现代码如下：

#import "UIImage+WHBLAP.h"

@implementation UIImage (WHBLAP)
+ (UIImage *)fullScreenImage:(NSString *)imgName
{
    if (isIPhone5)
    {
        //    1.获取图片的扩展名
        NSString *ext = [imgName pathExtension];
        //    2.除去图片的扩展名
        imgName = [imgName stringByDeletingPathExtension];
        //    3.拼接iPhone5图片表示
        imgName = [imgName stringByAppendingString:@"-568h@2x"];
        //    4.拼接原有图片的扩展名
        imgName = [imgName stringByAppendingString:ext];
    }
    return  [self imageNamed:imgName];
}
@end

UIImage+WHBLAP.m

//
//  NewFeatureViewController.m
//  新浪微博控
//
//  Created by whblap on 14-6-02.
//  Copyright (c) 2014年 whblap. All rights reserved.
//

#import "NewFeatureViewController.h"
#import "UIImage+WHBLAP.h"
#import "MainViewController.h"

#define  kCount 4
@interface NewFeatureViewController ()<UIScrollViewDelegate>
{
    UIPageControl *_page;
    UIScrollView *_scroll;
}
@end

@implementation NewFeatureViewController

- (id)initWithNibName:(NSString *)nibNameOrNil bundle:(NSBundle *)nibBundleOrNil
{
    self = [super initWithNibName:nibNameOrNil bundle:nibBundleOrNil];
    if (self) {
        // Custom initialization
    }
    return self;
}

- (void)viewDidLoad
{
    [super viewDidLoad];
//    self.view.backgroundColor = [UIColor whiteColor];
    
    // 1.添加UIScrollView
    [self addUIScrollView];
    
    // 2.添加图片
    [self addScrollImages];
    
    // 3.添加UIPageControl
    [self addPageControll];
    
}

#pragma mark -  自定义加载视图
- (void)loadView
{
    UIImageView *imageView = [[UIImageView alloc] init];
    imageView.image = [UIImage fullScreenImage:@"new_feature_background.png"];
    imageView.frame = [UIScreen mainScreen].applicationFrame;
    // imageView视图本身不带触摸交互等 使用UserInteractionEnable来进行设置 设置为 用户交互为可交互的
    imageView.userInteractionEnabled = YES;  // 用户交互 接收事件
    self.view = imageView;
}

#pragma mark - UI界面初始化
#pragma mark 添加滚动视图
- (void)addUIScrollView
{
    UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds]; // 初始化界面位置大小
    CGSize size = scrollView.frame.size;   // scrollView的宽高
    scrollView.contentSize = CGSizeMake((size.width * kCount), 0);  // 内容尺寸
    scrollView.showsHorizontalScrollIndicator = NO;  // 隐藏水平滚动条
    scrollView.pagingEnabled = YES;    // 设置分页
    scrollView.delegate = self;   // 添加代理
    _scroll = scrollView;
    [self.view addSubview:_scroll];
}

#pragma mark - 添加滚动显示的图片
- (void)addScrollImages
{
    CGSize size = _scroll.frame.size; // 滚动视图的宽高
    for (int i = 0; i<kCount; i++) {
//        1.添加滚动的图片
        // 1》.初始化 UIImageView宽高
        UIImageView *imageView = [[UIImageView alloc] init];
        imageView.frame = CGRectMake(i * size.width, 0, size.width, size.height);
        
        // 2》.添加通过图片名创建图片 加载到imageView
        NSString *imageName = [NSString stringWithFormat:@"new_feature_%d.png",i + 1];
        UIImage *image = [UIImage fullScreenImage:imageName];
        imageView.image = image;
        
        // 3》.向ScrollView添加imageView
        [_scroll addSubview:imageView];
        
        
//         2.最后一页 添加两个按钮
        if (i == kCount-1) {
            
            
// ************分享按钮
            // 普通状态显示的图片（selected=NO）
            UIImage *shareNormal = [UIImage imageNamed:@"new_feature_share_false.png"];
//            1>.创建一个自定义按钮
            UIButton *shareBtn =[UIButton buttonWithType:UIButtonTypeCustom];
            
//            2>.根据中心位置 和控件自身的宽高初始化UIButton位置
            shareBtn.center = CGPointMake(size.width * 0.5, size.height*0.8 - 50);
            shareBtn.bounds = CGRectMake(0, 0,shareNormal.size.width , shareNormal.size.height);
            
//            3>.设置UIButton的背景图片
            [shareBtn setBackgroundImage:shareNormal forState:UIControlStateNormal];  // 普通状态显示的图片（selected=NO）
            [shareBtn setBackgroundImage:[UIImage imageNamed:@"new_feature_share_true.png"] forState:UIControlStateSelected];  // 选中状态显示的图片（selected=YES）

//            4>.给UIButton添加监听事件
            [shareBtn addTarget:self action:@selector(shareClick:) forControlEvents:
             UIControlEventTouchUpInside];
            
            // 按钮变为UIControlStateDisable状态
            //             share.enabled = NO;
            // 默认为选择状态
            shareBtn.selected = YES;
            
            // 按钮在高亮的时候不需要变灰色
            shareBtn.adjustsImageWhenHighlighted = NO;
            

//            5>.将UIButton添加到视图中
            [imageView addSubview:shareBtn];
        
            
// ************开始按钮
            UIImage *startNormal = [UIImage imageNamed:@"new_feature_finish_button.png"];
            UIImage *startHightlighted = [UIImage imageNamed:@"new_feature_finish_button_highlighted.png"];
            
//            1>.创建一个自定义按钮
            UIButton *startBtn = [UIButton buttonWithType:UIButtonTypeCustom];
            
//            2>.根据中心位置 和控件自身的宽高初始化UIButton位置
            startBtn.center = CGPointMake(size.width * 0.5, size.height*0.8);
            startBtn.bounds = CGRectMake(0, 0,startNormal.size.width , startNormal.size.height);
            
//            3>.设置UIButton的背景图片
            [startBtn setBackgroundImage:startNormal forState:UIControlStateNormal];
            [startBtn setBackgroundImage:startHightlighted forState:UIControlStateHighlighted];
            
//            4>.给UIButton添加监听事件
            [startBtn addTarget:self action:@selector(startClick) forControlEvents:
             UIControlEventTouchUpInside];
            
//            5>.将UIButton添加到imageView视图中
            [imageView addSubview:startBtn];
            
        }
        imageView.userInteractionEnabled = YES;
    }
}

#pragma mark - 添加分页指示器
- (void)addPageControll
{
//    1.得到视图的宽高
    CGSize size = self.view.frame.size;
    
//    2.根据中心位置 和控件自身的宽高初始化UIPageControl的位置
    UIPageControl *page = [[UIPageControl alloc]init];
    page.center =  CGPointMake(size.width * 0.5, size.height * 0.95);
    page.bounds = CGRectMake(0, 0, 150, 0);
    
//    3.设置page页数
    page.numberOfPages = kCount;
    
//    4.设置当前page指示器的色彩颜色
    page.currentPageIndicatorTintColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"new_feature_pagecontrol_checked_point.png"]];
    
//    5.设置默认指示器色彩颜色
    page.pageIndicatorTintColor = [UIColor colorWithPatternImage:[UIImage imageNamed:@"new_feature_pagecontrol_point.png"]];
    
//    6.为PageControll添加监听方法
    [page addTarget:self action:@selector(updatePageChanged:) forControlEvents:UIControlEventValueChanged];
    
//    7.将PageControll添加到视图
    _page = page;
    [self.view addSubview:_page];
    
}

#pragma mark - 滚动代理方法
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    // 当前页面值 = 滚动          ps: contentOffset 是scrollview当前显示区域顶点相对于frame顶点的偏移量
    _page.currentPage = scrollView.contentOffset.x / scrollView.frame.size.width;
    
    NSLog(@"%d", _page.currentPage);
}

#pragma mark - 分页控件的监听方法
- (void)updatePageChanged:(UIPageControl *)pageControl

{
    NSLog(@"%d",pageControl.currentPage);
    CGFloat  contOffsetX = pageControl.currentPage * _scroll.bounds.size.width;
    [_scroll setContentOffset:CGPointMake(contOffsetX,0)  animated:YES];
}

#pragma mark - 监听按钮点击
#pragma mark 开始
- (void)startClick
{
//    显示状态栏
    [UIApplication sharedApplication].statusBarHidden = NO;
//    显示到主界面     ps：控制器的View会延迟加载 需要显示或用到的时候会加载
    self.view.window.rootViewController = [[MainViewController alloc] init];
}
#pragma mark 分享
- (void)shareClick:(UIButton *)btn
{
    btn.selected = !btn.selected;
}
@end

MainViewController.m

posted on 2014-06-23 23:41 ゴルツの惠斌纳閣下阅读(657) 评论(0) 编辑收藏举报

会员力量，点亮园子希望

刷新页面返回顶部

ゴルツの惠斌纳閣下

01-UIScrollView

ScrollView

一、基本使用

1. 作用

2. 常见属性

3. 其他属性

二、手势缩放

跟缩放相关的常用方法还有

三、分页效果

四、图片全屏浏览例子

导航

公告

ゴルツの惠斌纳閣下

01-UIScrollView

ScrollView

一、 基本使用

1. 作用

2. 常见属性

3. 其他属性

二、 手势缩放

跟缩放相关的常用方法还有

三、 分页效果

四、 图片全屏浏览例子

导航

公告

一、基本使用

二、手势缩放

三、分页效果

四、图片全屏浏览例子