图片
图片2
当需要在地图上层覆盖一个列表时候,我们想看到更多的内容,列表被拉出来后翻看数据;
当想收起时候,可用下拉,或者随着手势滑落下来;

需解决的问题:
1、滑动表格,地图不移动;手势来回滑时候,列表要跟着高度变化;
2、当滑到最高时候,不再往上滑动;相反,滑到最低高度时候不再继续向下;
3、滑上去之后,再往下滑动 不影响列表数据的查看与浏览;

思考

手势开始:记录 开始点startY,

手势移动:
根据起始位置移动差 确定上滑动 , 下滑动;

起点B 点 记录方向 0;
B-A 正向, 记录方向符号 1;
B-C 反向 ,记录方向 -1;

偏移值 大于0 , 上滑动;
当B-A-C 后,立马记录 1 变成 -1; 记录标记状态前,

正向如:B-A 的过程 ,需判断是否为 为 -1 到1 还是 0-1 , 如果是-1 则是来回拖动;否则为正向拖动;

code :以下是重点逻辑代码;

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
if(gestureRecognizer.state == UIGestureRecognizerStateChanged){
CGPoint point = [gestureRecognizer locationInView:self.view];

CGFloat topDistance = startSpanPoint.y - point.y;
if(topDistance >0){ //>100 就是向上滑,但是要控制滑动的距离限制;

if(pointB1_Y == -1){
blChange = YES; //记录从往下变成往上;
}else if(pointB1_Y == 0){
blChange = NO; //方向没有变更;
}

pointB1_Y = 1; //记录当前是往上推;

//往上推;
if(self.tableView.top == self.listViewMinTop){
self.tableView.scrollEnabled = YES;
}else{
if(self.datas.count > 0){ //无数据时候 不给往上推
//向上;上剩多少留多少 ;
if(bBottom_Top_Flag == NO){
if(!blChange && self.mapViewHeight - topDistance >= self.listViewMinTop){
self.tableView.top = self.mapViewHeight - topDistance;
}
}else{
if(self.mapViewHeight - topDistance >= self.listViewMinTop){
self.tableView.top = self.mapViewHeight - topDistance;
}
}
}
}

}else if(topDistance<0){

if(pointB1_Y == 1){
blChange = YES; //记录从往上变成往下;
}else if(pointB1_Y == 0){
blChange = NO; //方向没有变更;
}
pointB1_Y = -1; //记录当前是往下拉;

if(self.tableView.contentOffset.y<=0 && self.tableView.top < self.mapViewHeight){ //并且是在顶部小于0时候

self.tableView.contentOffset = CGPointMake(0, 0); //可写可不写;
self.tableView.scrollEnabled = NO;

if(bBottom_Top_Flag == YES){
if(!blChange && self.listViewMinTop - topDistance <= self.mapViewHeight){
self.tableView.top = self.listViewMinTop - topDistance;
}
}else{
if(self.listViewMinTop - topDistance <= self.mapViewHeight){
self.tableView.top = self.listViewMinTop - topDistance;
}
}
}
}
}

单独写了个demo ,仿boss 直聘 查看更多职位,仿哈喽出现 app 扫码底部按钮 查看更多活动

Demo 源码
图片2
图片

评论