《iOS高级应用开发技术》实验报告七详细答案

实验编号:7四川师大《IOS应用开发技术》实验报告2017年11月9日计算机科学学院2015级实验名称：Calculator指导老师：_李贵洋__ 实验成绩:_____实验七Calculator一、目的要求：通过实现一款功能完整的Calculator，掌握MVC的主要思想；二、实验内容：(1)参照Stanford视频1和2完成一个Calculator的制作；(2)在(1)的基础上进一步完成Stanford作业1的完整要求。

(3)采用autolayout的stackview和约束实现一下布局：3、主要仪器设备及药品：iMac（Mac OS、XCode）三、实验主要流程、基本操作或核心代码、算法片段（该部分如不够填写，请另加附页） 代码：ViewController.swift :// ViewController.swift// text7//// Created by wu on 2017/11/9.// Copyright 2017年2015110445. All rights reserved.//import Cocoaclass ViewController: NSViewController {@IBOutlet weak var display: NSTextFieldCell! //显示值的文本框var isUerTyping = false //判断用户是否正在输入override func viewDidLoad() {super.viewDidLoad()// Do any additional setup after loading the view.//更改窗口背景图片let image = NSImage(named: "timg")let imageView = NSImageView(image: image!)imageView.frame = self.view.boundsself.view.addSubview(imageView, positioned: NSWindo wOrderingMode.below, relativeTo: self.view)//设置文本框不可编辑display.isEditable = false}//输入值(数组按钮和.按钮)@IBAction func setValue(_ sender: NSButton) {if isUerTyping {let title = sender.titleif title != "." || !display.title.contai ns(".") {display.title += title}} else {display.title = sender.titleisUerTyping = true}}//文本框中的显示值var displayValue: Double {get {return Double(display.title)!}set {display.title = String(newValue)}}//实例化一个计算器的模型private var operat = Operation()//进行计算(特殊字符按钮)@IBAction func operation(_ sender: NSButton) {//先将文本框中的内容保存到结构体实例中if isUerTyping {operat.setOperand(operand: displayValue)isUerTyping = false}//再进行计算operat.performCalculation(symbol: sender.title)//最后显示结果if let result = operat.result {displayValue = result}}override var representedObject: Any? {didSet {// Update the view, if already loaded.}}}Result.swift:// Result.swift// text7// Created by wu on 2017/11/9.// Copyright 2017年2015110445. All rights reserved.//import Foundationstruct Operation {private var accumulator: Double? //保存值//枚举出特殊符号的计算方法private enum Operations {case constant(Double) //常量case unaryOperation((Double) -> Double) //一元运算case binaryOperation((Double, Double) -> Double) //二元运算case equals //等于，输出结果}//特殊符号计算方法的具体实现private var operations: Dictionary<String, Operations> = [""√": Operations.unaryOperation(sqrt),"cos" : Operations.unaryOperation(cos),"sin" : Operations.unaryOperation(sin),"+" : Operations.binaryOperation({ $0 + $1}),"−" : Operations.binaryOperation({ $0 - $1}),"×": Operations.binaryOperation({ $0 * $1}),"÷": Operations.binaryOperation({if $1 == 0 {return 0}else {return $0 / $1}}),"=" : Operations.equals]//准备进行二元运算private struct PendingBinaryOperation {let function: (Double, Double) -> Doublelet firstOperan: Doublefunc perform(with secondOperand: Double) -> Doub le {return function(firstOperan, secondOperand) }}//结构体实例，准备进行二元运算private var pendingBinaryOperation: PendingBinaryOperation?mutating func performCalculation(symbol: String) {if let operation = operations[symbol] {switch operation {case .constant(let value):accumulator = value //常量直接设置值case .unaryOperation(let function):if accumulator != nil {accumulator = function(accu mulator!) //一元运算计算后再设置值}case .binaryOperation(let function):if accumulator != nil {pendingBinaryOperation = Pe ndingBinaryOperation(function: function, firstOperan: accumulator! ) //二元运算，先将第一次输入的数据和运算符保存，等待下一次输入accumulator = nil}case .equals:if pendingBinaryOperation != nil&& accumulator != nil {accumulator = pendingBinary Operation?.perform(with: accumulator!) //等号，计算结果pendingBinaryOperation = ni l}}}}mutating func setOperand(operand: Double) {accumulator = operand //设置运算值}var result: Double? {return accumulator //返回结果}}运行结果：布局：第一种布局：1、在Main.stroyboard中向界面拖三个UIView并设置各自的背景颜色；2、先选中三个视图，然后点击Embed In Stack，将三个视图放入一个栈中；3、设置这个栈的参数(Aligment设置为fill，Distribution设置为fill equally，spacing设置为10) ；4、设置相应的约束，使autolayout能识别这三个视图组成的栈的对应位置。

在Stack上按下control键，并拖动鼠标指向View，这时就会有相应的提示框弹出来设置约束，我们这里选择如下三个参数:(Center Horizontally in Safe Area)设置x位置、(Center Vertically in Safe Area)设置y位置、(Equal Widths)设置宽；5、选择Aspect Ratio尺寸比例；6、在右边的尺寸检查器中编辑该约束，将比例设置为1:1，也就是使高度和宽度相等。

如下：第二种布局：对中间三个视图进行布局,先将是三个视图放入栈中，设置间隙和填充方式，然后添加约束1、相对于View的约束和Stack自身的约束选择如下：2、编辑一下约束，设置高度为50，相对于View左边距为10(Leading Space to Safe Area)，相对于View右边距为-10(Trailing Space to Safe Area)3、进行上半部分两个视图的操作。

选中两个视图，然后放入栈中，相应的参数更改如下：4、再设置与View之间的约束、与中间三个视图组成的Stack之间的约束5、修改相应的约束值与View的top之间的间隙为-10，底部与Stack View之间的间隙为10最后结果如下：四、实验结果的分析与评价（该部分如不够填写，请另加附页）答：（1）通过本次试验报告，参照Stanford视频练习了计算器的代码编写，掌握了MVC的一些思想，以及通过autolayout的stackview和约束实现了布局；（2）了解了MVC开始是存在于桌面程序中的，M是指业务模型，V是指用户界面，C则是控制器，使用MVC的目的是将M和V的实现代码分离，从而使同一个程序可以使用不同的表现形式。