文档章节

iOS-可拉伸放大的UITableView头部视图

麦兜卖鱼丸
 麦兜卖鱼丸
发布于 2016/06/02 13:29
字数 989
阅读 458
收藏 0

前言

App项目个人中心功能,一般是使用UITableView,但是如果不做处理,下拉的时候会显示灰色的背景,很难看,为了避免这个问题,就是用一张图片,根据tableview下拉的内容偏移量contentOffset,通过计算上下左右拉伸,遮盖那个灰色的背景,达到美化的效果。因为这个功能很普遍的使用,网络上有很多的第三方,我在做项目的时候找到一个StretchHeader这个上下拉伸放大图片的开源控件,应该符合我们的功能需求;不过我在使用的过程中发现了一些小Bug,修改并加上了一些逻辑判断,以适应控制器是否设置automaticallyAdjustsScrollViewInsets属性。

 

(一)我认为的StretchHeader这个第三方的部分小bug;在下拉tableview的过程中,上拉tableview右侧会出现白边(view左移造成的)。

- (void)scrollViewDidScroll:(UIScrollView*)scrollView
{
    /*出现bug的代码
    CGRect f     = _view.frame;
    f.size.width = _tableView.frame.size.width;
    _view.frame  = f;
    */
    
    if(scrollView.contentOffset.y < 0)
    {
        CGFloat offsetY = (scrollView.contentOffset.y + scrollView.contentInset.top) * -1;
       
        initialFrame.origin.y = - offsetY * 1;
        initialFrame.origin.x = - offsetY / 2;
        
        initialFrame.size.width  = _tableView.frame.size.width + offsetY;
        initialFrame.size.height = defaultViewHeight + offsetY;
        
        _view.frame = initialFrame;
    }
}

上述源码是第三方StretchHeader的一段代码,我注释的部分就是出现bug的代码,我们可以看一下,这个方法是计算view上下左右拉伸幅度的(即重新设置frame的地方),注释的3句代码,在每次滑动tableview的过程中都会把view的width设置成tableview的width,相当于没有被拉伸过的宽度,但是origin.x却是被拉伸计算的,不是原来的值,这就会使得在下拉的过程中在右侧会出现白边,(因为view在拉伸过程中已经被左移),下部分说一下我的解决办法。

 

(二)我的解决思路,在判断的条件范围内(scrollView.contentOffset.y <= initialOffsetY)设置view的frame都在tableview滑动的时候计算并赋值,并加上临界点的判断(在临界点也计算view的frame),防止tableview停止滑动时view的frame计算错误;CGFloat initialOffsetY = automaticallyAdjustsScrollViewInsets ? -64 : 0;这一句就是获取tableview判断临界的值,-64或者是0(如果controller设置了automaticallyAdjustsScrollViewInsets属性为NO,值为0;反之为-64)。

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>

@interface StretchableTableHeader : NSObject

@property (nonatomic,strong) UITableView *tableView;
@property (nonatomic,strong) UIView *view;

- (void)stectchHeaderForTableView:(UITableView *)tableView withView:(UIView *)view subViews:(UIView *)subView;
- (void)scrollViewDidScroll:(UIScrollView*)scrollView isAutomaticallyAdjustsScrollViewInsets:(BOOL)automaticallyAdjustsScrollViewInsets;//判断view是否设置automaticallyAdjustsScrollViewInsets属性,来设置scrollView.contentOffset.y的判断基准点,即-64或0;

- (void)resizeView;

@end


#import "StretchableTableHeader.h"

@interface StretchableTableHeader ()
{
    CGRect initFrame;//view初始的frame,会改变;
    CGFloat defaultViewHeight;//view初始的高度;
}

@end

@implementation StretchableTableHeader

- (void)stectchHeaderForTableView:(UITableView *)tableView withView:(UIView *)view subViews:(UIView *)subView
{
    _tableView = tableView;
    _view = view;
    
    initFrame = _view.frame;
    defaultViewHeight = initFrame.size.height;
    
    UIView *emptyTableHeaderView = [[UIView alloc] initWithFrame:initFrame];
    _tableView.tableHeaderView = emptyTableHeaderView;
    
    
    [_tableView addSubview:_view];
    [_tableView addSubview:subView];
}

- (void)scrollViewDidScroll:(UIScrollView *)scrollView isAutomaticallyAdjustsScrollViewInsets:(BOOL)automaticallyAdjustsScrollViewInsets
{
    CGFloat initialOffsetY = automaticallyAdjustsScrollViewInsets ? -64 : 0;
    if (scrollView.contentOffset.y <= initialOffsetY)
    {
        //下拉的偏移量;
        CGFloat offsetY = (scrollView.contentOffset.y + scrollView.contentInset.top) * -1;
        initFrame.origin.y = -offsetY * 1;//设置上下拉伸的幅度;
        initFrame.origin.x = -offsetY / 2;//设置左右拉伸的幅度;
        
        //重新设置view的frame(高度和宽度加上offsetY偏移量,达到图片放大的效果);
        initFrame.size.width = _tableView.frame.size.width + offsetY;
        initFrame.size.height = defaultViewHeight + offsetY;
        _view.frame = initFrame;
    }
}

- (void)resizeView
{
    initFrame.size.width = _tableView.frame.size.width;
    _view.frame = initFrame;
}
@end

 

