UI06滚动视图

来源:互联网 发布:白云网络怎么样 编辑:程序博客网 时间:2024/06/06 05:09

AppDelegate.m

 /**< 设置背景颜色 */    self.window.backgroundColor = [UIColor whiteColor];        /**< 创建控制器 */    HomeViewController *homeVC = [[HomeViewController alloc]init];    MusicViewController *musicVC = [[MusicViewController alloc]init];    PhotoViewController *photoVC = [[PhotoViewController alloc]init];    SettingViewController *settingVC = [[SettingViewController alloc]init];        /**< 设置title */    homeVC.title = @"主页";    musicVC.title = @"音乐";    photoVC.title = @"相册";    settingVC.title = @"设置";        /**< 把控制器封装进导航控制器中 */    UINavigationController *navHome = [[UINavigationController alloc]initWithRootViewController:homeVC];    UINavigationController *navMusic = [[UINavigationController alloc]initWithRootViewController:musicVC];    UINavigationController *navPhoto = [[UINavigationController alloc]initWithRootViewController:photoVC];    UINavigationController *navSetting = [[UINavigationController alloc]initWithRootViewController:settingVC];        /**< 把导航控制器加入UITabBarController中 */    UITabBarController *tabVC = [[UITabBarController alloc]init];    tabVC.viewControllers = @[navHome, navMusic, navPhoto, navSetting];        /**< 设置tabVC为根视图控制器 */    self.window.rootViewController = tabVC;        /**< 标签栏 */    //是否透明    tabVC.tabBar.translucent = NO;    //改变选中状态颜色    tabVC.tabBar.tintColor = [UIColor blackColor];        /**< 标签栏的内容 */    UITabBarItem *homeItem = [[UITabBarItem alloc]initWithTitle:@"主页" image:[UIImage imageNamed:@"tab1@2x"] tag:100];    homeVC.tabBarItem = homeItem;    homeVC.tabBarItem.badgeValue = @"99+";    UITabBarItem *musicItem = [[UITabBarItem alloc]initWithTitle:@"音乐" image:[UIImage imageNamed:@"tab2@2x"] tag:101];    musicVC.tabBarItem = musicItem;    musicVC.tabBarItem.badgeValue = @"18";    UITabBarItem *photoItem = [[UITabBarItem alloc]initWithTitle:@"相册" image:[UIImage imageNamed:@"tab3@2x"] tag:102];    photoVC.tabBarItem = photoItem;    UITabBarItem *settingItem = [[UITabBarItem alloc]initWithTitle:@"设置" image:[UIImage imageNamed:@"tab4@2x"] tag:103];    settingVC.tabBarItem = settingItem;

ViewController.m

