在上一话中我们创建了一个通过URL读取图片的Demo,这个Demo是不能拖动和缩放的。如今给它添加选项让它能够手动切换URL,并把图片加入到ScrollView中。
向Storyboard中拖入一个splitviewController。把ImageViewController作为detail视图,把project中自带的那个viewcontroller作为rootview,如今storyboard中的场景如图:
如今执行一下:
点击back能够切换到主界面,眼下这个界面是空的。我们须要向当中添加一些功能button。添加三个button分别获取模型中的三张图片,而且调整自己主动布局:
然后我们须要做的是建立过渡。
按住control键拖动button到ImageViewController,选择show detail segue,分别命名为fengjing1、fengjing2、fengjing3。在viewController中设置过渡方法:
import UIKit class ViewController: UIViewController { override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) { if let ivc = segue.destinationViewController as?
ImageViewController,let identifier = segue.identifier{ switch identifier{ case "fengjing1": ivc.imageURL = DemoURL.Fengjing.fengjing1 ivc.title = "风景1" case "fengjing2": ivc.imageURL = DemoURL.Fengjing.fengjing2 ivc.title = "风景2" case "fengjing3": ivc.imageURL = DemoURL.Fengjing.fengjing3 ivc.title = "风景3" default:break } } } }
如今来执行试试,你会发现点击全部button依旧仅仅显示默认的图片,这是怎么回事呢?
这是由于我们之前在viewDiaLoad中添加了測试代码。如今把測试代码删掉。
再次执行你会看到初始化打开的页面上没有照片,返回到主页面点击button选择照片,由于图片非常大,button会卡顿,在图片载入完毕后才会跳转到照片的显示页面。
在如今ImageViewController中拖拽一个scrollview,点击约束中的reset to suggested Constraints。
然后把图片放到这个滚动视图中,在代码中生成滚动视图的outlet。
首先要改动的地方是viewDidLoad方法,imageView不再放到view中而是放到scrollview中:
override func viewDidLoad() { super.viewDidLoad() scrollview.addSubview(imageView) }
其次不论什么图片发生变化的地方都须要改动scrollview的尺寸,由于我们须要scrollview一直保持和它上面的imageview同样的尺寸:
outlet中:
@IBOutlet weak var scrollview: UIScrollView!{ didSet{ scrollview.contentSize = imageView.frame.size } }
计算属性image的定义中:
private var image:UIImage? { get {return imageView.image} set { imageView.image = newValue imageView.sizeToFit() scrollview?.contentSize = imageView.frame.size } }这里在scrollview尾部添加?是由于在图片变动时不能保证scrollview存在,而oulet和viewDidLoad方法中使用scrollview不用加?是由于在两种情况中scrollview是肯定存在的,这也是保护程序不异常退出的有效方法。如今来执行一下试试,点击button时依然非常慢。可喜可贺的是我们能够拖动图像了。
显然如今我们须要加入缩放方法,加入缩放的最好位置是在scrollview的outlet中。记得我们之前讲过的使用方法首先让ImageViewController遵守scrollview的代理,然后改动例如以下outlet:
@IBOutlet weak var scrollview: UIScrollView!{ didSet{ scrollview.delegate = self scrollview.maximumZoomScale = 1.0 scrollview.minimumZoomScale = 0.05 scrollview.contentSize = imageView.frame.size } }
由于scrollview的代理方法是OC风格的,所以即便你没有实现代理方法,也不会报错,如今我们实现须要的代理方法.
选择须要进行缩放的视图,显然是我们的imageView
func viewForZoomingInScrollView(scrollView: UIScrollView) -> UIView? { return imageView }
如今执行,然后按住option键能够模拟两个手指的缩放操作,效果例如以下: