NodeBox 入门文档

2016/12/9 posted in  linux

NodeBox

NodeBox 有三个版本,第一个版本是专门的mac上面的版本,第二个版本是为windows开发的,第三个版本是跨平台的。把第一个版本和第三个版本分别下来试了一下,感觉第三个版本不是第一个版本的升级,二是两个完全独立的软件。第一个版本更倾向于用python代码来控制一个2D视觉,用于导出PDF或者其他格式的文件。而第三个版本更多的倾向于用可操作的方式来导出2D视觉图形。

官方给出的NodeBox特性:

  1. Designed for Mac OS X ——为MacOS设计
  2. Open Source ——完全开源的软件
  3. Python Powered ——在程序里面完全使用python来进行控制
  4. Illustrator Import —— 可以将生成的图导入到Illustrator中,安装NodeBox的SVG依赖库之后还可以使用SVG支持
  5. Core Image support ——安装Core Image库之后,可以使用图片的图层、透明、alpha通道等功能
  6. PDF Export —— 可以到处多张PDF,并手动控制。
  7. QuickTime Export —— 可以支持到处动画,并在Web上显示
  8. Documentation —— 文档丰富

NodeBox的安装

这里通过第一个版本来进行操作,第一个版本的下载地址请戳这里

我下的Download the experimental 1.9.7rc1 build 这个版本。下载完之后会是一个压缩包。 打开压缩包直接使用就可以了。

自己写的东西放在这个文件夹内就可以加载到相关的包。

同时NodeBox也支持Library的包,同样Library包下载下来放到文件夹里面就可以生效使用了,在代码中使用的时候使用ximport就可以导入了。

NodeBox入门

基本入门元素

基本方法:

Color commands that change the state:

colormode(), fill(), stroke(), strokewidth(), nofill(), nostroke()

Transformation commands that change the state:

transform(), translate(), rotate(), scale(), skew()

Text commands that change the state:

font(), fontsize()

基本测试

fill(1,0,0)
oval(10, 10, 50, 50)
oval(10, 70, 50, 50)
oval(10, 130, 50, 50)

stroke(0,1,0)
nofill()
oval(10, 190, 50, 50)

fill(0,0,0)
stroke(1,1,1)
rect(80,20,80,80)

translate(100,100)
rect(10,10,50,50)

rotate(45)
rect(10,70,50,50)

代码结果

fill() 这个是类似填充的笔刷,在其中定义笔刷颜色

stroke() 这个是描边,其中定义的也是描边的颜色,同时还可以定义描边的像素宽度

形状:

oval() 代表原型

rect() 代表举行

坐标轴变换:

translate() 平移改变坐标系
rotate() 旋转改变坐标系

在同一个文件中进行fill stroke的填充以及translate、rotate的变换是会对接下来的都产生影响的,如果需要改变回来的话,需要再次调用一次。

corner transform

先上代码:

transform(CORNER)

translate(100,100)

#paint the origin point
oval(-5,-5,10,10)

rotate(45)
text("one",15,0)

rotate(45)
text("two",15,0)

rotate(45)
text("three",15,0)

rotate(45)
text("four",15,0)

可以看到rotate是分为两种的,通过transform来定义,如果不指定transform的话,就是CENTER属性,此时是根据当前图形的中心点来进行rotate。而如果指定为CORNER的话,是通过图形的corner角点来指定,起始就是我们的原点。

reset()命令会重置我们前面所有的指定到默认值状态。

push()和pop()

push和pop都是成对出现的,首先看例子:

rect(20, 20, 40, 40)
push()
rotate(45)
rect(120, 20, 40, 40)
pop()
rect(220, 20, 40, 40)

这个简单的例子告诉我们,当使用了push的时候,所有的随后的translate(), rotate(), scale() and skew() 在调用pop之后的地方是无效的,但是他会集成前面的这些操作。

来看一个更有意思的demo

size(450, 450)
speed(30)
 
def draw():
    
    stroke(0)
    transform(CORNER)
    
    # This is the starting origin point,
    # where we place the sun.
    translate(225, 225)
    oval(-5, -5, 10, 10)
    text("sun", 10, 0)
    
    #the range(10) appoint the time is 10 seconds
    for i in range(3):
        
        # Each planet acts as a local origin for the orbitting moon.
        # Comment out the push() and pop() and see what happens.
        push()
        
        # This is a line with a length of 120,
        # that starts at the sun and has an angle of i * 120.
        rotate(FRAME+i*120)
        line(0, 0, 120, 0)
        
        # Move the origin to the end of the line.
        translate(120, 0)
        oval(-5, -5, 10, 10)
        text("planet", 10, 0)
        
        # Keep rotating around the local planet.
        rotate(FRAME*6)
        line(0, 0, 30, 0)
        text("moon", 32, 0)
        
        # Move the origin back to the sun.
        pop()

结果是一个动态的行星轨道模拟。

这里就是使用了push和pop是特性,保持每一个旋转都是独立的,互相之间不影响。

前面几个方法的参数使用情况

rect(20, 20, 100, 100, fill=(1, 0, 0), stroke=(0,1,0), strokewidth=4)

r = rect(20, 140, 100, 100)
r.fill = color(1, 0, 0)
r.stroke = color(0,1,0)
r.strokewidth = 4

所有的形状方法,比如(line(), rect(), oval(), star(), arrow()), beginpath(), drawpath() and text() 都会有三个可选的参数:fill, stroke and strokewidth。 如上面锁展示

同样的,旋转也可以带上自有的参数:

r.translate(x, y=None)
r.rotate(degrees=0, radians=0)
r.scale(x, y=None)
r.skew(x, y=None)

同时text也可以带上自身特殊的参数:

text("hello", 20, 20, font="Helvetica")

参数

rect的方法定义:

rect(x, y, width, height, roundness=0.0, draw=True)

第5个参数用于定义方形的圆角,第六个参数用于定义是否画出来。