#import "ViewController.h"#import "HomeViewController.h"@interface ViewController ()<UIScrollViewDelegate>{        NSInteger _currentIndex;}//滚动视图@property (nonatomic, strong) UIScrollView *scorllView;//图片名数组@property (nonatomic, strong) NSMutableArray *titlesArray;//图片数组@property (nonatomic, strong)  NSMutableArray *imageArray;//分页控制器@property (nonatomic, strong) UIPageControl *pageControl;//按钮@property (nonatomic, strong) UIButton *button;//加载数据- (void)initData;//加载界面- (void)initUserInterface;@end@implementation ViewController/**< 重写scorllView的getter方法 */- (UIScrollView *)scorllView{    //判断滑动视图是否已创建    if (!_scorllView) {        //初始化滑动视图        _scorllView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.view.bounds), CGRectGetHeight(self.view.bounds))];        //设置背景颜色        _scorllView.backgroundColor = [UIColor whiteColor];        //关闭垂直滑动条        _scorllView.showsVerticalScrollIndicator = NO;        //关闭水平滑动条        _scorllView.showsHorizontalScrollIndicator = NO;    }    return _scorllView;}/**< 重写titleArray的getter方法 */- (NSMutableArray *)titlesArray{    //判断图片名数组是否创建    if (!_titlesArray) {        //创建数组        _titlesArray = [NSMutableArray array];    }    return _titlesArray;}/**< 重写pageControl的getter方法 */- (UIPageControl *)pageControl{    //判断分页控制器是否创建    if (!_pageControl) {        //初始化分页控制器        _pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(0, [UIScreen mainScreen].bounds.size.height - 50, CGRectGetWidth(self.view.bounds), 30)];        //设置背景颜色        _pageControl.backgroundColor = [UIColor clearColor];        //页数        _pageControl.numberOfPages = 4;        //当前页(若不设置,默认为第一页)         _pageControl.currentPage = 0;                /**< 设置颜色 */        //未选中状态颜色        _pageControl.pageIndicatorTintColor = [UIColor grayColor];        //选中状态颜色        _pageControl.currentPageIndicatorTintColor = [UIColor whiteColor];            }    return _pageControl;}- (void)viewDidLoad {    [super viewDidLoad];    //初始化数据    [self initData];     //加载视图    [self initUserInterface];}/**< init方法 */- (void)initData{    //将图片名字循环加入数组中    for (int i = 0; i < 4; i ++) {        NSString *imageName = [NSString stringWithFormat:@"相册%d.jpg", i + 1];        //添加到数组        [self.titlesArray addObject:imageName];    }}/**< 加载视图 */- (void)initUserInterface{        /**< 设置背景颜色 */    self.view.backgroundColor = [UIColor whiteColor];        /**< 设置导航栏的透明度 */    self.navigationController.navigationBar.translucent = NO;        /**< 添加滚动视图 */    [self.view addSubview:self.scorllView];        /**< 加载图片 */    for (int i = 0; i < 4; i ++) {        //初始化图片视图控制器        UIImageView *imageView = [[UIImageView alloc]init];        //设置图片视图控制器的位置和大小        imageView.frame = CGRectMake(CGRectGetWidth(self.scorllView.frame) * i, 0, CGRectGetWidth(self.scorllView.frame), CGRectGetHeight(self.scorllView.frame));        //从图片名数组中获取图片名        imageView.image = [UIImage imageNamed:self.titlesArray[i]];                /**< 当它为最后一页时,创建一个按钮 */        if (i == 3) {            [self createIntoButton:imageView];        }                /**< 添加图片视图到滚动视图中 */        [self.scorllView addSubview:imageView];    }    /**< 设置内容大小 */    [self.scorllView setContentSize:CGSizeMake(CGRectGetWidth(self.scorllView.frame) * 4, CGRectGetHeight(self.scorllView.frame))];        /**< 设置分页效果 */    self.scorllView.pagingEnabled = YES;    /**< 添加分页控件 */    [self.view addSubview:self.pageControl];        /**< 设置代理 */    self.scorllView.delegate = self;}/**< UIScrollViewDelegate 方法 */- (void)scrollViewDidScroll:(UIScrollView *)scrollView{        //1.获取当前的偏移量        CGFloat offsetX = scrollView.contentOffset.x;        //2.转换为页数(获取当前第几页图片)        NSInteger pageNum = offsetX / self.scorllView.frame.size.width;        //3.设置分页的当前页数        self.pageControl.currentPage = pageNum;        _currentIndex = pageNum;}- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView{    //当当前页数为4时显示button,并调用动画    if(_pageControl.currentPage == 3){        _button.hidden = NO;        [self ButtonAnimationOne];    }else{        //当前页数不为4时隐藏button        _button.hidden = YES;    }}/**< 创建最后一页的“立即体验”按钮 */-(void)createIntoButton:(UIImageView*)pageImageView{        /**< 开启父视图交互 */    [pageImageView setUserInteractionEnabled:YES];        //初始化    UIButton *intoButton = [[UIButton alloc] init];        /**< 设置背景图片 */    //获取图片名字    UIImage *backImage = [UIImage imageNamed:@"new_feature_finish_button.png"];    UIImage *backImageHL = [UIImage imageNamed:@"new_feature_finish_button_highlighted.png"];    //设置图片    [intoButton setBackgroundImage:backImage forState:UIControlStateNormal];    [intoButton setBackgroundImage:backImageHL forState:UIControlStateHighlighted];        /**< 设置中心点和大小,大小根据背景 */    //中心点的X值    CGFloat centerX = pageImageView.bounds.size.width/2;    //中心点的Y值    CGFloat centerY = pageImageView.bounds.size.height * 0.9;    //按钮的宽度    CGFloat width = backImage.size.width;    //按钮的高度    CGFloat height = backImage.size.height;        /**< 设置按钮的位置 */    [intoButton setBounds:CGRectMake(0, 0, width, height)];    [intoButton setCenter:CGPointMake(centerX, centerY)];      /**< 消息响应 */    [intoButton addTarget:self action:@selector(intoButtonClick) forControlEvents:UIControlEventTouchUpInside];        self.button = intoButton;        /**< 添加到pageImageView */    [pageImageView addSubview:intoButton];    }/**< "立即体验"按钮消息响应 */-(void)intoButtonClick{    //按下按钮后消失    [self.presentingViewController dismissViewControllerAnimated:YES completion:nil];}- (void)ButtonAnimationOne{    //开始动画函数    [UIView beginAnimations:nil context:nil];    //设置动画持续时间    [UIView setAnimationDuration:1.5];    //设置动画效果函数    self.button.frame = CGRectMake(CGRectGetWidth(self.view.bounds) * 0.3, CGRectGetHeight(self.view.bounds) * 0.7, CGRectGetWidth(self.view.bounds) * 0.4, CGRectGetWidth(self.view.bounds) * 0.15);    //设置代理    [UIView setAnimationDelegate:self];    //提交动画    [UIView commitAnimations];    //添加动作    [self performSelector:@selector(ButtonAnimationTwo) withObject:nil afterDelay:1.5];}- (void)ButtonAnimationTwo{    //开始动画函数    [UIView beginAnimations:nil context:nil];    //设置动画持续时间    [UIView setAnimationDuration:1];    //设置动画效果函数    self.button.frame = CGRectMake(CGRectGetWidth(self.view.bounds) * 0.35, CGRectGetHeight(self.view.bounds) * 0.85, CGRectGetWidth(self.view.bounds) * 0.3, CGRectGetWidth(self.view.bounds) * 0.1);    //设置代理    [UIView setAnimationDelegate:self];    //提交动画    [UIView commitAnimations];}@end

