服务器之家:专注于服务器技术及软件下载分享
分类导航

PHP教程|ASP.NET教程|Java教程|ASP教程|编程技术|正则表达式|C/C++|IOS|C#|Swift|Android|VB|R语言|JavaScript|易语言|vb.net|

服务器之家 - 编程语言 - IOS - iOS TableView头视图根据偏移量下拉缩放效果

iOS TableView头视图根据偏移量下拉缩放效果

2021-04-25 19:38来自南方的熊 IOS

这篇文章主要为大家详细介绍了iOS TableView头视图根据偏移量下拉缩放效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

本文实例为大家分享了ios tableview实现下拉缩放效果的具体代码,供大家参考,具体内容如下

在做项目时,一些tableview的地方会使用到下拉tableview让heardview头视图随其偏移量的变化而变化,之前做过一次但没记录下来。现在做的时候总是遇到一些问题,比如下拉时是以原点向左右两边放大,这个只是效果问题。还有就是看到的视图确实变大了,但是会盖到下面的tableviewcell。开始以为是加在里面的视图变大,而tableviewheardview没变大,我nslog打印了一下两个视图的高度,发现是一样的,找不到问题了。

在网上找了一些相关的例子,各有各的做法,有的是根据偏移量来设置tableviewheardview的缩放,有的是设置里面被我们设置为tableviewheardview的那个视图的大小,都试了一下感觉还是不行,感觉缩放效果是有了的,但是拉大一点就会把下面的cell盖住。

之后自己摸索,调整后,我是用偏移量来控制里面的imageview的大小,imageview是我设置的heardview的子视图,而heardview和tableviewheard的大小不会根据imageview变化,只是坐标变了,其实这是一种错觉,真实的效果是imageview坐标向左上方偏移,大小也变化,而heardview和tableviewheard没变大,但imageview变大的部分盖住他们的上方,让我们觉得heardview和tableviewheard也变大了,可以参考文章下面的逻辑图。

先看一看效果吧,一张是没下拉时的效果,一张是下拉时的效果。

iOS TableView头视图根据偏移量下拉缩放效果

可以看到imageview向四周变大了,而头像和昵称只是垂直方向位置变了,而大小没变。

这里用到的控件入下图

iOS TableView头视图根据偏移量下拉缩放效果

#define screenwidth [uiscreen mainscreen].bounds.size.width

在viewdidload里创建一下

?
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
//========== 头视图创建与设置 ===========
  imagehight = 250;
  [self creatheardview];
 
- (void)creatheardview
{
  headerview = [[uiview alloc] initwithframe:(cgrectmake(0, 0, screenwidth, imagehight+50))];
  //背景视图
  heardimageview = [[uiimageview alloc] init];
  heardimageview.frame = cgrectmake(0, 0, screenwidth, imagehight);
  heardimageview.image = [uiimage imagenamed:@"background.jpg"];
  [headerview addsubview:heardimageview];
  //用户头像
  personimageview = [[uiimageview alloc] initwithframe:cgrectmake(screenwidth-30-60, imagehight-30, 60, 60)];
  personimageview.layer.cornerradius = cgrectgetwidth(personimageview.frame)/2;
  personimageview.layer.maskstobounds = yes;
  [headerview addsubview:personimageview];
  //用户名
  personnamelabel = [[uilabel alloc] initwithframe:cgrectmake(cgrectgetminx(personimageview.frame)-200, cgrectgetminy(personimageview.frame), 180, 30)];
  personnamelabel.font = [uifont systemfontofsize:15];
  personnamelabel.textcolor = [uicolor whitecolor];
  personnamelabel.textalignment = nstextalignmentright;
  [headerview addsubview:personnamelabel];
  //个人签名
  introducelabel = [[uilabel alloc] initwithframe:cgrectmake(30, cgrectgetmaxy(personimageview.frame), screenwidth-60, 20)];
  introducelabel.font = [uifont systemfontofsize:10];
  introducelabel.textcolor = [uicolor graycolor];
  introducelabel.textalignment = nstextalignmentright;
  [headerview addsubview:introducelabel];
  
  comtableview.tableheaderview = headerview;//设置头视图
}
 
然后在tableview的滚动代理中有一个方法可以实时监测滚动偏移量,
#pragma mark - 滚动代理
- (void)scrollviewdidscroll:(uiscrollview *)scrollview
{
  cgfloat width = self.view.frame.size.width; // 图片宽度
  cgfloat yoffset = scrollview.contentoffset.y; // 偏移的y值,还要考虑导航栏的64哦
  if (yoffset < 0) {//向下拉是负值,向上是正
    cgfloat totaloffset = imagehight + abs(yoffset);
    cgfloat f = totaloffset / imagehight;//缩放比例
    //拉伸后的图片的frame应该是同比例缩放。
    heardimageview.frame = cgrectmake(- (width * f - width) / 2, yoffset, width * f, totaloffset);
  }
}

逻辑图:

iOS TableView头视图根据偏移量下拉缩放效果

这样tableview的下拉缩放头视图功能就可以实现了。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持服务器之家。

原文链接:https://blog.csdn.net/COOL_BEAR_XX/article/details/52400667

延伸 · 阅读

精彩推荐
  • IOSiOS通过逆向理解Block的内存模型

    iOS通过逆向理解Block的内存模型

    自从对 iOS 的逆向初窥门径后,我也经常通过它来分析一些比较大的应用,参考一下这些应用中某些功能的实现。这个探索的过程乐趣多多,不仅能满足自...

    Swiftyper12832021-03-03
  • IOSiOS 雷达效果实例详解

    iOS 雷达效果实例详解

    这篇文章主要介绍了iOS 雷达效果实例详解的相关资料,需要的朋友可以参考下...

    SimpleWorld11022021-01-28
  • IOSIOS开发之字典转字符串的实例详解

    IOS开发之字典转字符串的实例详解

    这篇文章主要介绍了IOS开发之字典转字符串的实例详解的相关资料,希望通过本文能帮助到大家,让大家掌握这样的方法,需要的朋友可以参考下...

    苦练内功5832021-04-01
  • IOSiOS布局渲染之UIView方法的调用时机详解

    iOS布局渲染之UIView方法的调用时机详解

    在你刚开始开发 iOS 应用时,最难避免或者是调试的就是和布局相关的问题,下面这篇文章主要给大家介绍了关于iOS布局渲染之UIView方法调用时机的相关资料...

    windtersharp7642021-05-04
  • IOSIOS 屏幕适配方案实现缩放window的示例代码

    IOS 屏幕适配方案实现缩放window的示例代码

    这篇文章主要介绍了IOS 屏幕适配方案实现缩放window的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要...

    xiari5772021-06-01
  • IOS关于iOS自适应cell行高的那些事儿

    关于iOS自适应cell行高的那些事儿

    这篇文章主要给大家介绍了关于iOS自适应cell行高的那些事儿,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的...

    daisy6092021-05-17
  • IOS解析iOS开发中的FirstResponder第一响应对象

    解析iOS开发中的FirstResponder第一响应对象

    这篇文章主要介绍了解析iOS开发中的FirstResponder第一响应对象,包括View的FirstResponder的释放问题,需要的朋友可以参考下...

    一片枫叶4662020-12-25
  • IOSiOS中tableview 两级cell的展开与收回的示例代码

    iOS中tableview 两级cell的展开与收回的示例代码

    本篇文章主要介绍了iOS中tableview 两级cell的展开与收回的示例代码,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...

    J_Kang3862021-04-22