在JavaScript中初始化Blockly突变体
Hi，
据我所知，Blockly中的自定义块可以在JSON或JavaScript中定义，但是如何在JavaScript中初始化一个变体呢？
带有JSON的：
Blockly.defineBlocksWithJSONArray([
{....
"mutator": "myMutatorName"
});然后必须定义Mutator_MIXIN，并使用Blockly.Extension.registerMutator('myMutatorName', Blockly.myMutator_MIXIN, null, null)将变形器添加到块中。
与JavaScript:
Blockly.Blocks['blockName'] = {
init: function() = {
....
??? this.setMutator(???)???
};
}那么，如何在JavaScript中做到这一点呢？
亲切的问候
一个新的
回答 2
Stack Overflow用户
发布于 2019-03-06 15:58:49
我可能只是晚了一点，但无论如何，我会把答案留给那些需要更多具体例子的人。
在JavaScript中，实际上不需要将mutator绑定到块，只需定义mutationToDom()和domToMutation(xmlElement)函数，如下所示：
Blockly.Blocks['my_custom_block'] = {
init() {
// Define your basic block stuff here
},
// Mutator functions
mutationToDom() {
let container = document.createElement('mutation');
// Bind some values to container e.g. container.setAttribute('foo', 3.14);
return container;
},
domToMutation(xmlElement) {
// Retrieve all attributes from 'xmlElement' and reshape your block
// e.g. let foo = xmlElement.getAttribute('foo');
// this.reshape(foo);
},
// Aux functions
reshape(param){
// Reshape your block...
}
}
Blockly将自动处理其余部分，并允许您将您的块视为动态块。
如果您需要使用Mutator编辑器UI，则必须定义decompose(workspace)和compose(containerBlock)函数，并调用this.setMutator(...)来设置在Mutator中使用的块，如下所示：
Blockly.Blocks['my_custom_block'] = {
init() {
// Define your basic block stuff here
// Set all block that will be used in Mutator Editor UI, in this
// case only 'my_block_A' and
this.setMutator(new Blockly.Mutator(['my_block_A', 'my_block_B']));
},
// Mutator functions
mutationToDom() {
// Same as previous example
},
domToMutation(xmlElement) {
// Same as previous example
},
decompose(workspace) {
// Decomposeyour block here
},
compose(containerBlock) {
// Compose your block here
},
// Aux functions
reshape(param){
// Same as previous example
}
}
希望这些简短的例子能帮助到某人:)
Stack Overflow用户
发布于 2017-09-25 08:58:26
您必须声明xml如何加载到dom，以及如何将其保存到xml并重新绘制。还请注意它是如何将mutator附加到块元素的，以防这是您需要引用已经存在的mutator的唯一部分。
init: initFunction (Like you have declared.)
mutationToDom: MutationToDom,
domToMutation: DomToMutation,
updateShape_: UpdateShape`如果您所需要的只是创建一个对mutator的引用，那么您需要的就是这类元素，我们将以编程的方式创建这个元素：
<mutation mutator_name="true"></mutation>下面的片段是附加函数mutationToDom，DomtoMutation UpdateShape的一个示例，它有条件地附加额外的输入。我有一个带复选框的块，当启用时，会添加一个额外的输入。
function MutationToDom() {
var container = document.createElement('mutation');
var continueOnError = (this.getFieldValue('HasCONTINUE') == 'TRUE');
container.setAttribute('continueOnError', continueOnError);
return container;
}
function DomToMutation(xmlElement) {
var continueOnError = (xmlElement.getAttribute('continueOnError') == 'true');
this.updateShape_(continueOnError);
}
function UpdateShape(continueOnError) {
// Add or remove a Value Input.
if (continueOnError) {
this.appendValueInput("CONTINUE_ON_ERROR")
.setCheck('CONTINUE_ON_ERROR');
} else {
if (this.childBlocks_.length > 0) {
for (var i = 0; i < this.childBlocks_.length; i++) {
if (this.childBlocks_[i].type == 'continue_on_error') {
this.childBlocks_[i].unplug();
break;
}
}
}
this.removeInput('CONTINUE_ON_ERROR');
}
}https://stackoverflow.com/questions/46277625
复制相似问题
腾讯云开发者