HomeViewController.m

#import "HomeViewController.h"#import "ViewController.h"@interface HomeViewController ()@end@implementation HomeViewController- (void)viewDidLoad {    [super viewDidLoad];    //设置背景颜色    self.view.backgroundColor = [UIColor cyanColor];}/**< 程序运行时,显示登录界面 */- (void)viewDidAppear:(BOOL)animated{    [super viewDidAppear:animated];    //如果未进行引导     if (!_Flag) {    ViewController *VC = [[ViewController alloc] init];    //显示引导页    [self presentViewController:VC animated:YES completion:nil];    //标记为YES        _Flag = YES;     }    }@end

PhotoViewController.m

#import "PhotoViewController.h"@interface PhotoViewController ()<UIScrollViewDelegate>{    //记录分页控制器的页数    NSInteger _currentIndex;}//滚动视图@property (nonatomic, strong) UIScrollView (*scorllView);//图片名数组@property (nonatomic, strong) NSMutableArray *titlesArray;//图片数组@property (nonatomic, strong)  NSMutableArray *imageArray;//分页控制器@property (nonatomic, strong) UIPageControl *pageControl;// 定时器(自动滚动)@property (nonatomic, strong) NSTimer *timer;//加载数据- (void)initData;//加载视图- (void)initUserInterface;@end@implementation PhotoViewController/**< 重写scorllView的getter方法 */- (UIScrollView *)scorllView{    //判断滑动视图是否已创建    if (!_scorllView) {        //初始化滑动视图        _scorllView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.view.bounds), 300)];        //设置背景颜色        _scorllView.backgroundColor = [UIColor whiteColor];        //关闭垂直滑动条        _scorllView.showsVerticalScrollIndicator = NO;        //关闭水平滑动条        _scorllView.showsHorizontalScrollIndicator = NO;    }    return _scorllView;}/**< 重写titleArray的getter方法 */- (NSMutableArray *)titlesArray{    //判断图片名数组是否创建    if (!_titlesArray) {        //创建数组        _titlesArray = [NSMutableArray array];    }    return _titlesArray;}/**< 重写pageControl的getter方法 */- (UIPageControl *)pageControl{    //判断分页控制器是否创建    if (!_pageControl) {        //初始化分页控制器        _pageControl = [[UIPageControl alloc]initWithFrame:CGRectMake(0, 250, CGRectGetWidth(self.view.bounds), 30)];        //设置背景颜色        _pageControl.backgroundColor = [UIColor clearColor];        //页数        _pageControl.numberOfPages = 5;        //当前页(若不设置,默认为第一页)        _pageControl.currentPage = 1;                /**< 设置颜色 */        //未选中状态颜色        _pageControl.pageIndicatorTintColor = [UIColor grayColor];        //选中状态颜色        _pageControl.currentPageIndicatorTintColor = [UIColor whiteColor];            }    return _pageControl;}- (void)viewDidLoad {    [super viewDidLoad];    //初始化数据    [self initData];    //加载视图    [self initUserInterface];}/**< init方法 */- (void)initData{    //将图片名字循环加入数组中    for (int i = 0; i < 5; i ++) {        NSString *imageName = [NSString stringWithFormat:@"相册1%d", i + 1];        //添加到数组        [self.titlesArray addObject:imageName];    }}/**< 加载视图 */- (void)initUserInterface{    /**< 设置背景颜色 */    self.view.backgroundColor = [UIColor whiteColor];        /**< 设置导航栏的透明度 */    self.navigationController.navigationBar.translucent = NO;        /**< 添加到视图 */    [self.view addSubview:self.scorllView];        /**< 滚动视图配置 */    //设置内容大小    self.scorllView.contentSize = CGSizeMake(CGRectGetWidth(self.view.bounds) * 3, CGRectGetHeight(self.scorllView.frame));    //设置偏移量    self.scorllView.contentOffset = CGPointMake(CGRectGetWidth(self.view.bounds), 0);    //设置分页效果    self.scorllView.pagingEnabled = YES;    //设置代理    self.scorllView.delegate = self;        /**< 创建3张空白的图片 */    //初始化图片数组    _imageArray = [NSMutableArray array];    //循环把图片加入到数组中    for (int i = 0; i < 3; i ++) {        //初始化设置图片的位置大小        UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(CGRectGetWidth(self.view.bounds) * i, 0, CGRectGetWidth(self.view.bounds),  CGRectGetHeight(self.scorllView.bounds))];        //把图片添加到数组        [_imageArray addObject:imageView];        //把图片添加到视图        [self.scorllView addSubview:imageView];    }    /**< 加载图片 */    [self loadImage];        /**< 添加分页控件 */    [self.view addSubview:self.pageControl];        /**< 设置定时器 */    _timer = [NSTimer scheduledTimerWithTimeInterval:2 target:self selector:@selector(changeImage) userInfo:nil repeats:YES];        /**< 暂停 */    _timer.fireDate = [NSDate distantFuture];    }/**< 让他往后面滚动一页,触发滚动视图的代理 */- (void)changeImage{        //自动播放下一页    [self.scorllView setContentOffset:CGPointMake(self.scorllView.frame.size.width + self.scorllView.contentOffset.x, 0) animated:YES];}/**< 加载图片的方法 */- (void)loadImage{    int i = 0;    //循环获取图片名数组中的图片名    for (UIImageView *imageView in _imageArray) {        [imageView setImage:[UIImage imageNamed:_titlesArray[i]]];        i ++;    }    }/**< UIScrollViewDelegate 方法 */- (void)scrollViewDidScroll:(UIScrollView *)scrollView{    /**<判断如果已经超过第二张,就将第一张的图片名放到最后 */    if (scrollView.contentOffset.x >= 2 * CGRectGetWidth(self.scorllView.bounds)) {        //右滑动        id firstName = [_titlesArray[0] mutableCopy];        //移除第一张图片        [_titlesArray removeObject:firstName];        //添加到最后        [_titlesArray addObject:firstName];        //当页面为最后一页时,令页数为0,否则直接加1        _pageControl.currentPage = _pageControl.currentPage == 4 ? 0 : _pageControl.currentPage + 1;            /**< 如果是第一张之后往左滑动,就将最后一张图片名放到第一张 */    }else if (scrollView.contentOffset.x <= 0){        //左滑动        id lastName = [_titlesArray[4] mutableCopy];        //移除最后一张图片        [_titlesArray removeObject:lastName];        //添加到最前面        [_titlesArray addObject:lastName];        //当页面为最后一页时,令页数为0,否则直接减1        _pageControl.currentPage = _pageControl.currentPage == 0 ? 4 : _pageControl.currentPage - 1;    }else{        return;    }        /**< 刷新图片 */    [self loadImage];        /**< 让其保持第二张图片居中,他是在到第三张后返回到第二张,但是注意一定要animation关掉,否则会有那种跳转效果,这样就可以给用户一种错觉 */    [self.scorllView setContentOffset:CGPointMake(CGRectGetWidth(self.scorllView.bounds), 0)];}- (void)viewWillAppear:(BOOL)animated{    [super viewWillAppear: animated];    /**< 2s后开启定时器 */    _timer.fireDate = [NSDate dateWithTimeIntervalSinceNow:2];}- (void)viewWillDisappear:(BOOL)animated{    [super viewWillDisappear: animated];    /**< 停止定时器 */    if (_timer.isValid) {        //从运行循环中移除,让其失效        [_timer invalidate];        _timer = nil;    }}/**< 手动即将拖拽的时候 */- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView{     // 停止定时器    self.timer.fireDate = [NSDate distantFuture];}/**<  手动拖拽结束的时候 */- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate{    // 开始定时器    self.timer.fireDate = [NSDate dateWithTimeIntervalSinceNow:2];}@end




0 0
原创粉丝点击