Blockly Game之拼图

Blockly Game之拼图

首页休闲益智动物恐慌拼图更新时间:2024-04-29

游戏帮助

对于每个动物(绿色),为其添加照片、选择腿的数量,并且选择它们各自的身体特征。也就是说将某种动物的特性通过积木拖动的方式卡合在一起。

游戏介绍

正确答案

分析实现

积木的定义

需要定义三种积木,主积木、图片积木、特征积木。定义主积木,这个积木有个图片输入,有个下拉输入,还有个文本输入,第二个参数后都是文本输入。

主积木

blockly.Blocks['animal'] = { //定义积木 init: function() { this.setColour(Puzzle.Blocks.ANIMAL_HUE); //图片输入 this.appendDummyInput() .appendField('', 'NAME'); this.appendValueInput('PIC') .setAlign(Blockly.ALIGN_RIGHT) .appendField(BlocklyGames.getMsg('Puzzle_picture')); //腿下拉输入 this.appendDummyInput() .setAlign(Blockly.ALIGN_RIGHT) .appendField(BlocklyGames.getMsg('Puzzle_legs')) .appendField(new Blockly.FieldDropdown(Puzzle.legs), 'LEGS'); //特征输入 this.appendStatementInput('TRAITS') .appendField(BlocklyGames.getMsg('Puzzle_traits')); this.setInputsInline(false); }, //积木赋值 populate: function(n) { this.animal = n; this.setFieldValue(BlocklyGames.getMsg('Puzzle_animal' n), 'NAME'); this.helpUrl = BlocklyGames.getMsg('Puzzle_animal' n 'HelpUrl'); },

图片积木

Blockly.Blocks['picture'] = { init: function() { this.setColour(Puzzle.Blocks.PICTURE_HUE); this.appendDummyInput('PIC'); this.setOutput(true); this.setTooltip(''); }, populate: function(n) { this.animal = n; var pic = 'puzzle/' BlocklyGames.getMsg('Puzzle_animal' n 'Pic'); var picHeight = BlocklyGames.getMsg('Puzzle_animal' n 'PicHeight'); var picWidth = BlocklyGames.getMsg('Puzzle_animal' n 'PicWidth'); this.getInput('PIC') .appendField(new Blockly.FieldImage(pic, picWidth, picHeight)); } }

特征积木

Blockly.Blocks['trait'] = { init: function() { this.setColour(Puzzle.Blocks.TRAIT_HUE); this.appendDummyInput().appendField('', 'NAME'); this.setPreviousStatement(true); this.setNextStatement(true); }, populate: function(n, m) { this.animal = n; this.trait = m; // Set the trait name. this.setFieldValue(BlocklyGames.getMsg( 'Puzzle_animal' n 'Trait' m), 'NAME'); } };

积木的生成

有多套拼图组合,初始化时选择4套拼图组合,生成对应的特征积木、图片积木和主积木。

while (BlocklyGames.getMsgOrNull('Puzzle_animal' i)) { //创建主积木 block = BlocklyInterface.workspace.newBlock('animal'); block.populate(i); blocksAnimals.push(block); //创建图片积木 block = BlocklyInterface.workspace.newBlock('picture'); block.populate(i); blocksPictures.push(block); var j = 1; //特征积木 while (BlocklyGames.getMsgOrNull('Puzzle_animal' i 'Trait' j)) { block = BlocklyInterface.workspace.newBlock('trait'); block.populate(i, j); blocksTraits.push(block); j ; } i ; }

改变积木位置,设置积木不可删除,并显示积木。

block.setDeletable(false); block.initSvg(); block.render();

积木正确性判断

积木卡合正确性由各自积木来确定,譬如鸭子动物确定腿的数量正确性,图片的正确由自身积木的动物与父积木的名称相当确定,特征积木使用同样方式确定。

var blocks = BlocklyInterface.workspace.getAllBlocks(); var errors = 0; var badBlocks = []; for (var b = 0, block; (block = blocks[b]); b ) { if (!block.isCorrect()) { errors ; // Bring the offending blocks to the front. block.select(); badBlocks.push(block); } } ,

大家还看了
也许喜欢
更多游戏

Copyright © 2024 妖气游戏网 www.17u1u.com All Rights Reserved