Commit 4c35d946 authored by 范雪寒's avatar 范雪寒

feat: 烟花效果

parent 8e467e99
...@@ -15,6 +15,9 @@ ...@@ -15,6 +15,9 @@
"_children": [ "_children": [
{ {
"__id__": 2 "__id__": 2
},
{
"__id__": 15
} }
], ],
"_active": true, "_active": true,
...@@ -235,7 +238,7 @@ ...@@ -235,7 +238,7 @@
}, },
{ {
"__type__": "cc.Node", "__type__": "cc.Node",
"_name": "fire", "_name": "BtnFire",
"_objFlags": 0, "_objFlags": 0,
"_parent": { "_parent": {
"__id__": 2 "__id__": 2
...@@ -658,5 +661,646 @@ ...@@ -658,5 +661,646 @@
}, },
"_enabled": true, "_enabled": true,
"_id": "ebve0q/11Fq7yItSIg8Cta" "_id": "ebve0q/11Fq7yItSIg8Cta"
},
{
"__type__": "cc.Node",
"_name": "RibbonNodeBase",
"_objFlags": 0,
"_parent": {
"__id__": 1
},
"_children": [
{
"__id__": 16
},
{
"__id__": 18
},
{
"__id__": 20
},
{
"__id__": 22
},
{
"__id__": 24
},
{
"__id__": 26
}
],
"_active": true,
"_components": [],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 0,
"height": 0
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
-192.877,
-743.57,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "ecEhc8r5NF26a2w8vDRh58"
},
{
"__type__": "cc.Node",
"_name": "bg_sahua",
"_objFlags": 0,
"_parent": {
"__id__": 15
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 17
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 0,
"b": 0,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 36,
"height": 24
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
100,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "94o/HHJbhLmad0qDGUUIxD"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 16
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "95a1b983-981a-4b0a-854c-7cc38cd2f9d6"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "49bzD0hmZG95bDR0z9zv7g"
},
{
"__type__": "cc.Node",
"_name": "bg_sahua",
"_objFlags": 0,
"_parent": {
"__id__": 15
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 19
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 0,
"g": 255,
"b": 0,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 36,
"height": 24
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
200,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "6fbj5NEBtL84M1ddWZ3ofN"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 18
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "95a1b983-981a-4b0a-854c-7cc38cd2f9d6"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "bdv2r9G15Cf5iHS9cGe3l6"
},
{
"__type__": "cc.Node",
"_name": "bg_sahua",
"_objFlags": 0,
"_parent": {
"__id__": 15
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 21
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 0,
"g": 0,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 36,
"height": 24
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
300,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "efemNhekZGGZdwxpBNu//k"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 20
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "95a1b983-981a-4b0a-854c-7cc38cd2f9d6"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "dcsTjusTBLOruHiDo1qts5"
},
{
"__type__": "cc.Node",
"_name": "bg_sahua",
"_objFlags": 0,
"_parent": {
"__id__": 15
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 23
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 0,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 36,
"height": 24
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
400,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "6dpsMV7MNClKu9hLUKAGIg"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 22
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "95a1b983-981a-4b0a-854c-7cc38cd2f9d6"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "89y9haRHFMSLWCYv/utVZK"
},
{
"__type__": "cc.Node",
"_name": "bg_sahua",
"_objFlags": 0,
"_parent": {
"__id__": 15
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 25
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 0,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 36,
"height": 24
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
500,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "90XMpopvtKNpIHNVfdm4aZ"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 24
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "95a1b983-981a-4b0a-854c-7cc38cd2f9d6"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "9aJsNbk39KDYSrAiFKpBGr"
},
{
"__type__": "cc.Node",
"_name": "bg_sahua",
"_objFlags": 0,
"_parent": {
"__id__": 15
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 27
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 0,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 36,
"height": 24
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
600,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "18l/WuS8pEDJ6Urd+AmtHE"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 26
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "95a1b983-981a-4b0a-854c-7cc38cd2f9d6"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "16QLQ7baZIYZWmd6g6HMdO"
} }
] ]
\ No newline at end of file
...@@ -4,34 +4,41 @@ ...@@ -4,34 +4,41 @@
// - https://docs.cocos.com/creator/manual/en/scripting/reference/attributes.html // - https://docs.cocos.com/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks: // Learn life-cycle callbacks:
// - https://docs.cocos.com/creator/manual/en/scripting/life-cycle-callbacks.html // - https://docs.cocos.com/creator/manual/en/scripting/life-cycle-callbacks.html
import {
showFireworks,
} from '../script/utils';
cc.Class({ cc.Class({
extends: cc.Component, extends: cc.Component,
properties: { properties: {
// foo: {
// // ATTRIBUTES:
// default: null, // The default value will be used only when the component attaching
// // to a node for the first time
// type: cc.SpriteFrame, // optional, default is typeof default
// serializable: true, // optional, default is true
// },
// bar: {
// get () {
// return this._bar;
// },
// set (value) {
// this._bar = value;
// }
// },
}, },
// LIFE-CYCLE CALLBACKS: // LIFE-CYCLE CALLBACKS:
// onLoad () {}, // onLoad () {},
start () { start() {
const BtnFire = cc.find('Canvas/BtnFire');
BtnFire.on('click', () => {
showFireworks(
cc.find('Canvas/Main Camera'),
cc.find('RibbonNodeBase').children,
cc.v2(0, -400), cc.v2(0, 1000), 200, 200
);
showFireworks(
cc.find('Canvas/Main Camera'),
cc.find('RibbonNodeBase').children,
cc.v2(-600, -400), cc.v2(200, 1000), 200, 200
);
showFireworks(
cc.find('Canvas/Main Camera'),
cc.find('RibbonNodeBase').children,
cc.v2(600, -400), cc.v2(-200, 1000), 200, 200
);
});
}, },
// update (dt) {}, // update (dt) {},
......
...@@ -134,43 +134,62 @@ export async function asyncDelay(time) { ...@@ -134,43 +134,62 @@ export async function asyncDelay(time) {
} }
export async function showFireworks(baseNode, nodeList, pos = cc.v2(0, 0), side = cc.v2(0, 100), range = 50, number = 100) { export async function showFireworks(baseNode, nodeList, pos = cc.v2(0, 0), side = cc.v2(0, 100), range = 50, number = 100) {
for (let i = 0; i < number; i++) { new Array(number).fill(' ').forEach(async (_, i) => {
const node = cc.instantiate(nodeList[RandomInt(nodeList.length)]);
node.parent = baseNode; let rabbonNode = new cc.Node();
rabbonNode.parent = baseNode;
rabbonNode.x = pos.x;
rabbonNode.y = pos.y;
rabbonNode.angle = 60 * Math.random() - 30;
let node = cc.instantiate(nodeList[RandomInt(nodeList.length)]);
node.parent = rabbonNode;
node.active = true; node.active = true;
node.x = pos.x; node.x = 0;
node.y = pos.y; node.y = 0;
node.angle = 360 * Math.random(); node.angle = 0;
node.scale = 0.5;
const rate = Math.random(); const rate = Math.random();
const angle = Math.PI * (Math.random() * 2 - 1); const angle = Math.PI * (Math.random() * 2 - 1);
await asyncTweenBy(rabbonNode, 0.3, {
x: side.x * rate + Math.cos(angle) * range * rate,
y: side.y * rate + Math.sin(angle) * range * rate
}, {
easing: 'quadIn'
});
cc.tween(rabbonNode)
.by(8, { y: -2000 })
.start();
rabbonFall(rabbonNode);
await asyncDelay(Math.random());
cc.tween(node) cc.tween(node)
.by(0.3, { .by(0.15, { x: -10, angle: -10 })
x: side.x * rate + Math.cos(angle) * range * rate, .by(0.3, { x: 20, angle: 20 })
y: side.y * rate + Math.sin(angle) * range * rate .by(0.15, { x: -10, angle: -10 })
}) .union()
.call(async () => { .repeatForever()
for (let i = 0; i < 8; i++) { .start();
await rabbonFall(node);
} cc.tween(rabbonNode)
cc.tween(node) .delay(5)
.to(0.3, { opacity: 0 }) .to(0.3, { opacity: 0 })
.call(() => { .call(() => {
node.active = false; node.stopAllActions();
node.parent = null; node.active = false;
node = null; node.parent = null;
}) node = null;
.start();
}) })
.by(8, { y: -2000 })
.start(); .start();
} });
} }
async function rabbonFall(node) { async function rabbonFall(node) {
const time = 1 + Math.random(); const time = 1 + Math.random();
const offsetX = RandomInt(-200, 200) * time; const offsetX = RandomInt(-200, 200) * time;
await asyncTweenBy(node, time, { x: offsetX, angle: offsetX * 60 / 200 }); await asyncTweenBy(node, time, { x: offsetX, angle: offsetX * 60 / 200 });
rabbonFall(node);
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment