Commit 36369998 authored by 李维's avatar 李维

添加音频播放动画

parent a09c7206
...@@ -88,18 +88,21 @@ ...@@ -88,18 +88,21 @@
}, },
{ {
"__id__": 612 "__id__": 612
},
{
"__id__": 638
} }
], ],
"_active": true, "_active": true,
"_components": [ "_components": [
{ {
"__id__": 638 "__id__": 641
}, },
{ {
"__id__": 639 "__id__": 642
}, },
{ {
"__id__": 640 "__id__": 643
} }
], ],
"_prefab": null, "_prefab": null,
...@@ -23161,7 +23164,7 @@ ...@@ -23161,7 +23164,7 @@
}, },
{ {
"__type__": "cc.Node", "__type__": "cc.Node",
"_name": "btn_sound", "_name": "icon_play_audio",
"_objFlags": 0, "_objFlags": 0,
"_parent": { "_parent": {
"__id__": 616 "__id__": 616
...@@ -23184,8 +23187,8 @@ ...@@ -23184,8 +23187,8 @@
}, },
"_contentSize": { "_contentSize": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 105, "width": 61,
"height": 112 "height": 66
}, },
"_anchorPoint": { "_anchorPoint": {
"__type__": "cc.Vec2", "__type__": "cc.Vec2",
...@@ -23219,7 +23222,7 @@ ...@@ -23219,7 +23222,7 @@
"_is3DNode": false, "_is3DNode": false,
"_groupIndex": 0, "_groupIndex": 0,
"groupIndex": 0, "groupIndex": 0,
"_id": "fdVuxuyX9K7pQXbOWKsEdX" "_id": "f7Wvl5uGdHCIiinSCMHVYD"
}, },
{ {
"__type__": "cc.Sprite", "__type__": "cc.Sprite",
...@@ -23233,7 +23236,7 @@ ...@@ -23233,7 +23236,7 @@
"_srcBlendFactor": 770, "_srcBlendFactor": 770,
"_dstBlendFactor": 771, "_dstBlendFactor": 771,
"_spriteFrame": { "_spriteFrame": {
"__uuid__": "b4b6d693-b71e-486a-b834-476e711461f5" "__uuid__": "a1aa94ea-c083-4824-ba40-7fbd8b2316e9"
}, },
"_type": 0, "_type": 0,
"_sizeMode": 1, "_sizeMode": 1,
...@@ -23247,11 +23250,11 @@ ...@@ -23247,11 +23250,11 @@
"_fillRange": 0, "_fillRange": 0,
"_isTrimmedMode": true, "_isTrimmedMode": true,
"_atlas": null, "_atlas": null,
"_id": "7dNKhuld5Lo78FZfSVa0u2" "_id": "542iOh/JFEGrHpYaFOSclW"
}, },
{ {
"__type__": "cc.Node", "__type__": "cc.Node",
"_name": "icon_play_audio", "_name": "btn_sound",
"_objFlags": 0, "_objFlags": 0,
"_parent": { "_parent": {
"__id__": 616 "__id__": 616
...@@ -23274,8 +23277,8 @@ ...@@ -23274,8 +23277,8 @@
}, },
"_contentSize": { "_contentSize": {
"__type__": "cc.Size", "__type__": "cc.Size",
"width": 61, "width": 105,
"height": 65 "height": 112
}, },
"_anchorPoint": { "_anchorPoint": {
"__type__": "cc.Vec2", "__type__": "cc.Vec2",
...@@ -23309,7 +23312,7 @@ ...@@ -23309,7 +23312,7 @@
"_is3DNode": false, "_is3DNode": false,
"_groupIndex": 0, "_groupIndex": 0,
"groupIndex": 0, "groupIndex": 0,
"_id": "b8au8Qh/lAH5Yg55Tf3Ycl" "_id": "fdVuxuyX9K7pQXbOWKsEdX"
}, },
{ {
"__type__": "cc.Sprite", "__type__": "cc.Sprite",
...@@ -23323,7 +23326,7 @@ ...@@ -23323,7 +23326,7 @@
"_srcBlendFactor": 770, "_srcBlendFactor": 770,
"_dstBlendFactor": 771, "_dstBlendFactor": 771,
"_spriteFrame": { "_spriteFrame": {
"__uuid__": "e6a8413e-5383-46fb-8e85-45399c5852f7" "__uuid__": "b4b6d693-b71e-486a-b834-476e711461f5"
}, },
"_type": 0, "_type": 0,
"_sizeMode": 1, "_sizeMode": 1,
...@@ -23337,7 +23340,7 @@ ...@@ -23337,7 +23340,7 @@
"_fillRange": 0, "_fillRange": 0,
"_isTrimmedMode": true, "_isTrimmedMode": true,
"_atlas": null, "_atlas": null,
"_id": "82K3w/4rtE1KU4M0GNfg7P" "_id": "7dNKhuld5Lo78FZfSVa0u2"
}, },
{ {
"__type__": "cc.Node", "__type__": "cc.Node",
...@@ -24112,6 +24115,122 @@ ...@@ -24112,6 +24115,122 @@
"preload": false, "preload": false,
"_id": "dey05oKrBIspvsDa6pOIQz" "_id": "dey05oKrBIspvsDa6pOIQz"
}, },
{
"__type__": "cc.Node",
"_name": "Speaker",
"_objFlags": 0,
"_parent": {
"__id__": 2
},
"_children": [],
"_active": false,
"_components": [
{
"__id__": 639
},
{
"__id__": 640
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 61,
"height": 66
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
3927.123,
-246.816,
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": "1atGgnwfFIu4vMt97HZpTH"
},
{
"__type__": "cc.Animation",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 638
},
"_enabled": true,
"_defaultClip": {
"__uuid__": "d71e7388-ed23-4612-b018-854d0930bdb1"
},
"_clips": [
{
"__uuid__": "d71e7388-ed23-4612-b018-854d0930bdb1"
}
],
"playOnLoad": false,
"_id": "88SEbfAMFGSb/62EiaeKuq"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 638
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "a1aa94ea-c083-4824-ba40-7fbd8b2316e9"
},
"_type": 0,
"_sizeMode": 0,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "88I6640wlIgrAw8CpkalcL"
},
{ {
"__type__": "cc.Canvas", "__type__": "cc.Canvas",
"_name": "", "_name": "",
...@@ -24170,6 +24289,9 @@ ...@@ -24170,6 +24289,9 @@
"selectModal": { "selectModal": {
"__id__": 570 "__id__": 570
}, },
"aniSpeaker": {
"__id__": 638
},
"_id": "eaTVUpqahPfZeO9+sUI7RP" "_id": "eaTVUpqahPfZeO9+sUI7RP"
} }
] ]
\ No newline at end of file
import { import {
playAudioByUrl, playAudioByUrl,
playAnimationOnNode,
loadImageByUrl, loadImageByUrl,
asyncLoadRemote, asyncLoadRemote,
getSprNode, getSprNode,
...@@ -16,6 +17,9 @@ export default class SceneComponent extends MyCocosSceneComponent { ...@@ -16,6 +17,9 @@ export default class SceneComponent extends MyCocosSceneComponent {
@property({type: cc.Node, displayName: "选择窗"}) @property({type: cc.Node, displayName: "选择窗"})
selectModal: cc.Node = null; selectModal: cc.Node = null;
@property({type: cc.Node, displayName: "音频播放动画"})
aniSpeaker: cc.Node = null;
addPreloadImage() { addPreloadImage() {
// TODO 根据自己的配置预加载图片资源 // TODO 根据自己的配置预加载图片资源
this._imageResList.push({ url: this.data.pic_url }); this._imageResList.push({ url: this.data.pic_url });
...@@ -571,22 +575,46 @@ export default class SceneComponent extends MyCocosSceneComponent { ...@@ -571,22 +575,46 @@ export default class SceneComponent extends MyCocosSceneComponent {
// 全局只能有一个音频播放 - 保存音乐id 用于停止 // 全局只能有一个音频播放 - 保存音乐id 用于停止
currentAudioPlay = null; currentAudioPlay = null;
setOneAudioBtn(contentData, hotZoneItemData) { setOneAudioBtn(contentData, hotZoneItemData) {
const {sprNode} = this.newSprNodeByResName(hotZoneItemData, "icon_play_audio"); const {sprNode, picNode} = this.newSprNodeByResName(hotZoneItemData, "icon_play_audio", true);
const aniAudio = cc.instantiate(this.aniSpeaker)
aniAudio.x = 0;
aniAudio.y = 0;
aniAudio.anchorX = aniAudio.anchorY = 0;
aniAudio.active = true;
aniAudio.zIndex = -1;
aniAudio.width = picNode.width;
aniAudio.height = picNode.height;
picNode.addChild(aniAudio);
let aniPlay = null;
sprNode.on("click", async () => { sprNode.on("click", async () => {
if(this.submitted) { if(this.submitted) {
return; return;
} }
// 如果当前正在播放音频 则停止音频 // 如果当前正在播放音频 则停止音频
if(this.currentAudioPlay != null) { if(this.currentAudioPlay != null) {
// 停止音频播放
cc.audioEngine.stop(this.currentAudioPlay); cc.audioEngine.stop(this.currentAudioPlay);
this.currentAudioPlay = null;
// 停止动画
if(aniPlay != null) {
aniPlay.stop();
}
// 显示上层的节点
sprNode.opacity = 255;
return
} }
let audioClip = await asyncLoadRemote(contentData.audio_url); let audioClip = await asyncLoadRemote(contentData.audio_url);
// 需要判断音频是否存在 // 需要判断音频是否存在
if(audioClip) { if(audioClip) {
this.currentAudioPlay = cc.audioEngine.play(audioClip, false, 0.8); this.currentAudioPlay = cc.audioEngine.play(audioClip, false, 0.8);
aniPlay = playAnimationOnNode(aniAudio, "audioPlay");
sprNode.opacity = 1;
cc.audioEngine.setFinishCallback(audioClip, () => { cc.audioEngine.setFinishCallback(audioClip, () => {
this.currentAudioPlay = null; this.currentAudioPlay = null;
aniPlay.stop();
aniPlay = null;
sprNode.opacity = 255;
}); });
} }
}) })
...@@ -708,8 +736,8 @@ export default class SceneComponent extends MyCocosSceneComponent { ...@@ -708,8 +736,8 @@ export default class SceneComponent extends MyCocosSceneComponent {
cc.Color.fromHEX(color, "#333333"); cc.Color.fromHEX(color, "#333333");
inputNode.color = color; inputNode.color = color;
label.string = text; label.string = text;
label.lineHeight = 40; label.lineHeight = 32;
label.fontSize = 40; label.fontSize = 32;
label.verticalAlign = 2; label.verticalAlign = 2;
label.horizontalAlign = 2; label.horizontalAlign = 2;
return inputNode; return inputNode;
......
This diff is collapsed.
...@@ -183,7 +183,11 @@ export function getSprNodeByUrl(url, cb) { ...@@ -183,7 +183,11 @@ export function getSprNodeByUrl(url, cb) {
}) })
} }
export function playAnimationOnNode(node, aniName) {
const animationState = node.getComponent(cc.Animation).getAnimationState(aniName);
animationState.play();
return animationState;
}
export function playAudio(audioClip, cb = null) { export function playAudio(audioClip, cb = null) {
if (audioClip) { if (audioClip) {
......
{ {
"ver": "2.3.5", "ver": "2.3.5",
"uuid": "5fe45565-7e2f-4f58-b27a-bfb9819ad0ce", "uuid": "4db385bc-158a-497b-a7c3-be019e759dc2",
"type": "sprite", "type": "sprite",
"wrapMode": "clamp", "wrapMode": "clamp",
"filterMode": "bilinear", "filterMode": "bilinear",
...@@ -11,19 +11,19 @@ ...@@ -11,19 +11,19 @@
"height": 70, "height": 70,
"platformSettings": {}, "platformSettings": {},
"subMetas": { "subMetas": {
"icon_play_audio": { "audio_0": {
"ver": "1.0.4", "ver": "1.0.4",
"uuid": "e6a8413e-5383-46fb-8e85-45399c5852f7", "uuid": "cb648ab2-0ec6-4442-887c-b5cda37edf87",
"rawTextureUuid": "5fe45565-7e2f-4f58-b27a-bfb9819ad0ce", "rawTextureUuid": "4db385bc-158a-497b-a7c3-be019e759dc2",
"trimType": "auto", "trimType": "auto",
"trimThreshold": 1, "trimThreshold": 1,
"rotated": false, "rotated": false,
"offsetX": 0.5, "offsetX": 0.5,
"offsetY": -2.5, "offsetY": -1,
"trimX": 5, "trimX": 5,
"trimY": 5, "trimY": 3,
"width": 61, "width": 61,
"height": 65, "height": 66,
"rawWidth": 70, "rawWidth": 70,
"rawHeight": 70, "rawHeight": 70,
"borderTop": 0, "borderTop": 0,
......
{
"ver": "2.3.5",
"uuid": "c93c99e7-651a-47a9-be4e-7f8acd2e439a",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 70,
"height": 70,
"platformSettings": {},
"subMetas": {
"audio_1": {
"ver": "1.0.4",
"uuid": "31e1bbc2-ae96-4cee-865e-0436092a974f",
"rawTextureUuid": "c93c99e7-651a-47a9-be4e-7f8acd2e439a",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0.5,
"offsetY": -1,
"trimX": 5,
"trimY": 3,
"width": 61,
"height": 66,
"rawWidth": 70,
"rawHeight": 70,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "9b5b45b4-b114-4cf7-8aa0-8858b60dcb7d",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 70,
"height": 70,
"platformSettings": {},
"subMetas": {
"audio_2": {
"ver": "1.0.4",
"uuid": "a1aa94ea-c083-4824-ba40-7fbd8b2316e9",
"rawTextureUuid": "9b5b45b4-b114-4cf7-8aa0-8858b60dcb7d",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0.5,
"offsetY": -1,
"trimX": 5,
"trimY": 3,
"width": 61,
"height": 66,
"rawWidth": 70,
"rawHeight": 70,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"__type__": "cc.AnimationClip",
"_name": "audioPlay",
"_objFlags": 0,
"_native": "",
"_duration": 0.7666666666666667,
"sample": 60,
"speed": 1,
"wrapMode": 2,
"curveData": {
"comps": {
"cc.Sprite": {
"spriteFrame": [
{
"frame": 0,
"value": {
"__uuid__": "cb648ab2-0ec6-4442-887c-b5cda37edf87"
}
},
{
"frame": 0.25,
"value": {
"__uuid__": "31e1bbc2-ae96-4cee-865e-0436092a974f"
}
},
{
"frame": 0.5,
"value": {
"__uuid__": "a1aa94ea-c083-4824-ba40-7fbd8b2316e9"
}
},
{
"frame": 0.75,
"value": {
"__uuid__": "cb648ab2-0ec6-4442-887c-b5cda37edf87"
}
}
]
}
}
},
"events": []
}
\ No newline at end of file
{
"ver": "2.1.0",
"uuid": "d71e7388-ed23-4612-b018-854d0930bdb1",
"subMetas": {}
}
\ 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