(三)使用的代码实例;下拉tableview,图片会上下拉伸,左右放大;

- (void)viewDidLoad
{
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor whiteColor];
    self.navigationItem.title = @"个人中心";
    [self.view addSubview:self.tbl];
    
    UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, 200)];
    imageView.contentMode = UIViewContentModeScaleAspectFill;
    imageView.clipsToBounds = YES;
    imageView.image = [UIImage imageWithContentsOfFile:[[NSBundle mainBundle] pathForResource:@"photo" ofType:@".jpg"]];
    
    
    UIView *contentView = [[UIView alloc] initWithFrame:imageView.bounds];
    UIImageView *avater = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 90, 90)];
    avater.image = [UIImage imageNamed:@"avater"];
    avater.center = contentView.center;
    [contentView addSubview:avater];
    
    
    self.stretchableTableHeader = [StretchableTableHeader new];
    [self.stretchableTableHeader stectchHeaderForTableView:self.tbl withView:imageView subViews:contentView];
    
    
    UIBarButtonItem *right = [[UIBarButtonItem alloc] initWithTitle:@"+" style:UIBarButtonItemStyleDone target:self action:@selector(add)];
    self.navigationItem.rightBarButtonItem = right;
    
    self.dataSourceArray = [NSMutableArray arrayWithContentsOfFile:[self filePath]];
    [self.tbl reloadData];
    
    self.navigationController.toolbarHidden = NO;
    
    self.navigationController.toolbar.backgroundColor = [UIColor whiteColor];
}


- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
    [self.stretchableTableHeader scrollViewDidScroll:scrollView isAutomaticallyAdjustsScrollViewInsets:self.automaticallyAdjustsScrollViewInsets];
}
- (void)viewDidLayoutSubviews
{
    [self.stretchableTableHeader resizeView];
}

 

(四)总结

这只是一个小小的功能,别人封装的控件给了我们很多的方便,但我们也要有研究和钻研代码的精神,这是是学习之道。

 

 

© 著作权归作者所有

麦兜卖鱼丸
粉丝 12
博文 69
码字总数 69333
作品 0
桂林
iOS工程师
私信 提问
IOS学习,最简单的表格应用程序,学习,列出博客

IOS编程浅蓝教程,这是博客地址http://www.cnblogs.com/haichao/category/425378.html IOS编程浅蓝教程:锲子 IOS编程浅蓝教程(一)先决条件:开始iOS编程的必要准备 IOS编程浅蓝教程(二) Hel...

andy521zhu
2015/01/17
0
0
iOS之UITableView重新排序

表格视图在ios 开发中,经常使用到的视图,几乎每个app 中多多少少都会有UITableView的影子,就是因为UITableView的功能非常强大,使用起来也非常简单,苹果公司也对接口做了很好的封装,才使...

广州英趣科技
2013/06/05
0
2
UI_09 UITableView(表视图)

⼀、表视图 在iOS中,要实现表格数据展示,最常用的做法就是使用UITableView。UITableView继承自UIScrollView,因此支持垂直滚动,而且性能极佳 1、表示图的样式 UITableViewStylePlain UITa...

黑伞将军
2015/08/26
0
0
iOS UITableView代理方法详解

iOS UITableView的代理方法详解 一、补充 在上一篇博客中,http://my.oschina.net/u/2340880/blog/404605,我将IOS中tableView(表视图)的一些常用方法总结了一下,这篇将tableView的代理方法...

珲少
2015/04/22
0
2
iOS开发tips-UITableView、UICollectionView行高/尺寸自适应

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/jianxin160/article/details/55002487 UITableView 我们都知道UITableView从iOS 8开始实现行高的自适应相对比...

KenshinCui
2017/02/12
0
0

没有更多内容

加载失败,请刷新页面

加载更多

编程语言王国的唯一王者

在撰写本文前,我搜索了“我应该学习哪种编程语言”这个词条,发现会产生5.17亿个结果。而每个页面都在滔滔不绝地介绍某种语言相对于其他语言的优势,其中90%会推荐Python或JavaScript。 恕...

京东云技术新知
21分钟前
3
0
Dota2锁区steam下载国际服办法

Dota2锁区steam下载国际服办法 直接访问Dota2的steam地址下载即可 http://store.steampowered.com/app/570/Dota_2/?cc=us...

我爱吃炒鸡
25分钟前
2
0
多个参数拼接成的字符串转成json对象,参数循序会变

太坑爹了。 生成签名方法要根据参数排序,然后多个参数拼接成字符串传递到服务端,转为JSON对象,传入签名算法API中,JSON对象的参数顺序和字符串里面的参数顺序不一致,导致生成的签名一直和...

太猪-YJ
26分钟前
2
0
Aspose.Cells for .NET v19.6发布上线!支持绘图切片机功能!

Aspose.Cells for .NET是一个Excel电子表格编程API,可加快电子表格管理和处理任务。通过集成API,开发人员可以执行的一些基本任务,如管理多个工作表,从头创建电子表格内容和样式,从不同数...

mnrssj
29分钟前
1
0
泛型

1、泛型接口的定义和基本使用 (定义泛型接口) package com.yxs.demo.dao;public interface Demo<T> { public abstract void show(T t);} (2)、泛型接口的实现 泛型接口的是是实现有...

一对二
29分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部