Add a new tween block

This commit is contained in:
2026-01-20 22:11:44 -06:00
parent 95d821c376
commit 921836e302
2 changed files with 100 additions and 0 deletions

View File

@@ -289,3 +289,86 @@ BlocklyJS.javascriptGenerator.forBlock["tween_sprite_property"] = function (
return code; return code;
}; };
Blockly.Blocks["tween_sprite_to_xy"] = {
init: function () {
this.appendValueInput("X")
.setCheck("Number")
.appendField("tween to x:");
this.appendValueInput("Y")
.setCheck("Number")
.appendField("y:");
this.appendValueInput("DURATION")
.setCheck("Number")
.appendField("in");
this.appendDummyInput()
.appendField("seconds using")
.appendField(
new Blockly.FieldDropdown([
["linear", "Linear"],
["sine", "Sine"],
["quadratic", "Quad"],
["cubic", "Cubic"],
["quartic", "Quart"],
["quintic", "Quint"],
["expo", "Expo"],
["circ", "Circ"],
["back", "Back"],
["elastic", "Elastic"],
["bounce", "Bounce"],
]),
"EASING_TYPE"
)
.appendField(
new Blockly.FieldDropdown([
["in", "In"],
["out", "Out"],
["in-out", "InOut"],
]),
"EASING_MODE"
);
this.setInputsInline(true);
this.setPreviousStatement(true, "default");
this.setNextStatement(true, "default");
this.setColour("#32a2c0");
this.setTooltip(
"Tween sprite to a specific x and y position over time using easing"
);
},
};
BlocklyJS.javascriptGenerator.forBlock["tween_sprite_to_xy"] = function (
block,
generator
) {
const x =
generator.valueToCode(block, "X", BlocklyJS.Order.ATOMIC) || "0";
const y =
generator.valueToCode(block, "Y", BlocklyJS.Order.ATOMIC) || "0";
const duration =
generator.valueToCode(block, "DURATION", BlocklyJS.Order.ATOMIC) ||
"1";
const easingType = block.getFieldValue("EASING_TYPE");
const easingMode = block.getFieldValue("EASING_MODE");
const code = `await Promise.all([
startTween({
from: sprite.x,
to: ${x},
duration: ${duration},
easing: "${easingMode + easingType}",
onUpdate: async (tweenValue) => {
sprite.x = tweenValue;
}
}),
startTween({
from: sprite.y,
to: -(${y}),
duration: ${duration},
easing: "${easingMode + easingType}",
onUpdate: async (tweenValue) => {
sprite.y = tweenValue;
}
})
]);\n`;
return code;
};

View File

@@ -2191,6 +2191,23 @@ const extensions = [
</shadow> </shadow>
</value> </value>
</block> </block>
<block type="tween_sprite_to_xy">
<value name="X">
<shadow type="math_number">
<field name="NUM">0</field>
</shadow>
</value>
<value name="Y">
<shadow type="math_number">
<field name="NUM">0</field>
</shadow>
</value>
<value name="DURATION">
<shadow type="math_number">
<field name="NUM">1</field>
</shadow>
</value>
</block>
<block type="tween_block"> <block type="tween_block">
<value name="FROM"> <value name="FROM">
<shadow type="math_number"> <shadow type="math_number">