【我们都爱Paul Hegarty】斯坦福IOS8公开课个人笔记30 ScrollView Demo实战

在上一话中我们创建了一个通过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键能够模拟两个手指的缩放操作，效果例如以下：