tableView上面添加可拉伸的视图

2017-06-21  本文已影响41人  lizhi_boy
实现效果图.gif

可见tableView上面的视图下拉放大了

废话不多说先看一下这种UI的设计思路:总体上有两种

1、添加tableHeaderView头部视图#

2、tableView上面添加View

image.png

<p>界面太过复杂,并且scrollView的contentSize要根据tableView的contentSize决定,禁掉tableView的滑动属性</p>

3、在tableView里面插入视图(个人认为最简洁的方式)

image.png

这种方式的主要运用到UIView的这个方法:

- (void)insertSubview:(UIView *)view belowSubview:(UIView *)siblingSubview;
参数 view 一个需要插入到其他视图底部的视图。它将从它的父视图移除如果它不与相邻视图的相邻 siblingSubview 一个相邻视图将会在插入的视图之上

看代码:

    _tableView.contentInset = UIEdgeInsetsMake(150, 0, 0, 0);//空出一个位置
    LXMeHeaderView *headerView = [[LXMeHeaderView alloc] initWithFrame:CGRectMake(0, -150, lx_screenWidth, 150)];
    self.headerView = headerView;
    [self.tableView insertSubview:headerView belowSubview:self.tableView.subviews.firstObject];//把视图放进去

scrollview代理实现一下

- (void)scrollViewDidScroll:(UIScrollView *)scrollView{
    CGFloat yOffset = scrollView.contentOffset.y;
    if (yOffset < -150) {
        self.headerView.top = yOffset;
        self.headerView.height = -yOffset;
    }
}

注意一下: 自定义View里面的背景图在初始化的时候记得把这个属性写一下: _bgImageView.contentMode = UIViewContentModeScaleAspectFill;

上一篇 下一篇

猜你喜欢

热点阅读