于文文,PaintCode 用户操作攻略变量篇,月嫂

运用变量(Using Variables)

和色彩和突变相同,变量也是规划师能够在 PaintCode 文档中运用的一种库项目。

变量能够使数字、文本、布尔值(逻辑数值)、点、矩形、巨细,乃至是色彩、暗影和突变。规划师能够将变量与画布中的图形特点相连。

例如,规划师能够创立一个树枝变量为半径,而且它衔接到几个圆角矩形的半角半径特点。当规划师改动半径变量,一切被衔接图形的角半径都将同步更新。

经过在画布上生成制作办法,变量会转化为办法参数。

创立变量(ymxkCre瀚思想康ating variables)

在库中变量头部左面的方位,单击 + 按钮,来创立一个新的变量。然后,挑选规划师想创立的变量类型。

修改变量(Editing variables)

当规划师创立一个新的变量的一起,一个修改区域也会呈现。规划师在库中双击变量,能够随时进入修改区域。

修改区域答应规划师调整变量的特点,或许最重要的是它的值和姓名。

不同的变量有不同的修改区域。以下是矩形变量修改区域的姿态:

惯用特点影响着生成的代码,一会回来。

小窍门:规划师在没有打开变量修改区域的时分,就能够调整大所属变量的值。只需单击并上下拖动变量的值域修改区域就能够了。

衔接变量和图形(Connecting variab大隋圣皇帝le to shapes)

有几种办法能够将变量与一些图形的特点衔接。榜首种,在画布中挑选图形(或许几个图形),然后点击并拖动变量衔接点到查看器中图形的特点上。

或许,规划师能够点击并拖动衔接点直接衔接到画布中的图形,然后从弹出的上下文菜单中挑选羊癫疯想要的特点。这比榜首中办法便利。可是,规划师只能用它来操作一次,用来衔接一个图形的变量(相比之下,当规划师经过查看器创立衔接的时分,这样能够耶鲁大学用来衔接一个变量到多个图形。)

也要留意一些特点,像贝塞尔曲线点的方位以及一些能够经过查看器链接的组特点。

衔接指示按钮(Connection indicator button)

当规划师衔接变量到一些特点后,在查看器中就会呈现一个衔接指示按钮(这个按钮代替本来特点中的文本字段)。鄙人面的比方中,现已链接一个变量到一个圆角矩形的角半径特点。

点击衔接指于文文,PaintCode 用户操作攻略变量篇,月嫂示按钮,就会呈现衔接指示按钮修改区域。

修改区域答应规划师拟定一个偏移值,当经过特点被运用的时分,一个值应该被加到变量的值上面。这些自界说比纳凉的偏移值能够大大削减规划师文档中创立变量的数量。此外,这个衔接指示按钮也能够切换特点来运用不同的变量,假如能够的话。

断开特点的变量链接(Disconnecting a variable from an attribute)

点击小紫色圆形中的白色叉,就能够断黄岛天气预报开特点的变量链接(这个圆形在衔接指示按钮中)。

当断开变量链接,这个衔接指示按钮就会消失了,而且回来原有的文字域:

运用变量操控可见性(Controlling the visibility of shapes using variables)

规划师能够运用布尔变量来操控恣意图形的可见度。在图形查看器中,在姓名文本域下方的一个弹出按钮中。

默许情况下,悉数可见(Visible萦 on all displays)是被勾选的。只在 Retina 屏藤堂响幕下可见(Visible only on Retina displays)以及在非 Retina 屏幕下可见(Visibile only on non-Retina displays)设置也是可见的。

别的,这个弹出按钮包括了 PaintCode 一切的布尔变量。

在上面的比方中,PaintCode 文件包括一个叫做isPressed 的布尔变量。经过挑选按下可见(Visible if isPressed)选项,当按下变量是真时,PaintCode 会保证图形仅有可见。

在画布上显现变量(Variab于文文,PaintCode 用户操作攻略变量篇,月嫂les displayed in canvas)

当规划师创立点或许矩形变量,而且在画于文文,PaintCode 用户操作攻略变量篇,月嫂布中将其与一些图形链接,变量自身也会在画布中显现,显现为紫色。

在点的情况下,它显现为能被拖动的小方针符号。点变量的值也会发生相应的改变。矩形变量也有相似的设置。

这个功用十分的有用,例如,当规划师创立一个点变量代表一个鼠标光标的时分。规划师能够根据这个变量(运用表达式),创立许多变量。,并经过移动指针变量,规划师能够轻松的测验发生的行为。

