canvas教程

【干货】Xcode 6 技巧: 矢量图像,代码片段以及其他

字号+ 作者:H5之家 来源:H5之家 2016-03-25 13:05 我要评论( )

CocoaChina前身是全球成立最早规模最大的苹果开发中文站,现致力为所有移动开发者提供资讯服务、问答服务、代码下载、工具库及人才招聘服务

xcode6.jpg

原文:Xcode 6 Tips: Vector Images, Code Snippets and Many More,
译者:yuewang

作为一名开发者,无论你是职业的还是为了兴趣,毫无疑问的是你肯定会花无数的时间坐在显示器前等待你的工程完毕。感觉你正在使用的编程工具得心应手非常重要,因为它们是你的虚拟工作空间和所有工作条件的组成部分。当我说“所有”,我指的是:从你选择来作为工具的应用,一直到你把最后的可用的配置运用于它们身上。毫无疑问,一个友好的环境可以增强你的表现;一个不那么友好的,没有定制化的编程工具会起到相反的效果,从而你的生产率会急剧减少。例如,当你使用“冰冷无情”的工具且不能改变它的展示配置时,你可能会感到厌烦,或者因为字体太小而感觉到视觉疲劳,或者因为不可能配置自己的组合键而不得不使用鼠标。

希望以上我已经把我的观点解释清楚了,现在让我把它更具体化。作为一个iOS(或者Mac)开发者,很可能都是使用Xcode作为首要IDE(Integrated Development Environment)来开发工程。我之所以说可能是因为也存在其他的可选工具来代替Xcode。尽管如此,因为大部分的开发者都是使用Xcode,我将着重介绍。不管怎样,Xcode是一款非常强大的IDE,拥有数不清的选项和可能性,在第六版本(截止写这篇文章的时间时)几乎没有其他IDE没有的东西。每一个新版本都会带来新的特性,使开发者使用更方便。但是,我们也不得不承认Xcode也不是完美的;它也有瑕疵,有些甚至很烦人。但是尽管如此,它仍然是个很棒的工具,而且庆幸的是,通过每个新的迭代,苹果都非常努力的来终止所有的瑕疵和bugs。简短的说,尽管有些瑕疵,Xcode也还是一款很强大的使用工具。

Xcode,同一些其他的编程工具一样,由一些预定义的配置组成。只要它被安装了,从首次使用它的初始状态就服务于大部分的开发者。毫无疑问,Xcode有一系列强大的功能, 对于一些新开发者或者首次使用者可能会看着很困惑。显然,事实就是并非每个人都会用到所有的选项。例如,如果你不使用版本控制,你将可能永远都不会使用相关功能。或者,除非你开发一个非常大的工程,你可能永远都不会使用bots来测试。但是,无论你会不会使用一些功能,你必须承认一件事:Xcode并不是一成不变的,它是可以通过很多种方法来定制化的,所以当你使用它的时候会感到很方便舒适,同时也会变的很有产出。

正如你想的,这篇教程并不会像普通教程那样,今天会讨论新的编程话题。我们将会更多处理一些“轻量级”的东西,但请相信我,这是长久以来我一直想写下来的一篇非常重要的课题。接下来的部分我的目标包括:

简言之,这个教程介绍了Xcode在审美观上的,编程上的和使用水平上的定制化。让我强调一下,Xcode肯定有比我等一下将要展现给你的东西多的多的特性,但是我们即将介绍的都是最普通的调整(如果允许我这样说的话)而且你将非常有必要这么做。因此,如果你仍然对上面说的感兴趣,来吧跟我们一起;我们将起飞了!

Creating a Sample Project

在这个教程里我不会给你一个初始工程来上手,我们也不会从头开始创建一个复杂工程。我们将会创建一个有两个labels 和一个image view的非常简单的工程,这样我们就可以看到接下来将会应用的东西。 然而,你可以点击这里下载我们后面将会需要的资源压缩文件。 当你下载并解压缩文件后你将会发现以下东西:

1.一些你可选择性使用的字体. 除此之外,你可以使用和下载你自己的,但是这部分我们将会在后续进行更多讲解。

2.一个叫FlatUI.clr的文件,包含了自定义调色板里的所有颜色。

3.一个PDF文件,包含了一个矢量图。

现在,让我们专注于必须创建的简单demo工程。就像我说的,我们的工程里不会包含特别难的东西,除此之外我们也不会设计一个复杂的界面。我们会一步一步的看清所有的步骤,从在Xcode里创建开始吧。

在第一步里,确保在工程模板里选择 Single View Application选项。接下来,选择Swift 作为偏爱的语言然后给工程取个自己喜欢的名字。我自己命名的是TipsTricks。最后,保存好后就准备做一些配置了吧。

现在到Xcode中,找到 Project Navigator 然后点击Main.storyboard。当 Interface Builder 出现时,从Object library 里拖两个UILabel 对象放置到canvas上 , 把他们的frame按如下设置:

  • 第一个 label: X = 16, Y = 70, Width = 568, Height = 40

  • 第二个 label: X = 16, Y = 140, Width = 568, Height = 40

  • 之后,把它们两个的文本设置为居中。视需要,你可以删除默认文本,但并不是强制的。

    接下来,从library里获取一个UIImageView 对象然后布置到canvas上,设置它的frame为如下:

    X = 250, Y = 440, Width = 100, Y = 100

    现在,必须设置constraints。因为我们的subviews 非常简单,我们可以允许Xcode随意设置constraints。在View Controller 里的所有视图里,选中菜单里的 Editor > Resolve Auto Layout Issues > Add Missing Constrains

    t30_1_constraints_menu.png

    最终,界面会展现为如下所示:

    t30_2_interface_sample.png

    现在,定位到 ViewController.swift文件,在类文件的开头声明如下 IBOutlet 属性值:

    @IBOutlet weak var label1: UILabel!   @IBOutlet weak var label2: UILabel!   @IBOutlet weak var imageView: UIImageView!

    再次返回到Interface Builder,把IBOutlets和适合的subviews关联起来。

    上面就是所有需要的东西。这个简单工程现在任由我们支配啦,因此我们可以在以下的几部分使用它。

    t30_3_connect_iboutlet_properties.png

    更换Themes

     

    1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

    相关文章
    • Xcode使用教程详细讲解 (下)

      Xcode使用教程详细讲解 (下)

      2017-04-10 16:08

    • 《Objective-C and Xcode基础教程》

      《Objective-C and Xcode基础教程》

      2017-02-15 17:02

    • iOS开发——小技巧:Mac开源小软件PushMeBaby,还要啥后端,测试APP推送只靠Xcode!

      iOS开发——小技巧:Mac开源小软件PushMeBaby,还要啥后端,测试APP

      2017-01-22 16:02

    • Xcode使用教程详细讲解 (上)

      Xcode使用教程详细讲解 (上)

      2016-12-26 10:00

    网友点评
    i