让效果动起来:在Xcode7中使用Playgrounds做原型设计

本文由海之号角 (OceanHorn)译自:Get Things Moving: Prototyping Animations in Playgrounds with Xcode 7

在iOS中使用动画是一件非常美妙的事,但是当需要创建你自己的动画效果时将是一件非常消耗时间的乏味的事情。本文将向你展示怎样使用Playground跳过运行项目快速搭建动画原型。

在Playground之前,要查看某个效果你必须每次都重新运行整个项目以便去检查动画的运行效果,越庞大的项目消耗的时间也越长。

幸运的是,现在有了更好的方式。

Playgrounds是一个轻量级的交互编程环境,它使得我们能够免于创建一个新的Xcode工程的麻烦来体验和探索Swift和iOS SDK。

使用Playgrounds你可以快速的创建和优化动画效果,并且能够很快的得到效果正确与否的可视化的反馈。按照下面的步骤开始尝试吧。

步骤:

1. 在Xcode中从start menu种选择“Get started with a playground”或者按下“⌥⇧⌘N”创建一个新的playground。

让效果动起来:在Xcode7中使用Playgrounds做原型设计_第1张图片

2.在顶部输入“import XCPlayground”,以便导入XCPlayground模块。这将使你能够通过playground与Xcode做交互。

import XCPlayground

3.添加一个容器视图。你的动画效果将在它里面展示。

letcontainerView=UIView(frame: CGRect(x:0, y:0, width:400, height:400))

containerView.backgroundColor=UIColor.whiteColor()

4.设置containerView为liveView。

XCPlaygroundPage.currentPage.liveView=containerView

5.打开assistant editor。

6.开始创建你的动画效果吧!这里是一个非常简单的示例,你可以使用CoreAnimation和其他API来创建更复杂的动画效果。

let square = UIView(frame: CGRect(x: 50, y: 50, width: 100, height: 100))

square.backgroundColor = UIColor.blueColor()

containerView.addSubview(square)

UIView.animateWithDuration(2.0) {

    square.backgroundColor = UIColor.redColor()

    square.frame = CGRect(x: 200, y: 200, width: 50, height: 50)

}

7.完成后你会在assistant editor中看到你的动画的运行效果:

让效果动起来:在Xcode7中使用Playgrounds做原型设计_第2张图片

这就是开篇时讲的创建动画效果的绝妙方式。你可以在这里找到所有的代码。


额外提示:

1.如果想要重新运行动画只需要改变playground中的任何一处即可,比如在结尾处增加一行新的空行;或者从菜单中找到Editor > Execute Playground;或者点击在playground底部的按钮:

但是,我的习惯是增加一个新的快捷键来执行Execute Playground,可以在Xcode > Preferences > Key Bindings > 搜索execute,然后增加一个快捷键即可。

你可能感兴趣的:(让效果动起来:在Xcode7中使用Playgrounds做原型设计)