IOS ScrollView放大缩小点击位置并居中
项目中的一个优化案例,提升用户体验,对地铁线路图点击放大、缩小,并且点击位置居中;
正常ScrollView 我们点击某一点比如屏幕右侧,想要点的位置向左移动到中心位置,很简单只有算出该点位置距中心位置的距离:point.x - contentOffset.x -SCREEN_WIDTH*0.5,然后问设置contentOffset.x+相应的距离即可。上下也同理.
但是这里要处理的双击 放大的同时,也要实现上面的效果。经过单步调试,查看
- (void)scrollViewDidScroll:(UIScrollView *)scrollView 代理方法的log:
NSLog(@"%f--%f -%f",scrollView.contentOffset.x,scrollView.contentOffset.y,scrollView.zoomScale);
发现移动移动图上的某一点到达屏幕的边界contentOffset.x变化与缩放倍数成正比!!!正比!!!
在根据简单版的居中原理的方法,应用到缩放后的ScrollView中,所有相关参数都*相应的缩放倍数!!正比关系记得。
下面是具体实现代码 :(PS 有更好更简单实现方法欢迎提供交流,本文描述有不当处欢迎指正谢谢!!)
- (void)showPointToCenterWithPoint:(CGPoint)pt withZoomScale:(CGFloat)zs{
[UIView animateWithDuration:0.3 animations:^{
__block CGPoint point = pt;
_baseScrollView.zoomScale = zs;
CGFloat offsetX = _baseScrollView.contentOffset.x*zs;
CGFloat offsetY = _baseScrollView.contentOffset.y*zs;
CGFloat contentW = _baseScrollView.contentSize.width;
CGFloat contentH = _baseScrollView.contentSize.height;
CGFloat x = ;
CGFloat y = ;
point = CGPointMake(point.x*zs, point.y*zs);
//右侧
if (offsetX + SCREEN_WIDTH < contentW && (point.x - offsetX) > SCREEN_WIDTH*0.5) {
//居中所要移动的距离:(point.x - offsetX)-SCREEN_WIDTH*0.5) ;移动后 还没有超过边界即满足居中
if ((offsetX + (point.x - offsetX)-SCREEN_WIDTH*0.5) + SCREEN_WIDTH < contentW) {
x = offsetX + (point.x - offsetX)- SCREEN_WIDTH*0.5;
}else{
//不满足居中
x = offsetX + (contentW - offsetX - SCREEN_WIDTH);
}
}else{
//左侧 满足居中
if (offsetX - (SCREEN_WIDTH*0.5 - (point.x - offsetX))>=) {
x = offsetX - (SCREEN_WIDTH*0.5 - (point.x - offsetX));
}else{
x = ;
}
}
//下侧
if (offsetY + SCREEN_HEIGHT < contentH && (point.y - offsetY) > SCREEN_HEIGHT*0.5) {
if ((offsetY + (point.y - offsetY)-SCREEN_HEIGHT*0.5) + SCREEN_HEIGHT < contentH) {
y = offsetY + (point.y - offsetY)- SCREEN_HEIGHT*0.5;
}else{
y = offsetY + (contentH - offsetY - SCREEN_HEIGHT);
}
}else{
if (offsetY - (SCREEN_HEIGHT*0.5 - (point.y - offsetY)) >= ) {
y = offsetY - (SCREEN_HEIGHT*0.5 - (point.y - offsetY));
}else{
y = ;
}
}
[_baseScrollView setContentOffset:CGPointMake(x, y)animated:NO];
} completion:^(BOOL finished) {
}];
}
IOS ScrollView放大缩小点击位置并居中的更多相关文章
- IOS UIView 放大缩小
/创建缩小了的视图myWeiBoImageVC = [[UIViewController alloc] init];myWeiBoImageVC.view.clipsToBounds = YES;my ...
- 猫猫学IOS(二)UI之button操作 点击变换 移动 放大缩小 旋转
不多说,先上图片看效果,猫猫分享.必须精品 原创文章.欢迎转载.转载请注明:翟乃玉的博客 地址:viewmode=contents">http://blog.csdn.net/u013 ...
- AJ学IOS(02)UI之按钮操作 点击变换 移动 放大缩小 旋转
不多说,先上图片看效果,AJ分享,必须精品 这个小程序主要实现点击方向键可以让图标上下左右动还有放大缩小以及旋转的功能,点击图片会显示另一张图片. 点击变换 其实用到了按钮的两个状态,再State C ...
- [jQuery]地图浏览:如何实现图片的放大缩小和点击之后的位置居中
HTML代码: <!DOCTYPE html> <html> <head> <script src="http://ajax.googleapis. ...
- 实现类似于QQ空间相册的点击图片放大,再点后缩小回原来位置
前几天看到了有人在android5.0上实现了如下图一样的效果,我自己就去搜了下.参考了国外一篇文章和国内的一篇文章,最终实现了想要的效果.具体参考的网址我已经贴到文章末尾,大家可以去英文的那个网站看 ...
- Android 实现类似于QQ空间相册的点击图片放大,再点后缩小回原来位置
前几天看到了有人在android5.0上实现了如下图一样的效果,我自己就去搜了下.参考了国外一篇文章和国内的一篇文章,最终实现了想要的效果.具体参考的网址我已经贴到文章末尾,大家可以去英文的那个网站看 ...
- 解决mxGraph放大/缩小在非IE浏览器下overlay图标位置不变化的问题
首先要创建一个工具栏.并为工具栏中的放大.缩小button定义事件. <div id="toolbar" style="float:left;margin-top: ...
- scrollview里面多张图片,每张都能放大缩小
http://blog.sina.com.cn/s/blog_5d68044001018s1n.html scrollview里面多张图片,每张都能放大缩小 - (void)viewDidLoad{ ...
- wxParse解析富文本内容使点击图片可以选中并实现放大缩小
wxParse解析富文本内容不多说,之前写过步骤介绍,主要是在使用过程中发现解析的富文本内容里有图片时有的可以点击放大缩小,有的点击却报错,找不到imgUrls. 经过排查发现:循环解析的富文本内容正 ...
随机推荐
- .htaccess详解及.htaccess参数说明【转】
目录(?)[-] htaccess 详解 htaccess rewrite 规则详细说明 RewriteEngine OnOff RewriteBase URL-path RewriteCond Te ...
- rsync一些安全的使用方法
总的来说,开在873端口之后,只要加上验证口令,安全性就有保障了,但毕竟多开一个端口,而且rsync的密码是明文方式存储的,相对来说,还是有被监听的可能.根据不同的情况采用下述不同方案,相对来说,安全 ...
- 动态规划VS分治策略
•在用分治法解决问题时,由于子问题的数目往往是问题规模的指数函数,因此对时间的消耗太大. •动态规划的思想在于,如果各个子问题不是独立的,不同的子问题的个数只是多项式量级,而我们能够保存已经解决的子问 ...
- python 中locals() 和 globals()
1.locals() 和 globals() 是python 的内建函数,他们提供了字典的形式访问局部变量和全局变量的方式. 示例代码: def test(arg): a=1 b=2 data_dic ...
- 记账类APP竞品分析-挖财与随手记
注:本文更新中. 一.概览 1. 产品名称及版本 l 挖财11.2.0.0 免费版(2016/9/6发布) l 随手记10.2.8免费版(2016/8/22发布) 2. 设备信息 设备型号:i ...
- Android之ScrollView嵌套ListView和GridView冲突
由于ListView,GridView本身都继承于ScrollView,一旦在ScrollView中嵌套ScrollView, 在ScrollView中嵌套使用ListView或者GridView,L ...
- EXTJS4.2中neptune主题的使用
原文地址:http://blog.csdn.net/xieguojun2013/article/details/8880519 最近在在sencha.com官网了解到EXTJS的最新版本里增加了新的主 ...
- Strategy - 策略模式
策略模式: 定义了算法族,分别封装起来,让它们之间可以互相替换,此模式让算法的变化独立于使用算法的客户.public interface FlyBehavior { public void fly() ...
- Git远程仓库(github
一.创建远程仓库(github) 首先到https://github.com注册一个账号,创建自己的Git,点击repositories,再点new 名字自定义,比如叫fansik,选择public点 ...
- android Handler.btionMessage()与Message.obtain()的区别
类概述 定义一个包含任意类型的描述数据对象,此对象可以发送给Handler.对象包含两个额外的int字段和一个额外的对象字段,这样可以使得在很多情况下不用做分配工作. 尽管Message的构造器是公开 ...