IOS 下劃線隨視圖移動+自動輪播圖功能

//
//  ContentView.h
//  test08 下劃線隨視圖移動 簡單版本實現
//
//  Created by mouweng on 17/8/27.
//  Copyright © 2017年 mouweng. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface ContentView : UIScrollView

+(instancetype)shareWithFrame:(CGRect)frame;

@end

//
//  ContentView.m
//  test08 下劃線隨視圖移動 簡單版本實現
//
//  Created by mouweng on 17/8/27.
//  Copyright © 2017年 mouweng. All rights reserved.
//

#import "ContentView.h"
#define SCREEN_W            [[UIScreen mainScreen] bounds].size.width
#define SCREEN_H            [[UIScreen mainScreen] bounds].size.height

@implementation ContentView

/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
}
*/

- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if(self)
    {
        for(int i=0; i< 4 ;i++)
        {
            UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(SCREEN_W*i, 5, SCREEN_W, SCREEN_H-5)];
            imageView.backgroundColor = [UIColor whiteColor];
            NSString *str = [NSString stringWithFormat:@"17_%d.jpg",i+12];
            imageView.image = [UIImage imageNamed:str];
            [self addSubview:imageView];
        }
    }
    return self;
}


+(instancetype)shareWithFrame:(CGRect)frame
{
    ContentView *contentView = [[self alloc]initWithFrame:frame];
    contentView.contentSize = CGSizeMake(SCREEN_W*4, frame.size.height);
    contentView.pagingEnabled = YES;
    contentView.bounces = NO;
    return contentView;
}


@end

//
//  headView.h
//  test08 下劃線隨視圖移動 簡單版本實現
//
//  Created by mouweng on 17/8/27.
//  Copyright © 2017年 mouweng. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface headView : UIView
+(instancetype)createHeadView:(CGRect)frame;
@property (strong,nonatomic)UIView *animationView;//創建下劃線視圖
@end

//
//  headView.m
//  test08 下劃線隨視圖移動 簡單版本實現
//
//  Created by mouweng on 17/8/27.
//  Copyright © 2017年 mouweng. All rights reserved.
//

#import "headView.h"
#import "ViewController.h"

#define padding 10
#define Width       [[UIScreen mainScreen] bounds].size.width
#define Height      [[UIScreen mainScreen] bounds].size.height

@implementation headView

/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
}
*/

- (UIView *)animationView
{
    if(!_animationView)
    {
        _animationView = [[UIView alloc] initWithFrame:CGRectMake(0, 5,Width/4 , 5)];
        _animationView.backgroundColor = [UIColor redColor];
    }
    return _animationView;
}

//重寫初始化方法
- (instancetype)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if(self)
    {
        //創建動畫視圖
        [self addSubview:self.animationView];
    }
    return self;
}

//類方法
+ (instancetype)createHeadView:(CGRect)frame
{
    headView *hV = [[self alloc] initWithFrame:frame];
    return hV;
}


//

//
//  LoopScrollView.h
//  擁有下劃線隨視圖移動而移動和自動輪播的UIScrollView
//
//  Created by mouweng on 17/8/28.
//  Copyright © 2017年 mouweng. All rights reserved.
//

#import <UIKit/UIKit.h>
#import "ContentView.h"
#import "headView.h"
@interface LoopScrollView : UIView<UIScrollViewDelegate>
//兩個主視圖元素控件
@property (strong,nonatomic)ContentView *contentView;
@property (strong,nonatomic)headView *headView;
//定式器以及頁面控制器功能
@property (nonatomic, retain) NSTimer * timer;  //設置定時器
@property (nonatomic, retain) UIPageControl * pageControl;
@property (nonatomic, retain) UILabel * currentPageLabel;


- (void) startTimer;
- (void) stopTimer;

- (id)initWithFrame:(CGRect)frame;
@end

//
//  LoopScrollView.m
//  擁有下劃線隨視圖移動而移動和自動輪播的UIScrollView
//
//  Created by mouweng on 17/8/28.
//  Copyright © 2017年 mouweng. All rights reserved.
//

#import "LoopScrollView.h"
#import "ContentView.h"
#import "headView.h"
#define SCREEN_WIDTH  self.frame.size.width
#define SCREEN_HEIGHT self.frame.size.height

@implementation LoopScrollView

