先上效果图吧,框框被限制在了image内了。

这个feature我把它用在了我的app里了,博客写得不容易,来star下啦? https://github.com/Imputes/Nike-Collection/

就好像Ray Wenderlich的iOS Apprentice一书说的一样,要实现任何feature都要列个任务清单。所以我们先列个任务清单:

1. 实现把一个可拖动的View限制在一个特定的View里。

2. 实现把框到的image放大。

首先讲第一点:

既然要实现拖动的feature,Google之后就知道Cocoa Touch框架里的UIKit module里有一个UIPanGestureRecognizer类,有了这个类之后就可以实现拖拽feature了。

那么Google之后又知道了有两种方式:

一种是纯代码(在要放大的View所在的controller里或者view里, 在willAppear时刻或者didLoad时刻或者layoutSubView时刻写上, xxxView是拖拽的View):

let panGesture = UIPanGestureRecognizer.init(target: self, action: #selector(handlePan(sender: )))
xxxView.addGestureRecognizer(panGesture)

之后再在放大的View所在的类中写selector, 就是观察者panGestureRecognizer观察到被观察者(在这里是要拖拽的View)的变化之后执行的function。

@objc func handlePan(sender: UIPanGestureRecognizer) {
...
}

另一种是直接在storyboard里面拖panGesture到要拖拽的view上即可,再用IBAction连接到代码里,这个Action里写的东西和前面的handlePan一样。

那么如何限制在所在view里呢?

Easy playing! 只要在action里添加(assistView是铺在上面的UIView,):

let transition = sender.translation(in: self.assistView)let changeX = (sender.view?.center.x)! + transition.xlet changeY = (sender.view?.center.y)! + transition.yvar limitCenter = CGPoint.init(x: changeX, y: changeY)limitCenter.y = max((sender.view?.frame.size.height)! / 2, limitCenter.y)limitCenter.y = min(self.assistView.frame.size.height - (sender.view?.frame.size.height)! / 2, limitCenter.y)limitCenter.x = max((sender.view?.frame.size.width)! / 2, limitCenter.x)limitCenter.x = min(self.assistView.frame.size.width - (sender.view?.frame.size.width)! / 2, limitCenter.x)sender.view?.center = limitCentersender.setTranslation(CGPoint.zero, in: self.assistView)

到了这一步之后就可以把这个view限制在imageView里了。

至此第一步实现。

那么第二步就简单了(因为可以直接Google到),

在所在类里写上这两个functions:

private func snapshotTargetView(view: UIView!, inRect rect: CGRect!) -> UIImage! {let scale = UIScreen.main.scale//Snapshot of viewUIGraphicsBeginImageContextWithOptions(rect.size, false, scale)UIGraphicsGetCurrentContext()?.translateBy(x: -rect.origin.x, y: -rect.origin.y)view.layer.render(in: UIGraphicsGetCurrentContext()!)//Need this to stop screen flashing, but it's slowerlet snapshotImage = UIGraphicsGetImageFromCurrentImageContext()UIGraphicsEndImageContext()return snapshotImage}private func resizeImage(image: UIImage, toNewSize newSize:CGSize) -> UIImage {let scale = UIScreen.main.scaleUIGraphicsBeginImageContextWithOptions(newSize, false, scale)image.draw(in: CGRect(x:0, y:0, width:newSize.width, height:newSize.height))let newImage = UIGraphicsGetImageFromCurrentImageContext()UIGraphicsEndImageContext()return newImage!
}

再在Action里加上这两句(resultImageView是放大后要put的地方):

 let transition = sender.translation(in: self.assistView)let changeX = (sender.view?.center.x)! + transition.xlet changeY = (sender.view?.center.y)! + transition.yvar limitCenter = CGPoint.init(x: changeX, y: changeY)limitCenter.y = max((sender.view?.frame.size.height)! / 2, limitCenter.y)limitCenter.y = min(self.assistView.frame.size.height - (sender.view?.frame.size.height)! / 2, limitCenter.y)limitCenter.x = max((sender.view?.frame.size.width)! / 2, limitCenter.x)limitCenter.x = min(self.assistView.frame.size.width - (sender.view?.frame.size.width)! / 2, limitCenter.x)sender.view?.center = limitCentersender.setTranslation(CGPoint.zero, in: self.assistView)// add this two lineslet imges = snapshotTargetView(view: self.productImageView, inRect: sender.view?.frame)resultImageView.image = resizeImage(image: images!, toNewSize: resultImageView.frame.size)

OK了?。

效果:

转载于:https://www.cnblogs.com/zhuzi1995/p/8592531.html

Swift 4 放大镜功能实现相关推荐

  1. [COCOS2DX-LUA]0-001.利用ClippingNode实现放大镜功能

    用过Iphone的都知道,Iphone在定位光标位置的时候会把内容进行放大,这样我们就能很快的把光标移动到指定的位置.那么在我们的Cocos2dX的游戏中,怎么可以实现这种功能呢.起先我就是想起了Ip ...

  2. unity实现小地图和放大镜功能

    在project中右键创建render Texture,然后右键在UI里创建RawImage,把render Texture拖进去 然后创建一个相机把render Texture拖进去 然后左上角就出 ...

  3. WIndows 10 MFC 调用放大镜功能

    1.首先判断是否为Win 10系统:这个需要添加Version.lib 库 BOOL IsFileVersionWindows10OrGreater()//判断是否为Win10系统,Version.l ...

  4. 【源码】具有“放大镜”功能的函数magnify

    本函数可以通过鼠标控制来弹出放大镜查看2D图片的细节. Turns the mouse into a pop-up magnifying glass to look at details of 2D ...

  5. idea设置放大缩小_苹果手机连按3下,能打开隐藏放大镜功能,看什么都一清二楚...

    苹果手机很多人都在用,那你们有多少人知道手机里面还隐藏一个放大镜功能,可以看的清楚.看的远. 要是你没用过,今天笔者就来教教你使用方法,一起来涨涨知识吧! 看得远 我们都知道人的视线比较有限,尤其是近 ...

  6. 小功能解决小麻烦,福昕PDF阅读器仿真放大镜功能详解

    在日常工作学习及娱乐总有遇到PDF文档不放大字看不清楚,放大了又需要拖来拖去的情况,十分的麻烦.其实这种麻烦只需要一个小功能就可以解决,那就是福昕阅读器中的"仿真放大镜",使用起来 ...

  7. 原生JS实现放大镜功能

    原生JS实现的放大镜功能,自己写的,简单使用 点击下面连接去我的github上下载出来打开就行,不需要复杂配置,在img标签的src属性把你自己的图片换上去就ok. 文件在此 走过路过,喜欢的话点个赞 ...

  8. js仿淘宝主图放大镜功能

    js仿淘宝主图放大镜功能 演示地址 下载地址

  9. vue中如何实现图片放大镜功能

    vue中图片放大镜功能 1.在vue项目中不可避免的会做一个图片放大镜的弄能(例如.商城.店铺等),今天同事问了这个功能恰好以前写过,因此记录一下. 2.废话不多说直接上代码: 父组件中: <t ...

最新文章

  1. 二级域名用asp.net 2.0的实现方案
  2. linux rpm目录,Linux修改RPM的安装目录的方法
  3. python用途与前景-Python 未来发展前景怎么样?
  4. hbase开发环境搭建及运行hbase小实例(HBase 0.98.3新api)
  5. shell高级(一)
  6. tensorflow 读取cifar_浅入浅出TensorFlow 4 - 训练CIFAR数据
  7. Using Headless Mode in the Java SE Platform--转
  8. Linux之bash shell基本命令
  9. iOS 11更新第6个开发者测试版,变化最大的竟然是App Store标识
  10. 关于Unity中Mesh网格的详解
  11. Java应用怎么打包发布_myeclipse中java应用程序打包发布步骤
  12. mysql定制化_【MySQL技巧】定制你的MySQL命令行
  13. linux安装软件imagemagick,Linux系统中怎么安装和使用ImageMagick软件?
  14. PYTHON_错误处理
  15. linux命令查bin中所有变量名,Linux--文件查找命令
  16. 多个线程并发执行完成后再执行主线程-java(有点内容版)
  17. leaflet报错:map container is already initialized
  18. mysql面试必会6题经典_经典sql面试题及答案第7期
  19. 调用新浪接口查询IP地址
  20. 实战:第十五章:摸爬滚打这些年的心路历程

热门文章

  1. 使用CStdioFile::ReadString来逐行读取文件
  2. 定义了Circle圆形类,在此基础上派生出Cylinder圆柱体类。 Circle圆形类定义如下: class Circle { public: Circle(double r):radius(r
  3. 信息安全密码技术--栅栏密码
  4. presentViewController: 如何不覆盖原先的 viewController界面
  5. 数据挖掘:数据(数据的基本统计描述)
  6. 迟到的年终总结,2012-2014
  7. python大气校正_全自动多源遥感影像大气校正方法
  8. Java 自动类型转换,强制类型转换
  9. 苹果xr截屏怎么截_原来苹果手机自带长截屏功能!以前一直不知道,真让人相见恨晚...
  10. Python | 人脸识别系统 — 活体检测