(一) 布置UITableview

我们首先要通过设置UITableview的内容偏移 self.tableView.contentInset

来为图片视图留出位置,这里我们的图片高度暂定为280

const CGFloat contentInset = ;

@interface ViewController ()<UITableViewDelegate,UITableViewDataSource>

@property (nonatomic, strong) UITableView *tableView;

@property (nonatomic, strong) UIImageView *imageView;

@end

简单地创建一个tableView

    self.tableView = [[UITableView alloc] initWithFrame:self.view.bounds];

    _tableView.delegate = self;

    _tableView.dataSource = self;

    [self.view addSubview:_tableView];

    self.tableView.contentInset = UIEdgeInsetsMake(contentInset , , , );

(二) 布置图片

   self.imageView = [[UIImageView alloc] initWithFrame:CGRectMake(, - contentInset, self.view.bounds.size.width, contentInset)];

    _imageView.image = [UIImage imageNamed:@"image01.jpg"];

    [self.tableView addSubview:_imageView];

    _imageView.contentMode = UIViewContentModeScaleAspectFill;

    _imageView.clipsToBounds = YES;

(三) 拖动事件的处理

我们都知道,UITableview属于可以滑动的控件,所以它的父类是UIScrollView,所以我们就可以在滑动事件中做出一些处理。
在滑动的时候,一旦判定是下拉状态,那么我们就要动态的改变图片的纵向位置和图片的高度(由于设置了contentMode,所以宽度自己会变化),最终实现所需要的效果。
代码如下

- (void)scrollViewDidScroll:(UIScrollView *)scrollView {

    CGPoint point = scrollView.contentOffset;

    if (point.y < - contentInset) {

        CGRect rect  = self.imageView.frame;

        rect.origin.y = point.y;

        rect.size.height = - point.y;

        self.imageView.frame = rect;
} }

由于contentInset预设置的大小不同,可能会出现图片先下拉再放大和立即放大的两种效果.

第六十七篇、OC_UITableView head下拉图片放大的效果的更多相关文章

  1. iOS----实现scrollView或者scrollView的子类下拉图片放大的效果

    代码是通过Tableview来说明的,用在其他情况下同样适用 - (void)viewDidLoad { [super viewDidLoad]; _imageview = [[UIImageView ...

  2. iOS tableView下拉图片放大

    事实上这个效果,本质上就是在你tableView下拉 造成offset时候. 保持你顶部图片的y坐标点还停留在下拉时屏幕的顶点(offset), 而图片的长度变为原始的height长度-(offset ...

  3. iOSUITableView头部带有图片并且下拉图片放大效果

    最近感觉UITableview头部带有图片,并且下拉时图片放大这种效果非常炫酷,所以动手实现了一下,效果如下图: 1.gif 实现原理很简单,就是在UITableview上边添加一个图片子视图,在ta ...

  4. iOS下拉图片放大

    效果图 开始简单的代码过程 其实思路很简单 就是 让tableView偏移 一图片的高度,然后在把图片添加到tableView中,然后再监听didScrollView,在里面改变图片的frame - ...

  5. jQuery下拉友情链接美化效果代码分享

    这篇文章主要介绍了jQuery下拉友情链接美化效果,很实用的代码,推荐给大家,有需要的小伙伴可以参考下. 文实例讲述了jQuery下拉友情链接美化效果,jQuery下拉友情链接美化代码是一款基于jQu ...

  6. 通过html和css做出下拉导航栏的效果

    通过观察了百度的首页,对于更多产品一栏,觉得可以不涉及JS便可写出下拉导航栏的效果 1.先设计出大体的框架 <div class="nav"> <ul> & ...

  7. jQuery超酷下拉插件6种效果演示

    原始的下拉框很丑啦, 给大家一款jQuery超酷下拉插件6种效果 效果预览 下载地址 实例代码 <div class="container"> <section ...

  8. 使用 CSS overscroll-behavior 控制滚动行为:自定义下拉刷新和溢出效果

    CSS 的新属性 overscroll-behavior 允许开发者覆盖默认的浏览器滚动行为,一般用在滚动到顶部或者底部. 背景 滚动边界和滚动链接(boundary & chaining) ...

  9. 高仿IOS下拉刷新的粘虫效果

    最近看需要做一款下拉刷新的效果,由于需要和Ios界面保持一致,所以这用安卓的方式实现了ios下的下拉刷新的粘虫效果. 最新的安卓手机版本的QQ也有这种类似的效果,就是拖动未读信息的那个红色圆圈,拖动近 ...

随机推荐

  1. CDOJ 第七届ACM趣味程序设计竞赛第三场(正式赛) 题解

    宝贵资源 题目连接: http://acm.uestc.edu.cn/#/problem/show/1265 题意 平面上给n个点(n<=1000),要求找一个面积最小的正方形,将所有的点都囊括 ...

  2. grumble.js

    grumble.js是一个jQuery插件.它提供了气泡提示框功能. 我们可以自定义气泡框的角度,大小,内容,以及回调方法等. 用法很简单: $('#grumble1').grumble( { tex ...

  3. poj 1845(等比数列前n项和及高速幂)

    Sumdiv Time Limit: 1000MS   Memory Limit: 30000K Total Submissions: 13959   Accepted: 3433 Descripti ...

  4. 对比两个同类型的泛型集合并返回差异泛型集合 ——两个List<类名>的比较

    1: /// <summary> 2: /// 对比两个同类型的泛型集合并返回差异泛型集合 3: /// </summary> 4: /// <typeparam nam ...

  5. 反编译android应用,降低权限去广告及重新签名

    功能:反编译apk降低权限及重新签名 场景:很多软件,申请了一些可能会导致付费(如,发短信,呼叫号码)或者泄漏隐私(如:读取通讯录)的权限,让人很不放心.比如:飞信.墨迹天气.iReader等都在此列 ...

  6. 知数堂MYSQL优化课---CU论坛版主 DBA 博客

    http://www.cnblogs.com/MYSQLZOUQI/category/546261.html

  7. How to Install and Configure Nginx from Source on centos--转

    1.CentOS - Installing Nginx from source http://articles.slicehost.com/2009/2/2/centos-installing-ngi ...

  8. LeetCode18 4Sum

    题意: Given an array S of n integers, are there elements a, b, c, and d in S such that a + b + c + d = ...

  9. Solr 删除数据的几种方式

    原文出处:http://blog.chenlb.com/2010/03/solr-delete-data.html 有时候需要删除 Solr 中的数据(特别是不重做索引的系统中,在重做索引期间).删除 ...

  10. iOS---》点击uitableview 的section展开或隐藏

    #import <UIKit/UIKit.h> @interface TestCell : UITableViewCell @property (weak, nonatomic) IBOu ...