static NSUInteger pageCount = 4;
/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
    // Drawing code
}
*/

- (id)initWithFrame:(CGRect)frame
{
    self= [super initWithFrame:frame];
    if(self)
    {
        //創建頭視圖
        _headView = [headView createHeadView:CGRectMake(0, 0, SCREEN_WIDTH, 5)];
        [self addSubview:_headView];
        
        //創建內容視圖
        _contentView = [ContentView shareWithFrame:CGRectMake(0, 5, SCREEN_WIDTH, SCREEN_HEIGHT-5)];
        _contentView.tag = -2;
        _contentView.delegate = self;
        [self addSubview:_contentView];
        
        //初始化定時器
        _timer = [NSTimer scheduledTimerWithTimeInterval:2.0 target:self selector:@selector(loopImageTimer:) userInfo:nil repeats:YES];
        
        //初始化UIPageControl
        int pageControlHeight = 30;
        CGFloat scrollViewBottom = _contentView.frame.origin.y + _contentView.frame.size.height;
        _pageControl = [[UIPageControl alloc] initWithFrame:CGRectMake(10, scrollViewBottom-pageControlHeight, 100, pageControlHeight)];
        _pageControl.currentPage = 0;//當前頁數所在的page位置
        _pageControl.numberOfPages = pageCount;
        _pageControl.backgroundColor = [UIColor grayColor];
        [self addSubview:_pageControl];
        
        //初始化標籤 當前頁/總頁數
        _currentPageLabel = [[UILabel alloc] initWithFrame:CGRectMake(SCREEN_WIDTH - 50, _pageControl.frame.origin.y , 50, pageControlHeight)];
        _currentPageLabel.text = [NSString stringWithFormat:@"%d / %ld",1,pageCount];
        _currentPageLabel.textColor = [UIColor redColor];
        [self addSubview:_currentPageLabel];
        
    }
    
    return self;
}


- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{

        NSInteger page = scrollView.contentOffset.x/SCREEN_WIDTH;
        [UIView animateWithDuration:0.2 animations:^{
            CGRect frame = self.headView.animationView.frame;
            frame = CGRectMake(SCREEN_WIDTH/4*page, frame.origin.y, frame.size.width, frame.size.height);
            self.headView.animationView.frame = frame;
        }];
    
}

//循環定時器設置
#pragma mark - Actions
- (void) loopImageTimer:(NSTimer *)timer {
    NSUInteger totalNum = pageCount;
    if (totalNum > 1) {
        CGPoint newOffset = _contentView.contentOffset;
        newOffset.x = newOffset.x + CGRectGetWidth(_contentView.frame);
        if (newOffset.x > (CGRectGetWidth(_contentView.frame) * (totalNum-1))) {
            newOffset.x = 0 ;
        }
        int index = newOffset.x / CGRectGetWidth(_contentView.frame);   //當前是第幾個視圖
        newOffset.x = index * CGRectGetWidth(_contentView.frame);
        
        _pageControl.currentPage = index;
        _currentPageLabel.text = [NSString stringWithFormat:@"%d / %ld",index+1, totalNum];
        [_contentView setContentOffset:newOffset animated:YES];
    }else{
        [_timer setFireDate:[NSDate distantFuture]];//關閉定時器
    }
}

//點擊事件
- (void) loopImageOnClicked:(UITapGestureRecognizer *) tapGestureRecognizer{
    NSInteger imageViewTag = tapGestureRecognizer.view.tag;
    NSLog(@"imageViewTag: ----------------- %ld", imageViewTag);        // 0, 1, 2
    
}

//開始和停止
#pragma mark - Methods
- (void) startTimer {
    [_timer setFireDate:[NSDate distantPast]];
}

- (void) stopTimer {
    [_timer setFireDate:[NSDate distantFuture]];
}

//
//  ViewController.m
//  擁有下劃線隨視圖移動而移動和自動輪播的UIScrollView
//
//  Created by mouweng on 17/8/28.
//  Copyright © 2017年 mouweng. All rights reserved.
//

#import "ViewController.h"
#import "LoopScrollView.h"
@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    LoopScrollView* loopScrollView = [[LoopScrollView alloc] initWithFrame:self.view.bounds];
    [self.view addSubview:loopScrollView];
    
    
}

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

@end