第六十七篇、OC_UITableView head下拉图片放大的效果
(一) 布置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下拉图片放大的效果的更多相关文章
- iOS----实现scrollView或者scrollView的子类下拉图片放大的效果
代码是通过Tableview来说明的,用在其他情况下同样适用 - (void)viewDidLoad { [super viewDidLoad]; _imageview = [[UIImageView ...
- iOS tableView下拉图片放大
事实上这个效果,本质上就是在你tableView下拉 造成offset时候. 保持你顶部图片的y坐标点还停留在下拉时屏幕的顶点(offset), 而图片的长度变为原始的height长度-(offset ...
- iOSUITableView头部带有图片并且下拉图片放大效果
最近感觉UITableview头部带有图片,并且下拉时图片放大这种效果非常炫酷,所以动手实现了一下,效果如下图: 1.gif 实现原理很简单,就是在UITableview上边添加一个图片子视图,在ta ...
- iOS下拉图片放大
效果图 开始简单的代码过程 其实思路很简单 就是 让tableView偏移 一图片的高度,然后在把图片添加到tableView中,然后再监听didScrollView,在里面改变图片的frame - ...
- jQuery下拉友情链接美化效果代码分享
这篇文章主要介绍了jQuery下拉友情链接美化效果,很实用的代码,推荐给大家,有需要的小伙伴可以参考下. 文实例讲述了jQuery下拉友情链接美化效果,jQuery下拉友情链接美化代码是一款基于jQu ...
- 通过html和css做出下拉导航栏的效果
通过观察了百度的首页,对于更多产品一栏,觉得可以不涉及JS便可写出下拉导航栏的效果 1.先设计出大体的框架 <div class="nav"> <ul> & ...
- jQuery超酷下拉插件6种效果演示
原始的下拉框很丑啦, 给大家一款jQuery超酷下拉插件6种效果 效果预览 下载地址 实例代码 <div class="container"> <section ...
- 使用 CSS overscroll-behavior 控制滚动行为:自定义下拉刷新和溢出效果
CSS 的新属性 overscroll-behavior 允许开发者覆盖默认的浏览器滚动行为,一般用在滚动到顶部或者底部. 背景 滚动边界和滚动链接(boundary & chaining) ...
- 高仿IOS下拉刷新的粘虫效果
最近看需要做一款下拉刷新的效果,由于需要和Ios界面保持一致,所以这用安卓的方式实现了ios下的下拉刷新的粘虫效果. 最新的安卓手机版本的QQ也有这种类似的效果,就是拖动未读信息的那个红色圆圈,拖动近 ...
随机推荐
- HDU 5583 Kingdom of Black and White 水题
Kingdom of Black and White Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showpr ...
- hdu4085 Peach Blossom Spring 斯坦纳树,状态dp
(1)集合中元素表示(1<<i), i从0开始 (2)注意dp[i][ss] = min(dp[i][ss], dp[i][rr | s[i]] + dp[i][(ss ^ rr) | s ...
- C++ CopyFile
复制文件 关键点 CopyFile The CopyFile function copies an existing file to a new file. The CopyFileEx functi ...
- 怎样用JS来添加CSS样式
方法: document.getElementById("xx").style.xxx中的全部属性是什么 盒子标签和属性对比 CSS语法(不区分大写和小写) JavaScript语 ...
- Golang学习 - strings 包
------------------------------------------------------------ strings 包与 bytes 包中的函数用法基本一样,不再赘述. 只对 R ...
- The Kernel Newbie Corner: Kernel Debugging with proc "Sequence" Files--Part 3
转载:https://www.linux.com/learn/linux-career-center/44184-the-kernel-newbie-corner-kernel-debugging-w ...
- sharepreferce支持boolean,string类型
public class SharePrefersUtils { private static final String name="cogi"; public static bo ...
- Timed Code
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat=&qu ...
- cplusplus系列>algorithm>std::for_each
http://www.cplusplus.com/reference/algorithm/for_each/ 对一个序列应用函数.可以是函数指针,或者是functor. // for_each exa ...
- ReactNative学习-webView
在软件内部打开一个网页--不喜欢它没有办法返回,还需要再添加返回按钮== import React from 'react'; import { AppRegistry, Component, Scr ...