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

简介:   在上一话中我们创建了一个通过URL读取图片的Demo,这个Demo是不能拖动和缩放的,现在给它增加选项让它可以手动切换URL,并把图片添加到ScrollView中。

  在上一话中我们创建了一个通过URL读取图片的Demo,这个Demo是不能拖动和缩放的,现在给它增加选项让它可以手动切换URL,并把图片添加到ScrollView中。

向Storyboard中拖入一个splitviewController。把ImageViewController作为detail视图,把工程中自带的那个viewcontroller作为rootview,现在storyboard中的场景如图:


现在运行一下:


点击back可以切换到主界面,目前这个界面是空的,我们需要向其中增加一些功能按钮。增加三个按钮分别获取模型中的三张图片,并且调整自动布局:



然后我们需要做的是建立过渡。

按住control键拖动按钮到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
            }
        
        }
    }
  
}

现在来运行试试,你会发现点击所有按钮依然只显示默认的图片,这是怎么回事呢?

这是因为我们之前在viewDiaLoad中增加了测试代码,现在把测试代码删掉。再次运行你会看到初始化打开的页面上没有照片,返回到主页面点击按钮选择照片,由于图片很大,按钮会卡顿,在图片加载完成后才会跳转到照片的显示页面。


在现在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是肯定存在的,这也是保护程序不异常退出的有效方法。现在来运行一下试试,点击按钮时依旧很慢,可喜可贺的是我们可以拖动图像了。


显然现在我们需要添加缩放方法,添加缩放的最好位置是在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键可以模拟两个手指的缩放操作,效果如下:




目录
相关文章
|
6月前
|
语音技术 开发工具 图形学
Unity与IOS⭐一、百度语音IOS版Demo调试方法
Unity与IOS⭐一、百度语音IOS版Demo调试方法
|
iOS开发
iOS 多个滚动控件嵌套Demo
iOS 多个滚动控件嵌套Demo
90 0
|
iOS开发
iOS UIKit Dynamics Demo 学习地址列表
iOS UIKit Dynamics Demo 学习地址列表
66 0
倒计时15分钟-兼容ios手机效果demo(整理)
倒计时15分钟-兼容ios手机效果demo(整理)
|
JSON 测试技术 Android开发
基于AirTest+Python的ios自动化测试demo(微信朋友圈无限点赞)
AirTest相比Appuim有个好处就是可以对GUI图片进行捕捉和最新版本支持WebView(目前Appuim不支持iOS12的WebView进行Xpath抓取)
660 0
|
测试技术 iOS开发 Python
基于Python+appium的ios自动化测试demo(更新中)
appium环境搭建可参考以下两个链接: www.jianshu.com/p/a2b79cd8b… www.jianshu.com/p/3c04e029c…
480 0
|
传感器 定位技术 vr&ar
iOS 神秘而又强大的传感器系统 (附demo)
iOS中的各种传感器:          随着科技的发展,机器感知人的行为!Goole的无人驾驶汽车到李彦宏的无人驾汽车,都带入了各种计算及传感。         为了研究自然现象和制造劳动工具,人类必须了解外界的各类信息。
2608 0
|
iOS开发
iOS 开发之几个 Demo 分享网站
OSChina 前往 OSChina Code4App 前往 Code4App CocoaChina 前往 CocoaChina 码云 前往码云
3458 0
|
安全 Android开发 iOS开发
iOS隐私安全:用户协议及隐私政策弹框(包含超链接属性、demo支持中英文切换)
iOS隐私安全:用户协议及隐私政策弹框(包含超链接属性、demo支持中英文切换)
1445 1
iOS隐私安全:用户协议及隐私政策弹框(包含超链接属性、demo支持中英文切换)
|
iOS开发
仿IOS弹出框及提示框(含Demo)
仿IOS弹出框及提示框(含Demo)
仿IOS弹出框及提示框(含Demo)

热门文章

最新文章

  • 1
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 2
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
  • 3
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
  • 4
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
  • 5
    【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
  • 6
    iOS8 中无需开源库的内置功能一览
  • 7
    iOS7应用开发7:自定义视图、手势操作
  • 8
    IOS小工具以及精彩的博客
  • 9
    Facebook SDK(iOS)初学讲解
  • 10
    iOS - Swift NSPoint 位置
  • 1
    【01】噩梦终结flutter配安卓android鸿蒙harmonyOS 以及next调试环境配鸿蒙和ios真机调试环境-flutter项目安卓环境配置-gradle-agp-ndkVersion模拟器运行真机测试环境-本地环境搭建-如何快速搭建android本地运行环境-优雅草卓伊凡-很多人在这步就被难倒了
    14
  • 2
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
    28
  • 3
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    34
  • 4
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    29
  • 5
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
    23
  • 6
    uniapp开发ios打包Error code = -5000 Error message: Error: certificate file(p12) import failed!报错问题如何解决
    143
  • 7
    【05】2025年1月首发完整版-篇幅较长-苹果app如何上架到app store完整流程·不借助第三方上架工具的情况下无需花钱但需仔细学习-优雅草央千澈详解关于APP签名以及分发-们最关心的一篇来了-IOS上架app
    235
  • 8
    app开发之安卓Android+苹果ios打包所有权限对应解释列表【长期更新】-以及默认打包自动添加权限列表和简化后的基本打包权限列表以uniapp为例-优雅草央千澈
    90
  • 9
    深入探索iOS开发中的SwiftUI框架
    145
  • 10
    ios样式开关按钮jQuery插件
    60