运用画布?显现变量菜单(Canvas ? Show Variables menu),可将这个功用敞开或许封闭。

变量和代码生成(Variables and code generation)

经过在画布上制作办法,变量会转化为参数:

- (void)drawRateButtonWithRadius: (CGFloat)radius title: (NSString*)title pressed: (BOOL)pressed;

除非,当然,规划师挑选的变量在它的修改区域中表现为一个局部变量。留意,表达式变量总是局部变量。

表达式(Expressions)

PaintCode 答应规划师发明另一种特别变量——表达式。这些变量能够运用数学和编程表达式来界说值。它们依靠其他变量,乃至是其他库项目,比方色彩。

PaintCode 中有一些根本的简略的编程言语。这些具有 C 以及 Java 的子集,而且便利运用。运用表达式变量,规划师能够创立杂乱的、动态的规划,乃至是游戏动画人物。

当在表达式的部分中显现橙色布景,这意味着这里有一些过错。点击表达式部分的橙色,或许在修改区域的左下角点击正告三角形来显现过错信息。

表达式不只限于数字,还能够运用逻辑运算,比方:?。C 言语的三元算子,乃至是创立一个库中的参阅色彩。

要点:对库项目来说这是合法的,就像色彩在其姓名中有空白相同。可是,当规划师想再表达式中经过姓名指向库项意图时分,规划师有必要删去这些空白,大写每个单词首字母,但要小写榜首个字母。例如,假如在库中有一个名为 My Red Color 的项目,在表达式中,规划师能够这样运用:myRedColor。

想学习 PaintCode 的表达式,请阅览下一章节。

表达式(Expression Language)

在 PaintCode 中,规划师能够经过运用简略语法来界说根据其他变量的变量。这支撑许多数学的、逻辑函数和操控符,这是大多数开发人员期望的。语法简略,均为 C 和 Java 的子集。

刚创立了一个语法的新变量,而且在一个语法中运用了文本视图布地奈德福莫特罗粉吸入剂。新变量的值将被核算和自动更新。

