让效果动起来:在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。

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中看到你的动画的运行效果:

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


额外提示:

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

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

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥ios动画全貌。在这里你可以看...
    每天刷两次牙阅读 8,551评论 6 30
  • 在iOS中随处都可以看到绚丽的动画效果,实现这些动画的过程并不复杂,今天将带大家一窥iOS动画全貌。在这里你可以看...
    F麦子阅读 5,141评论 5 13
  • 我上车的时候,他就已经沉沉入睡。不到一岁的小人,随时准备陷入睡眠,怕也只有这时才如此乖巧安静。他整个小身体全都伏在...
    玛尼纳尼阅读 1,211评论 0 3
  • 不找小姐
    文字苏梦阅读 132评论 0 0
  • 2017年1月19日 星期四 【早起】5:10 【读经】通读《易经》20-40卦,21分钟 【锻炼】抡胳膊100下...
    易道大明阅读 313评论 0 0