iOS UIScrollView 你可能不知道的奇技淫巧
iOS 的 UIScrollView 可以说是十分强大,巧妙地运用它可以得到一些意想不到的效果。本文将举几个 ScrollView 不常见运用的例子。
自带信息应用
这个界面既可以上下卷动,也可以左右滑动拉出发送时间。
P.S. 气死宝宝了,我做了一组精美的 gif,但是大小都超出简书限制…..无语,大家就脑补一下效果吧。
这个效果大体看一下就非常像一个很大的 ScrollView,可以四个方向都能滑动。但是 UITableView 只能上下滚动,硬要修改那就是大手术,不推荐这样做。因此我想到的方法是先创建一个 ScrollView,将其 contentSize 设置为 TableView 的 contentSize,并将其宽度再设置大一个像素,这样左右方向也可以滑动了。然后监听 ScrollView 的滚动事件,将其 contentOffset.y 绑定到 TableView 的 contentOffset.y 上, 那么 contentOffset.x 就可以来设置每个 cell 的内部效果了。
下面我们看看代码:
前半部分很简单,就是一个 TableView 的初始化,下面是我们的重点,我创建了一个 UIScrollView,让其 frame 与 TableView 的一致,Inset 也需要一致,然后设置代理来监听滚动事件。
那么最后一句是什么意思呢?
因为 ScrollView 会拦截其下面的 View 的触摸事件,这样我们的 Cell 就无法被选中了。因此我们必须让 ScrollView 的 userInteractionEnabled 属性为 false,这样它就不响应并拦截触摸事件了,但是谁来让它滑动呢?好在 iOS 把它内部的一个 UIPanGestureRecognizer 开放了出来,我们就可以将其嫁接到 TableView 的身上,这样 TableView 就既可以响应点击,也可以响应滚动了。
紧接着,我们需要知道 TableView 的内容有多大,这个大小需要计算,那么什么时候这个大小会被计算完呢?就是在下面这个代理方法被调用时:
我们更新 ScrollView 的 contentSize。
然后我们监听 ScrollView 的滚动事件:
这就应该很简单了,分别将 x、y 应用到响应的属性即可,y 轴就给 TableView,让其可以上下卷动,x 轴就给每个 cell,让其做自己的处理。
最终效果如下:(不动右键新标签打开)
(囧,图超过了微信的最大限制 2 MB,贴不了,请大家脑补吧 )
实现和上面差不多,开头声明部分一致,代理方法如下:
这里为了实现吸附效果,我用到了 scrollViewWillEndDragging(scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer) 这个方法,它的作用是通知代理用户已经松开手指,现在视图将会以一个速度卷动到一个目标位置,并且这个目标位置是可以用指针修改的。所以我只需判断一下视图将会滚动到什么位置,如果超过一个临界值,就让它完全滚动出来,否则就滚动回去。
本文通过这两个小例子希望能起到抛砖引玉的作用,其实许多效果的实现都可以牵扯到 ScrollView 的运用。最后还是推荐大家关注一下 WWDC,很多 Session 都很有启发性。
参考 Session:
WWDC 2014 – Session 235: Advanced Scrollviews and Touch Handling Techniques
WWDC 2013 – Session 217: Exploring Scroll Views on iOS 7
WWDC 2012 – Session 223: Enhancing User Experience with Scroll Views
WWDC 2011 – Session 104: Advanced ScrollView Techniques
iOS UIScrollView 你可能不知道的奇技淫巧的更多相关文章
- [iOS翻译]《iOS 7 Programming Pushing the Limits》系列:你可能不知道的Objective-C技巧
简介: 如果你阅读这本书,你可能已经牢牢掌握iOS开发的基础,但这里有一些小特点和实践是许多开发者并不熟悉的,甚至有数年经验的开发者也是.在这一章里,你会学到一些很重要的开发技巧,但这仍远远不够,你还 ...
- iOS开发——swift——swift与OC之间不得不知道的21点
swift与OC之间不得不知道的21点 自6月的WWDC大会上由苹果的大神Chris Lattner向我们首次展示swift至今已经大半年时间了,虽然绝大部分软件公司代码里还都见不到一丁点swif ...
- [转载]或许您还不知道的八款Android开源游戏引擎
或许您还不知道的八款Android开源游戏引擎 分类: 技术文章 2010-08-04 20:27 17430人阅读 ...
- 你所不知道的 CSS 阴影技巧与细节
关于 CSS 阴影,之前已经有写过一篇,box-shadow 与 filter:drop-shadow 详解及奇技淫巧,介绍了一些关于 box-shadow 的用法. 最近一个新的项目,CSS-Ins ...
- 你所不知道的 CSS 阴影技巧与细节 滚动视差?CSS 不在话下 神奇的选择器 :focus-within 当角色转换为面试官之后 NPOI 教程 - 3.2 打印相关设置 前端XSS相关整理 委托入门案例
你所不知道的 CSS 阴影技巧与细节 关于 CSS 阴影,之前已经有写过一篇,box-shadow 与 filter:drop-shadow 详解及奇技淫巧,介绍了一些关于 box-shadow ...
- 【CSS】346- 你所不知道的 CSS 阴影技巧与细节
偷懒了1个多礼拜,在工作饱和的情况下,怎么坚持学习?今天的分享来自@Coco国服第一切图仔,我们聊聊CSS属性box-shadow- 关于 CSS 阴影,之前已经有写过一篇,box-shadow 与 ...
- 你所不知道的setInterval
在你所不知道的setTimeout记载了下setTimeout相关,此篇则整理了下setInterval:作为拥有广泛应用场景(定时器,轮播图,动画效果,自动滚动等等),而又充满各种不确定性的这set ...
- 你所不知道的setTimeout
JavaScript提供定时执行代码的功能,叫做定时器(timer),主要由setTimeout()和setInterval()这两个函数来完成.它们向任务队列添加定时任务.初始接触它的人都觉得好简单 ...
- 你可能不知道的陷阱, IEnumerable接口
1. IEnumerable 与 IEnumerator IEnumerable枚举器接口的重要性,说一万句话都不过分.几乎所有集合都实现了这个接口,Linq的核心也依赖于这个万能的接口.C语言的 ...
随机推荐
- C语言学习总结(四) 剩余内容
第六章.剩余内容 (预处理指令,宏定义,条件编译,文件操作) 预处理指令 简单的来说就是在程序编译之前需要做的事情 1.宏定义 概念: 是一个替换代码的预处理指令,可以在编译之前进行代码替换(宏展开, ...
- POJ 3041 Asteroids 最小点覆盖 == 二分图的最大匹配
Description Bessie wants to navigate her spaceship through a dangerous asteroid field in the shape o ...
- python获取本地ip地址的方法
#_*_coding:utf8_*_ #以下两种方法可以在ubuntu下或者windows下获得本地的IP地址 import socket # 方法一 localIP = socket.gethost ...
- Let's go home
hdu1824:http://acm.hdu.edu.cn/showproblem.php?pid=1824 题意:中文题. 题解:这一题建边要考虑两个限制条件,一个是队伍内部的,就是假如说 a,b, ...
- 几个字符串的误区,以及setlocale函数的使用
转自 http://www.blogjava.net/baicker/archive/2007/08/09/135642.html 转自 http://witmax.cn/character-enco ...
- Qt 窗体的模态与非模态(setWindowFlags(Qt::WindowStaysOnTopHint);比较有用,还有Qt::WA_DeleteOnClose)
概念 模态对话框(Modal Dialog)与非模态对话框(Modeless Dialog)的概念不是Qt所独有的,在各种不同的平台下都存在.又有叫法是称为模式对话框,无模式对话框等. 1. 模态窗体 ...
- iframe详细用法
<iframe>是框架的一种形式,也比较常用到. 例子1.<iframe width=420 height=330 frameborder=0 scrolling=auto src= ...
- Unity Kajiya Hair Shader Mod by Normals
Shader "HairShader" { Properties { _MainTex ("Diffuse (RGB) Alpha (A)", 2D) = &q ...
- HTML---网页编程(2)
前言 接着前面的HTML-网络编程1)来学习吧~~~ 色彩的表示 在计算机显示器中,使用红(red).绿(green).蓝(blue)3种颜色来构成各种各样的颜色.颜色的种类有16,256及65536 ...
- Android定义的路径全局变量
Android定义的路径全局变量 ifeq (,$(strip $(OUT_DIR))) OUT_DIR := $(TOPDIR)out endif DEBUG_OUT_DIR := $(OUT_DI ...