Blockly常用函数

Blockly具有完整的API文档，下面我们将对常用的函数进行说明。API文档

Blockly.inject函数

函数声明

inject(container, opt_options) returns Blockly.WorkspaceSvg

container：是个html元素，ID或CSS选择器；
opt_option：object，Blockly参数，参数的定义在typings/parts/blockly-interfaces.d.ts文件中；

Name	Type	Description
collapse:	boolean	允许工具箱折叠，默认为true
comments:	boolean	允许积木进行注释，默认为true
css:	boolean	允许使用css，默认为true
disable:	boolean	允许禁用积木，默认为true
grid:	object	配置脚本区格子大小等
horizontalLayout:	boolean	工具箱行列布局，默认为false，列布局
maxBlocks:	number	允许脚本创建的最大积木数量
maxInstances:	object	限制某种类型积木使用次数
media:	string	静态文件存放位置
move:	object	配置移动积木的方式 scrollbars、drag、wheel
oneBasedIndex:	boolean	列表下标开始，true下标从1开始，false下标从0开始
readOnly:	boolean	Toolbox和trashcan是否可以编辑，缺省为false
rtl:	boolean	Toolbox中分类和积木靠左或右，缺省为false
scrollbars:	boolean	工作空间是否可滚动，缺省true
sounds:	boolean	操作声音，缺省true
theme:	Blockly.Theme	主题
toolbox:	XML nodes or string	分类和积木xml
toolboxPosition:	string	工具箱放置位置start、end，可配合RTL使用
trashcan:	boolean	显示隐藏垃圾桶图标，缺省为true
maxTrashcanContents:	number	可删除的最大积木数量，默认为0，没有限制
zoom:	object	放大缩小

例子

var demoWorkspace = Blockly.inject('BlocklyDiv',
        {media: '../../media/',
         toolbox: document.getElementById('toolbox')});

Blockly.WorkspaceSvg对象

Blockly.inject以后，可以对工作空间增加其他的交互。目前只是列出了几个常用函数，具体可参考API文档。

工作空间添加移除事件

demoWorkspace.addChangeListener(onchange);
demoWorkspace.removeChangeListener(onchange);

工作空间的改变将会触发函数onchange执行！

工作空间改变大小

Blockly.svgResize(demoWorkspace);
var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);

更新工具箱

demoWorkspace.updateToolbox(newTree);

限制Block使用个数

demoWorkspace.remainingCapacity();

工作空间转代码

var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);

xml转代码

var xml = Blockly.Xml.textToDom(xmlText)
//此工作空间没有绑定到html上
var demoWorkspace = new Blockly.Workspace();
Blockly.Xml.domToWorkspace(xml, demoWorkspace);
var code = Blockly.JavaScript.workspaceToCode(demoWorkspace);

设置主题

设置工作空间主题，Blockly.Themes.Classic是缺省主题。
demoWorkspace.setTheme(theme)

新建积木

Blockly.Block对象

new Block(workspace, prototypeName, opt_id)、
workspace：工作空间，prototypeName：积木名称，opt_id：积木ID
积木对象，不能使用new Block直接创建对象，应由Workspace对象调用newBlock函数，创建Block对象。
newBlock(prototypeName, opt_id) returns Blockly.Block

Blockly.Event事件对象

积木

创建（BlockCreate/Create）、删除（BlockDelete/Delete）、改变（BlockChange/Change）、移动（BlockMove/Move）

注释

创建（CommentCreate）、删除（CommentDelete）、改变（CommentChange）、移动（CommentMove）

UI

UI相关事件，已经在前篇文章说明；

变量

创建（VarCreate）、删除（VarDelete）、重命名(VarRename）

Blockly.Field

积木有很多种类型，有输入型、时间型、选择型、角度、颜色、变量、按钮、标签、图像等等，这些积木类型都由Field来定义，下篇将专门对Field详细说明，并尝试如何自定义Field。

Blockly常用函数