Blockly.Blocks['move_right'] = { init: function() { this.appendValueInput("PIXELS") .setCheck("Number") .appendField("move to right"); this.setInputsInline(true); this.setPrev@R_502_437@sStatement(true,null); this.setNextStatement(true,null); this.setColour(290); this.setTooltip(''); this.setHelpUrl('http://www.example.com/'); } }; Blockly.JavaScript['move_right'] = function(block) { var value_pixels = Blockly.JavaScript.valueToCode(block,'PIXELS',Blockly.JavaScript.ORDER_ATOMIC); // TODO: Assemble JavaScript into code variable. var codeMoveRight = "$(\"#moveDiv\").animate({\n " + "left: \"+=" + value_pixels + "px\"\n" + "},1000);\n"; return codeMoveRight; };
根据您设置的像素数量,将div移动到右侧.您将不得不在move_right块中放置一个math_number块来放置要移动的像素数量.
我在我的html文件上有一个注入Blockly工作空间的工作区变量:
var workspace = Blockly.inject('blocklyDiv',{toolBox: document.getElementById('toolBox')});
我想做什么
一旦块被显示在Blockly的工作区,而不是之前,从JavaScript中检索这一数量的像素.
我试过了
>我直接尝试从我的broser(谷歌浏览器)的控制台访问工作区变量,并可以获得“子块”,但不是它们的价值.如下:
console.log(workspace.topBlocks_[0].childBlocks_);
>我也尝试将工作空间转换为dom,然后转换为text:
var xml = Blockly.Xml.workspaceToDom(workspace); var xml_text = Blockly.Xml.domToText(xml); console.log(xml_text);
在这里我可以看到“子块”的值,我的意思是,math_number块,它存储在文本上,但我不知道如何得到它.
为什么要实现呢?
因为我想要的是检查用户是否向右移动了300像素.如果是这样,那么我会显示一个消息,我会把“你得到它”.
我的问题
有没有可能做一个这个块的实例,我放在工作区,然后访问它的像素值与该实例?
编辑:
我也可以得到@Oriol说左边的值:
$('#moveDiv').css('left');
但是我并没有把它放在这里,因为它使用Jquery的属性(这根本不重要,因为它也是一个很好的选择,而不是这样).我的意图是将Block放在Blockly工作区上,随时随地进行操作.
提前致谢!
解决方法
Blockly.JavaScript['move_right'] = function(block) { var value_pixels = Blockly.JavaScript.valueToCode(block,Blockly.JavaScript.ORDER_ATOMIC); // TODO: Assemble JavaScript into code variable. var codeMoveRight = "$(\"#moveDiv\").animate({\n " + "left: \"+=" + value_pixels + "px\"\n" + "},1000);\n"; // You can show a blockly warning if( value_pixels >= 300 ) block.setWarningText("You get it!"); // Or you can store its value elsewere... // myExternalVar = value_pixels; return codeMoveRight; };
这将在块本身中显示为警告图标.
在任何情况下,如果你想“记住”这个value_pixels变量,我相信更容易的方法是在生成器中执行,如上所示.您可以随时将其存储在可自定义功能的外部变量中.
编辑:
如果您需要遍历块结构以用于其他目的,则可以使用:
> Blockly.mainWorkspace.getTopBlocks(true); //获取顶级块
>顶层块列表中的迭代
> block = block.nextConnection&& block.nextConnection.targetBlock(); //要“下降”到块的子块中,然后迭代它们
> if(block.type ==“move_right”)… //检查特定的块类型
我希望这将给出一个起点,但是了解这些“技巧”的最好方法是阅读Blockly源代码.即使代码普遍得到很好的评论,AFAIK也没有办法自动生成文档,也不能在网络上使用.