码迷,mamicode.com
首页 > 移动开发 > 详细

iOS开发日记45-类似淘宝商品详情查看翻页效果的实现

时间:2015-11-09 18:47:31      阅读:256      评论:0      收藏:0      [点我收藏+]

标签:

今天博主有一个类似淘宝商品详情查看翻页效果的实现的需求,遇到了一些困难点,在此和大家分享,希望能够共同进步.

1.使用第三方框架

我用到的第三方库EGORefreshTableHeaderView下拉刷新的效果还有就是PWLoadMoreTableFooterView上拉加载更多

主要的思路在于UISCrollView两页,一页展示商品概况,另一页展示商品更多详情

首先,第一页的view包含一个UITableView,这个tableView实现PWLoadMoreTableFooterView中的delegate方法,

实现delegate代理方法的时候使用

 

- (void)scrollViewByPageControlPage:(NSInteger)page  

{  

    [UIView beginAnimations:nil context:nil];  

    [UIView setAnimationDuration:0.50];  

    [self.backScrollView setContentOffset:CGPointMake(0, (ScreenHeight-navigationHeight-OffsetHeight)*page)];  

    [UIView commitAnimations];  

}  


将scrollView滚动到第二页,以便展示更多详情。

 

再次,在scrollview的第二页中加入一个View ,在此view上再创建一个ScrollView,这个scrollView实现EGORefreshTableHeaderView的delegate方法

具体如下:

 

#pragma mark EGORefreshTableHeaderDelegate Methods  

  

- (void)egoRefreshTableHeaderDidTriggerRefresh:(EGORefreshTableHeaderView*)view{  

    [self reloadTableViewDataSource];  

    [self performSelector:@selector(doneLoadingTableViewDataForIndex) withObject:nil afterDelay:1.0];  

}  

- (void)doneLoadingTableViewDataForIndex  

{  

    _reloading = NO;  

    [_refreshHeaderView egoRefreshScrollViewDataSourceDidFinishedLoading:lectureScrollView];  

    [_loadMoreFooterView pwLoadMoreTableDataSourceDidFinishedLoading];  

    [self scrollViewByPageControlPage:0];  

}  

- (BOOL)egoRefreshTableHeaderDataSourceIsLoading:(EGORefreshTableHeaderView*)view{  

        return _reloading; // should return if data source model is reloading  

}  

- (NSDate*)egoRefreshTableHeaderDataSourceLastUpdated:(EGORefreshTableHeaderView*)view{  

        return [NSDate date]; // should return date data source was last changed  

}  

一下实现EGORefreshTableHeaderView的delegate方法

此处设置跳转到SCRollView第一页

 

- (void)doneLoadingTableViewDataForIndex  

{  

    _reloading = NO;  

    [_refreshHeaderView egoRefreshScrollViewDataSourceDidFinishedLoading:lectureScrollView];  

    [_loadMoreFooterView pwLoadMoreTableDataSourceDidFinishedLoading];  

    [self scrollViewByPageControlPage:0];  

}  


2.使用原生框架

 代码贴出来,各位看官自行理解

- (void)viewDidLoad

{

    [super viewDidLoad];

    UIPanGestureRecognizer *pan = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(doPan:)];

    [self.view addGestureRecognizer:pan];

    pan.enabled = NO;

     self.panGesture = pan;

    _panGesture.delaysTouchesBegan = YES;

    [self.view bringSubviewToFront:_tableView];

// Do any additional setup after loading the view, typically from a nib.

}

 

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

CGPoint offset = aScrollView.contentOffset;

CGRect bounds = aScrollView.bounds;

CGSize size = aScrollView.contentSize;

UIEdgeInsets inset = aScrollView.contentInset;

float y = offset.y + bounds.size.height - inset.bottom;

float h = size.height;

float reload_distance = 30;

if(y > h + reload_distance) {

NSLog(@"load more rows");

        _panGesture.enabled = YES;//一个拖动手势

        self.tableView.scrollEnabled = NO;

        _isCurrentOnScreen = YES;

    }

}

 

- (void)doPan:(UIPanGestureRecognizer *)pan

{

    if(pan.state == UIGestureRecognizerStateBegan)

    {

        self.beginPoint = [pan locationInView:self.view];

//        self.beginPoint=[pan locationInView:self.view];

    }else if (pan.state == UIGestureRecognizerStateChanged)

    {

        if(_isCurrentOnScreen)

        {

            CGPoint touchPoint = [self.view convertPoint: [pan locationInView:self.tableView] fromView:_tableView] ;

            [self.tableView setFrame:CGRectMake(0, 20 + touchPoint.y - _beginPoint.y, 320, 460)];

        }else

        {

            [self.tableView setFrame:CGRectMake(0, - 480 + [pan locationInView:self.view].y - _beginPoint.y, 320, 460)];

        }

    }else if (pan.state == UIGestureRecognizerStateEnded)

    {

 

        if(_isCurrentOnScreen)

        {

            CGPoint touchPoint = [self.view convertPoint: [pan locationInView:self.tableView] fromView:_tableView] ;

            if(touchPoint.y - _beginPoint.y < -200)

            {

                [UIView animateWithDuration:0.01 animations:^{

                    [self.tableView setFrame:CGRectMake(0, - 480, 320, 460)];

                }];

                _isCurrentOnScreen = NO;

            }else

            {

                [UIView animateWithDuration:0.01 animations:^{

                    [self.tableView setFrame:CGRectMake(0, 20, 320, 460)];

                } completion:^(BOOL finished) {

                    [self stopPan];

                }];

            }

 

        }else

        {

            if([pan locationInView:self.view].y - _beginPoint.y < 200)

            {

                [UIView animateWithDuration:0.3 animations:^{

                    [self.tableView setFrame:CGRectMake(0, -480, 320, 460)];

                }];

                 _isCurrentOnScreen = NO;

            }else

            {

                [UIView animateWithDuration:0.3 animations:^{

                    [self.tableView setFrame:CGRectMake(0, 20, 320, 460)];

                } completion:^(BOOL finished) {

 

                    [self stopPan];

                }];

            }

        }

        [self.view bringSubviewToFront:_tableView];

    }

 

}

- (void)pan:(UIPanGestureRecognizer *)pan

{

    NSLog(@"11");

}

 

- (void)stopPan

{

     self.tableView.scrollEnabled = YES;

    _panGesture.enabled = NO;

     _tableView.panGestureRecognizer.enabled = YES;

}

 

iOS开发日记45-类似淘宝商品详情查看翻页效果的实现

标签:

原文地址:http://www.cnblogs.com/Twisted-Fate/p/4950315.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!