iOS分享的demoIOS | MAC

IOSUITableView上移覆盖视图下拉显示

2016-10-23  本文已影响941人  尕qin
最近看APP时看到一个新的功能就是TableView上拉覆盖视图,这样TableView界面显示的就跟多

先看下图吧

bbbb.gif

最近也做了这个功能给大家分享一下吧

属性、宏定义

//屏幕宽高
#define SCREEN_WIDTH [[UIScreen mainScreen] bounds].size.width
#define SCREEN_HEIGHT [[UIScreen mainScreen] bounds].size.height
//一个tableView,一个手势,
@property(weak,nonatomic)UITableView *tableView;
@property(strong,nonatomic)UIPanGestureRecognizer *pan;
//这个地图你们可以换ImageView
@property(weak,nonatomic)MKMapView *mapView;

#######这的mapView tableView可能有些不完全,需要你们补一下,大家都懂的东西

注意SCREEN_WIDTH*3/5##是mapView的高度

-(void)setMapView{
    [self locManager];
    MKMapView *mapView=[[MKMapView alloc] initWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_WIDTH*3/5)];
    mapView.userTrackingMode=MKUserTrackingModeFollow;
    mapView.mapType=MKMapTypeStandard;
    mapView.delegate=self;
    //显示比例尺
    mapView.showsScale=YES;
    [self.view addSubview:mapView];
    self.mapView=mapView;
}
-(void)setTableView{
//去除控制器的默认约束
    self.automaticallyAdjustsScrollViewInsets=NO;
    UITableView *tableView=[[UITableView alloc] initWithFrame:CGRectMake(0, SCREEN_WIDTH*3/5, SCREEN_WIDTH, SCREEN_HEIGHT-10) style:UITableViewStyleGrouped];
    tableView.delegate=self;
    tableView.dataSource=self;
    
    UIView *view=[[UIView alloc]initWithFrame:CGRectMake(0, 0, 100, 30)];
    UILabel *label=[[UILabel alloc] initWithFrame:CGRectMake(10, 0, 200, 30)];
    label.text=@"附近美食";
    label.textColor=[UIColor lightGrayColor];
    label.font=[UIFont systemFontOfSize:14 weight:0.1];
    [view addSubview:label];
    tableView.tableHeaderView=view;
    
    [tableView registerNib:[UINib nibWithNibName:@"UITableViewCell" bundle:nil] forCellReuseIdentifier:@"CellId"];
    [self.view addSubview:tableView];
    self.tableView=tableView;
//注意是这个手势
    UIPanGestureRecognizer *pan=[[UIPanGestureRecognizer alloc]initWithTarget:self action:@selector(panAction:)];
//添加手势
    [tableView addGestureRecognizer:pan];
    self.pan=pan;
}

核心部分

#######手势执行的方法

-(void)panAction:(UIPanGestureRecognizer *)sender{
    //获取手势一点的点
    CGPoint point=[sender translationInView:sender.view];
    //改变tableView视图的位置
    if (self.tableView.y>0) {
        sender.view.transform=CGAffineTransformTranslate(sender.view.transform, 0, point.y);
    }
    //重置
    [sender setTranslation:CGPointZero inView:sender.view];
    //滑到顶部时,上移
    if (self.tableView.y<=0) {
        self.tableView.y=0;
        //禁止手势,否则tableView滚动手势会被拦截,无法响应
        sender.enabled=NO;
    }
    //限制下移最低
    if (self.tableView.y>=SCREEN_WIDTH*3/5) {
        self.tableView.y=SCREEN_WIDTH*3/5;
    }
}

#######scrollView代理

-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
    //下拉
    if (scrollView.contentOffset.y<=0) {
        //开启手势
        self.pan.enabled=YES;
        if (self.tableView.y<SCREEN_WIDTH*3/5) {
            //让tableView下移
            self.tableView.y-=scrollView.contentOffset.y;
            if (self.tableView.y>SCREEN_WIDTH*3/5) {
                self.tableView.y=SCREEN_WIDTH*3/5;
            }
        }
    }
//上拉
if (scrollView.contentOffset.y>0) {
        if (self.tableView.y<0) {
            self.tableView.y=0;
            self.pan.enabled=NO;
        }
    }
    //防止用户上移到顶部后不松手后继续,下移,再上移来回弄的BUG,因为那时候自定义的手势开启了,当tableView的滑动手势还一直响应者,
    if (self.pan.enabled==YES) {
        //响应这个上移
        if (scrollView.contentOffset.y>0) {
            self.tableView.y-=scrollView.contentOffset.y;
            //让tableView的scrollView别跟着上移
            self.tableView.contentOffset=CGPointZero;
        }
    }
}

还有疑问的留言,觉得不错的支持一下,谢谢!

上一篇 下一篇

猜你喜欢

热点阅读