代码生成(CodeGeneration) 当设计师设计的时候,PaintCode会即时生成图像代码。有几个设置影响着代码生成。设计师可以使用中间工具栏中的这些功能,直接生成所需要的代码。注意,设计师能够拖动中间工具栏或上或下,按照设计师想要的方式生成代码。 目标(Target) 首先,设计师必须在5个目标中任选其一: OSXObjectiveC iOSObjectiveC OSXSwift iOSSwift iOSCXamarin 设计师能够使用中间工具栏中的目标弹出按钮来确定目标。 目标设置只会影响生成代码,不会影响到设计。 最低限度支持OS版本(MinimumsupportedOSversion) 第二个选项允许设计师最低限度支持OS版本。例如,如果设计师选择iOS6以及以上版本,这就意味着生成的代码将只使用iOS6的接口(APIs)。通常情况下,设计师应该为他们的应用选择最低限度支持的OS版本。 内存管理(MemoryManagement) 目标生成代码使用了ObjectiveC,将会有一个可选的内存管理。这将允许设计师在ARC(自动引用计数AutomaticReferenceCounting)和保存释放(手动操作内存管理)选项中进行切换。 绘画起点(DrawingOrigin) 最后,设计师可以指定绘画的起点。这是每一个画布都会有的设置。如果设计师移动绘画的起点,(0,0)点位置也将会有不同。例如,默认的绘制起点在OSX中是左下角,而在iOS中缺失左上角。 注意,设计师可以在画布中拖动绘制起点符号,调整绘画起点。 样式表(StyleKits) 当设计师集成生成代码到他们的Xcode项目中的时候,样式表是一个非常好用的工具。 样式表: 在使用代码到Xcode项目中之前,手动排除需要来生成代码 允许设计师调整PaintCode文档,然后重新集成调整后的代码到Xcode项目中 快速生成设计原型 什么是样式表?(WhatisStyleKit?) 样式表是ObjectiveC,Swift或者C的特殊类,它包含设计师的绘画,颜色,渐变,阴影和其他设计资源。所有的这样允许设计师通过样式表的类方法使用。 在PaintCode中,设计师能够在单一文档中有多个绘制画布,并且每一个画布能够在样式表类中独立生成绘制方法。当设计师在代码中使用这些方法的时候,就会在画布中绘制内容。 把所有的PaintCode设计放入一个单独的样式表类中(通过类的公共界面使用这些代码),PaintCode将代码集成过程变得更加顺畅。无论设计师什么时候调整PaintCode中的设计,都能够轻易的向Xcode项目重新导入样式表类(2个文件)。设计师无需手动修改生成代码,事实上,甚至不需要设计师查看生成的代码! 样式表目录(StyleKitCatalog) 点击样式表选项卡,添加一个新的样式表,它位于工具栏的左侧、窗口的下方。 这就是选项卡目录。这是一个设计师希望生成样式表类的地方。当设计师滚动到目录地步,就会发现画布。每一个画布都有样式表目录,并且在样式表类中生成一个特殊的绘制方法。 样式表目录也包含颜色,渐变,阴影和图片。 往样式表中添加颜色和库项目(AddingcolorsandotherlibraryitemstoStyleKit) 从库中单击拖放目录,就能够向样式表目录中添加库项目。 或者,设计师可以点击添加颜色占位符,选择菜单中的颜色、渐变、阴影和图片,用同样的方法,就能够向样式表目录中添加响应的项目。 在设计师向样式表目录添加库项目后,一个具有享用名称的类方法会添加到生成的代码中。在生成的代码中调用样式表方法,设计师可以轻松的访问库项目。 从样式表中移除颜色和库项目(RemovingcolorsandotherlibraryitemsfromStyleKit) 在样式表目录中单击库项目,之后点击Delete或者Backspace,就能够在样式表目录中移除颜色和库项目。 或者,设计师可以从样式表目录中将库项目拖出。 重要的是,从样式表目录中移除库项目,不会从库中移除该项目。当设计师从样式表目录中移除库项目的时候,这只意味着生成样式表代码,并不是在库项目中生成公共的类方法。 向样式表中添加画布(AddingcanvasestoStyleKit) 向样式表中添加画布,与向样式表中添加库项目(比如颜色)略有不同。默认情况下,所有新创建的画布都会被添加到样式表目录中。 然而,设计师能够容易地移除和添加它们,甚至在样式表类中精确的调整每个画布的生成代码。 为了在样式表目录中添加画布,设计师必须对画布进行设置。设计师在工作区域中点击画布的标题后,就能够在检查器中看到画布设置。或者,设计师可以点击画布中的图形和组浏览器,它总是在该项目的顶端。注意,这么做,设计师必须离开样式表选项卡,之后激活画布中的选项卡。 样式表弹出按钮指定为选择的画布生成代码。 默认情况下,会生成绘制方法。然而,设计师也可以选择图像方法(ImageMethod)生成一个方法,返回画布中的一个UIImage内容。 当这个方法被调用的时候,UIImage会通过代码绘制。通常,非参数画布(画布不使用任何变量),UIImage会通过样式表类自动缓存。这意味着,当调用UIImage的时候,设计师不必担心性能。首先调用UIImage来绘制并缓存图片的方法,随后调用之返回缓存的图片,这是非常快的。 当使用UIImage生成方法的时候,设计师会经常使用到两个最好的方法:一个是设计师的设计是独立的,设计师不必使用光栅图片,但是性能和使用PNG资源是一样的。此外,设计师还可以很容易的使用应用样式接口,来预计UIImages。 在上图中,选择绘制和图片方法选项。这意味着两个UIImage生成方法和避免返回绘制方法将会和公共类方法一样,存在在样式表类中。 从PaintCode中导出样式表类(ExportingStyleKitclassfromPaintCode) 在检查器中,选择样式表选项卡并且点击大蓝色导出按钮,就能够从PaintCode中导出样式表类。 之后一个导出表单将会出现。设计师也可以使用CommandE快捷键使表单显示出来。在导出表达中,确保选择样式表选项卡的同时,点击导出按钮。然后,选择要导出的样式表类。通常,将会导出两个文件夹:一个是实现文件,一个是头部文件。如果PaintCode文档使用了光栅图片,设计师也能够选择并导出这些图片。 一旦样式表曾经被导出过,再导出就会变得非常容易了。单击CommandR或者从主菜单中选择文件再次导出,就能够再次导出了。然而,当设计师退出PaintCode后重新启动的时候,会再次提供给设计师导出文件夹。 在Xcode中使用样式表类(UsingStyleKitclassinXcode) 在Xcode中使用样式表是非常容易的。首先,在Xcode项目中增加已导出的样式表类(。m和。h文件)。然后,使用直接导入,将这些样式表类导入到源代码中: importYourStyleKitName。h 或者,设计师可以把要导入的命令放到预编辑的头部(。pch扩展的一种)。这样,设计师就可以在所有源文件中使用样式表了,并且不需要在其中加入导入命令。 最后,简单调用这些类方法,来使用样式表,像这样: 〔YourStyleKitNamedrawYourCanvas〕; 通常,设计师可以在overriddendrawRect中这么做:一些UIView方法。看到更多样式表的基础教程。访问样式表颜色,可以这么做: UIColorcolorYourStyleKitName。yourC 其他库项目与渐变和阴影行为的展现方式一致。 注意当程序化地使用样式表的时候,设计师不需要实例化样式表类,访问设计以及库项目的所有方法都是类方法,这意味着设计师调用的这些方法,不是类的实例。 注意,如果设计师的画布使用框架活着变量,生成的类方法可以带参数,这样能够让设计师轻松绘制参数图。 UIImage生成画布(UIImagegeneratingcanvases) UIImage生成画布的列子,在画布设置中有很多选项。例如,可以指定拉伸的上限。 设计师也可以指定UIImage的调整行为(特别是,是否通过定义中心区来平铺活着拉伸UIImage)。 设计师也可以设置UIImage渲染模式。一些iOS系统控制如UITabBarItem使用UIImages来绘制图表,但这也只把UIImages当模版来用,在其应用系统中具有广泛的影响。这种行为通常可以防止通过切换到原始(Orginal)渲染模式。 以下是如何在一个带有样式表的单一画布中,设置生成绘制方法和图像生成方法,像这样: 在XIBs和Storyboards中使用UIImage生成画布(UsingUIImagegeneratingcanvasesinXIBsandStoryboards) 在上面的代码中,设计师能够看到一个画布,在画布中设置生成UIImage方法,也生成特殊的IBoutletCollection。 如果设计师在XIBs或者Storyboards中产生实例对象,可以连接通过画布到其他对象生成的IBoutletCollection。 在XIB或者Storyboard中添加实例对象后,不要忘记调整他们的类到样式表类中。 样式表将会自动调用设计师添加到IBOutletCollection(又称为目标)中的setImage方法,并利用画布生成带参数的UIImage。 设计师通过它们的setImage方法,能够把这些应用到将在PaintCode中设计的图片,分配到对象中。在画布设置中,依然能够指定setSelectedImage方法替代前面的方法。 当设计师想自定义像UITabBarItem一样可视界面对象的时候,IBOutletCollection是非常有用的。 这是在模拟器中链接画布中IBOutletCollection和UITabBarItem的结果: 注:用UITabBarItem进行设计,设计师必须设置它的标识符来定制在Xcode中的InterfaceBuilder。 重要:请注意所有的样式表方法都是类方法。这就意味着设计师通常不需要将样式表变为实例后在使用。事实上,设计师只需要创建一个实例就能够使用IBOutletCollection。 样式表设置(StyleKitSetting) 点击样式表选项卡下面的工具栏,就能够进入样式表设置。在右边的检查器中会出出现样式表设置。设计师可以指定: 生成样式表类的名称 项目名称 设计师名称 企业名称 这些信息被用来生成每个样式表文件顶部的评论。当样式表选项卡处于活动状态的时候,样式表设置能够在检查器中找到。 PaintCode用户操作指南系列文章 PaintCode用户操作指南(概述篇) PaintCode用户操作指南(库篇) PaintCode用户操作指南(绘制篇) PaintCode用户操作指南(画布和选项卡) PaintCode用户操作指南(样式表和代码生成) PaintCode用户操作指南(变量篇) PaintCode用户操作指南(动态图形篇) PaintCode用户操作指南(符号篇) 文章已经完结,敬请期待下一部《Sketch3用户操作指南及实战案例全解》