当规划师导出 PaintCode 文档后,这些变量语法将转化为规划师所挑选的编程言语(Objective-C, Swift 或 C#)。核算变量、动态联系与界说的变量之间,在导出代码中继续的作业。

变量类型(Types of variables)

数字(Numbers)

在 PaintCode 中一切的数字都是浮点。这种表达式回来数字:

5

5 * 4 + 3 * 2

在表达式中,规划师能够便利地参阅其他变量。语法中也包括一些规划师能够调用的在建函数:

width * (4 - offset)

sin(2.7 / PI * 180)

sqrt(width * width + heigt * height)

文本(Texts)

文本变量是没有长度约束的字符串。规划师能够运用双精度或许单精度字符串:

"This is于文文,PaintCode 用户操作攻略变量篇,月嫂 text!"

'This is also text, now using single quotes.'

能够运用 + 运算符链接文本。运用 stringFromNumber(x) 办法,能够将数字转换为文本。

"angle: " + stringFromNumber(180)

规划师能够运用点记法,得到文本的长度(字母的数量)。这会回来数字。

"Hello".length

布尔值(Booleans)

布尔变量表明逻辑值的真/假。也能够用来代表 YES, yes, NO,于文文,PaintCode 用户操作攻略变量篇,月嫂 no。

比较的成果总是回来布尔值。举例:

true

3 > 2

"hello" != "world"

mousePosition.x >= activeRect.x &&中华恐龙园amp;

mousePosition.y >= activeRect.y &&

mousePosition.x <= activeRect.x + activeRect.width &&

mousePosition.y <= activeRect.y + activeRect.height

规划师能够运用三元算子:?运算,回来两个值傍边的一个,这取决于榜首个参数的值。第二个喝第三个参数有必要坚持享受的类型(在这种情况下,文本):

isValid ? "Valid" : "Invalid"

点(Point)

运用 makePoint(x, y)函数创立新的点:

makePoint(10, 20)

假定规划师有一个娇子卷烟价格表图点变量(称为 performancemyPosition),想运用表达式中点的 x 坐标。像这样:

myPosition.x + 100

怎么核算在 A 与 B 两点中心的点:

makePoint((positionA.x + positionB.x) / 2,穿越前方下载

(positionA.y + positionB.y) / 2)

巨细(Size)

与点相似,也包括两个于文文,PaintCode 用户操作攻略变量篇,月嫂数字厂加人,可是代表的是宽和高,首要的意图是表明矩形巨细。

makeSize(10, 20)

假定规划师现已界说了一个变量为 defaultSize 的巨细变量以及数字区域,现在要经过因子区域扩展宽度:

makeSize(zoom * defaultSize.width, defaultSize.height)

矩形(Rectangle)

矩形变量包括四个数字:x轴,y轴,宽,高。有一个叫 makeRect(x, y, width, height)的函数来创立一个矩形的值。宽度和高度表明矩形的巨细,(x, y)表明矩形的起点坐标。

makeRect(0, 0, 640, 1136)

假定规划师现已创立了一个叫iPhoneBounds 的矩形。规划师不只能够轻松拜访每个独自的值,还能够得到矩形的巨细以及起点坐标:

iphoneBounds.size

下面两个表达式是等价的:

iphoneBounds.origin.x + iphoneBounds.size.width

iphon贝尔摩德eBounds.x + iphoneBounds.width

色彩(Color)

色彩由四位数字表明:赤色,绿色,蓝色和 alpha 通道。每个数字距离为 1.运用 makeColor 函数创立色彩。下表的表达式将得到一个纯黄色:

makeColor(1, 1, 0, 1)

色彩在库中界说,而且能够在表达式中运用(例如,根据是否按下按钮得到两赤色彩)。可是,当在表达式中参阅色彩(像其他库项目中的突变和暗影)的时分要留意,它们能够有恣意的称号,可是称号的变量是有约束的:

只答应运用英文字符,数字以及下划线只能以消协字母作为变量的开端

色彩称号能够包括空格,口音以及符号(例如,对话框的布景色彩),可是当在脚本中运用的时于文文,PaintCode 用户操作攻略变量篇,月嫂候,需求将它们删去(snanitized),例如:

原有以及删去后的库项方针识符实例:泪痣

突变(Gradient)

运用 makeGradient(color1, color2)函数创立突变。由赤色到通明的突变能够这样定宋词精选义:

makeGradient(makeColor(1, 0, 0, 1),

makeColor(1, 0, 0, 0))

或许,假如规划师现已有了两个色彩,能够这么做:

makeGradient(solidRedColor, transparentRedColor)

暗影(Shdow)

运用 makeShadow(color, offsetX, offsetY, blur) 函数创立暗影。

makeShadow(solidRedColor, 5, 5, 3)

运算符(Operators)

运算符的优先级:

常数(Constants)布尔常量(Boolean constants):yes, no, true, false, YES, NO数字常量(numeric constant):PI色彩常量(color constant):MISSING_COLOR突变常量(gradient constant):MISSING_GRADIENT暗影常量(shadow constant):MISSING_SHADOW图片常量(image constant):MISSING_IMAGE 根本数学函数(Basic Math Functions)

floor(x)

回来 x 的下方

ceil(x)

回来 x 的上方

round(x)

得到 x 最接近的整数

frac(x)

得到 x 的小数部分

sqrt(x)

得到 x 的平方根

abs(x)

得到 x 的绝对值

min(x, y)

得到较小的两个参数

max(x, y)

得到较大的两个参数

侧角函数(Goniometric Functions)

sin(a), cos(a), tan(a)

goniometric functions.

注:参数标有刻度

atan2(y, x)

根据这两个值来确认正确的 Y/X 象限圆弧切线

色彩,突变和暗影(Colors, gradients and shadows)

makeColor(r, g, b, a)

得到色彩坐标以及 alpha值。一切参数从 0 或 1华氏度和摄氏度的换算 开端

makeGradient(c李京实1, c2)

得到突变

makeShadow(color, xOffset, yOffset, blurRadius)

得到暗影

其他函数(Other Functions)

makePoint(x, y)

得到点

makeSize(width, height)

得到巨细

makeRect(x, y, width, height)

得到举办起点坐标以及巨细(宽、高)

stringFromNumber(x)

把数字 x 转化为文本

PaintCode 用户操作攻略系列文章

PaintCode 用户操作攻略(概述篇)

PaintCode 用户操作攻略(库篇)

PaintCode 用户操作攻略(制作篇)

PaintCode 用户操作攻略(画布和选项卡)

PaintCode 用户操作攻略(样式表和代码生成)

PaintCode 用户操作攻略(变量篇)

PaintCode 用户操作攻略(动态图形篇)

PaintCode 用户操作攻略(符号篇)

更多文章将连续发布,敬请重视。

本著作由人人都是产品司理特邀专栏作家 @郑几块翻译并独家授权发布,未经许可制止转载

互联网人士必备微信大众号:woshipm,雷军和周鸿祎都重视了,假如你现已重视了,证明你现已很牛逼了。