功能需求
最近需要修改商品詳情頁闰蛔,其他沒什么就是一個多種Cell的列表,關(guān)鍵是其中的一個效果不太好實現(xiàn)图柏。
商品詳情gif.gif
要求輪播圖滑動的速率慢于輪播圖以下部分滑動的速率序六。給人一種輪播圖被遮蓋的錯覺。
主要思路
剛開始感覺就是用tableView可以搞定蚤吹,結(jié)果無論我怎么寫例诀,都不會有這種遮蓋效果随抠。只好問度娘,還真有人寫出來了繁涂,大概原理如下:首先需要用到scrollView和tableView兩個主要控件拱她。將輪播圖部分和tableView部分子上而下的放到scrollView上面,然后給足tableView所使用的高度扔罪,只能大不能小秉沼。這一點很重要,只有將tableView的高度給夠了步势,tableView才不會滑動(這個思路很巧妙)氧猬。再根據(jù)實際需要設(shè)置scollView的contentSize背犯。然后再在- (void)scrollViewDidScroll:(UIScrollView *)scrollView的方法中設(shè)置輪播圖的和tableView的frame和origin坏瘩,將輪播圖的origin設(shè)置成偏移量的二分之一。將tableView的origin設(shè)置成偏移量漠魏。
代碼實現(xiàn)
#import "GoodsDetail1ViewController.h"
@interface GoodsDetail1ViewController ()<UITableViewDelegate, UITableViewDataSource, APIRequestDelegate>
@property (nonatomic, strong)UIScrollView *scrollView;
@property (nonatomic, strong)UIView *topView;
@property (nonatomic, strong)UIView *topBannerView;
@implementation GoodsDetail1ViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.scrollView = [[UIScrollView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT +50)];
self.scrollView.contentSize = CGSizeMake(0, SCREEN_HEIGHT * 8);
self.scrollView.delegate = self;
self.scrollView.bounces = YES;
[self.view addSubview:self.scrollView];
self.topView = [[UIView alloc]initWithFrame: CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_WIDTH)];
self.topView.backgroundColor = [UIColor yellowColor];
self.topBannerView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT)];
self.topBannerView.backgroundColor = [UIColor whiteColor];
[self.topView addSubview:self.topBannerView];
[self.scrollView addSubview:self.topView];
self.goodsDataTableview1 = [[UITableView alloc]initWithFrame:CGRectMake(0, SCREEN_WIDTH, SCREEN_WIDTH, SCREEN_HEIGHT * 9) style:UITableViewStylePlain];
self.goodsDataTableview1.backgroundColor = [UIColor colorWithHexColorString:@"ededed"];
self.goodsDataTableview1.delegate = self;
self.goodsDataTableview1.dataSource = self;
self.goodsDataTableview1.bounces = NO;
self.goodsDataTableview1.scrollEnabled = NO;
[self.scrollView addSubview:self.goodsDataTableview1];
}
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
if (scrollView == self.scrollView) {//對其偏移量進行設(shè)置。
CGFloat offsetY = scrollView.contentOffset.y;
if (offsetY <= 0) {
CGRect rect = self.topView.frame;
rect.origin.y = offsetY;
self.topView.frame = rect;
rect = self.goodsDataTableview1.frame;
rect.origin.y = offsetY + SCREEN_WIDTH;
self.goodsDataTableview1.frame = rect;
rect = self.topBannerView.frame;
rect.origin.y = 0;
self.topBannerView.frame = rect;
} else {
CGRect rect = self.topBannerView.frame;
rect.origin.y = offsetY / 2;
self.topBannerView.frame = rect;
}
}
}
以上只是部分代碼,提示提供個思路余下的部分還得需要你自己親自實現(xiàn)竟坛。