Commit 175b3d93 authored by 张子元's avatar 张子元

feat:1构建背景 2添加底部海螺 3产生气泡

parent 503b6bee
This diff is collapsed.
......@@ -6,7 +6,6 @@ const { ccclass, property } = cc._decorator;
@ccclass
export default class SceneComponent extends MyCocosSceneComponent {
addPreloadImage() {
// TODO 根据自己的配置预加载图片资源
this._imageResList.push({ url: this.data.pic_url });
......@@ -24,195 +23,58 @@ export default class SceneComponent extends MyCocosSceneComponent {
async onLoadEnd() {
// TODO 加载完成后的逻辑写在这里, 下面的代码仅供参考
this.initData();
this.initView();
this.initListener();
this.initGame();
}
_cantouch = null;
private list: Array<{ type, text, right, imgage, duration, content, audio }>;
private recordFlag: boolean;//录音模式
initData() {
// 所有全局变量 默认都是null
this._cantouch = true;
let data = this.data;
this.recordFlag = data.recordFlag;
this.list = data.questions[0].options;
this.layers = [];
this.initView()
}
private layer_record: cc.Node;
private layer_game: cc.Node;
private layer_word: cc.Node;
private layer_word_little: cc.Node;
private layers: Array<cc.Node>;
initView() {
this.layer_record = pg.view.find(this, 'layer_record')
this.layer_game = pg.view.find(this, 'layer_game')
this.layer_word = pg.view.find(this, 'layer_word')
this.layer_word_little = pg.view.find(this, 'layer_word_little')
}
initListener() {
pg.event.on('layer_record_score', (score) => {
this.onRecorScore(score);
})
}
private get CurrentData() {
return this.list[this.count]
}
private get NextData() {
return this.list[this.count + 1]
}
private get OutData() {
return this.list[this.count + 2]
}
private get CurrentLayer() {
return this.layers[0]
}
private get LittleLayer() {
return this.layers[1]
}
private get OutLayer() {
return this.layers[2]
}
private count: number;
initGame() {
this.count = 0;
let currentLayer = this.createLayer();
this.updateLayer(currentLayer, this.CurrentData)
this.layers.push(currentLayer)
let nextLayer = this.createLittleLayer();
this.updateLayer(nextLayer, this.NextData)
this.layers.push(nextLayer)
this.startPlay();
}
startPlay() {
if (this.recordFlag) {
this.layer_record.active = true;
} else {
if (this.CurrentData.type.indexOf('audio') > -1) {
pg.event.emit('img_voice_play_voice_start')
pg.audio.playAudioByUrl(this.CurrentData.audio, () => {
pg.event.emit('img_voice_play_voice_end')
this.nextLayer();
})
}
}
}
onRecorScore(score) {
this.layer_record.active = false;
if (score < 10) {
pg.event.on('layer_right_show_tryagain_end', () => {
// alert('test')
if (this.recordFlag) {
this.layer_record.active = true;
}
})
pg.event.emit('layer_right_show_tryagain')
} else if (score < 60) {
pg.event.on('layer_right_show_good_end', () => {
this.nextLayer();
})
pg.event.emit('layer_right_show_good')
} else {
pg.event.on('layer_right_show_excellent_end', () => {
this.nextLayer();
})
pg.event.emit('layer_right_show_excellent')
}
}
nextLayer() {
if (!this.NextData) {
this.gameOver();
return;
}
if (this.OutData) {
let outLayer = this.createLittleLayer();
this.updateLayer(outLayer, this.OutData)
outLayer.x = -1500;
this.layers.push(outLayer)
}
cc.tween(this.CurrentLayer).to(3, { x: 2000 }).start();
if (this.LittleLayer) {
cc.tween(this.LittleLayer).to(3, { x: 0, y: 0, scale: 1 }).start();
}
if (this.OutLayer) {
cc.tween(this.OutLayer).to(3, { x: this.layer_word_little.x, y: this.layer_word_little.y }).start();
}
this.scheduleOnce(() => {
this.count++;
this.layers.shift();
this.startPlay();
}, 3)
}
gameOver() {
}
createLayer() {
let layer = pg.view.clone(this.layer_word);
layer.active = true;
this.layer_game.addChild(layer)
return layer;
}
createLittleLayer() {
let layer = pg.view.clone(this.layer_word);
layer.active = true;
layer.x = this.layer_word_little.x;
layer.y = this.layer_word_little.y;
layer.scale = this.layer_word_little.scale;
this.layer_game.addChild(layer)
return layer;
}
updateLayer(layer, data) {
let bg = pg.view.find(layer, 'bg');
let c1 = pg.view.find(bg, 'c1');
let c2 = pg.view.find(bg, 'c2');
let c3 = pg.view.find(bg, 'c3');
let c4 = pg.view.find(bg, 'c4');
let img = pg.view.find(layer, 'img');
let label = pg.view.find(layer, 'label');
let voice = pg.view.find(layer, 'voice');
// 根据数据来渲染
img.active = true;
pg.view.setNetImg(img, data.image, { w: 600, h: 370 })
label.active = data.type == 'img_txt' || data.type == 'img_txt_audio'
pg.view.setString(label, data.text);
voice.active = data.type == 'img_audio' || data.type == 'img_txt_audio'
pg.view.touchOn(voice, this.onTouchVoice, this);
if (this.recordFlag) {
c1.active = false;
c2.active = false;
c3.active = false;
c4.active = false;
}
}
onTouchVoice(e) {
let layer = e.target.parent;
if (layer === this.CurrentLayer) {
pg.event.emit('img_voice_play_voice_start')
pg.audio.playAudioByUrl(this.CurrentData.audio, () => {
pg.event.emit('img_voice_play_voice_end')
})
}
}
playLocalAudio(audioName) {
const audio = cc.find(`Canvas/res/audio/${audioName}`).getComponent(cc.AudioSource);
return new Promise((resolve, reject) => {
const id = cc.audioEngine.playEffect(audio.clip, false);
cc.audioEngine.setFinishCallback(id, () => {
resolve(id);
});
})
// 底部海螺
let bottom_megaphone = pg.view.find(this, 'layer_game/bg/bottom_megaphone')
// 开始海螺从底部升起
let btn = cc.tween(bottom_megaphone)
btn.to(1.5, { y: -438 })
.call(() => {
// 海螺第一次从底部升起后自动制造气泡一次
this.create_bubbles()
})
btn.start()
pg.view.touchOn(bottom_megaphone, this.create_bubbles, this)
let paoaParent = pg.view.find(this, 'layer_game/bg/paopao/bubble')
// 点击泡泡
pg.view.touchOn(paoaParent, this.touchPaoPao, this)
}
// 制造气泡
create_bubbles() {
let bottom_megaphone = pg.view.find(this, 'layer_game/bg/bottom_megaphone')
let newPaoPao = cc.instantiate(bottom_megaphone)
let btn = cc.tween(bottom_megaphone)
btn.to(0.1, { x: -5 }).to(0.1, { x: 0 }).to(0.1, { x: 5 }).to(0.1, { x: 0 })
btn.to(0.1, { x: -5 }).to(0.1, { x: 0 }).to(0.1, { x: 5 }).to(0.1, { x: 0 })
.call(() => {
let paoaoParent = pg.view.find(this, 'layer_game/bg/paopao')
let paopao = pg.view.find(this, 'layer_game/bg/paopao/bubble')
let broken = pg.view.find(this, 'layer_game/bg/paopao/bubble_broken')
paoaoParent.x = 135
paoaoParent.y = -450
paopao.width = 70
paopao.height = 70
paoaoParent.opacity = 0
pg.view.visible(paoaoParent, true)
pg.view.visible(broken, false)
cc.tween(paoaoParent).to(0.8, {opacity: 255}).call(() => {
cc.tween(paoaoParent).to(2, {x: Math.floor(Math.random()*900), y: Math.floor(Math.random()*300), scale: 3}).start()
}).start()
})
btn.start()
}
// 点击泡泡
touchPaoPao() {
// 成功 泡泡破碎 里面的内容消失
// 失败 泡泡左右微晃两次
let fail = pg.view.find(this, 'layer_game/bg/paopao/bubble')
let btn = cc.tween(fail)
btn.to(0.1, { x: -5 }).by(0.1, { x: 0 }).by(0.1, { x: 5 }).by(0.1, { x: 0 })
btn.to(0.1, { x: -5 }).by(0.1, { x: 0 }).by(0.1, { x: 5 }).by(0.1, { x: 0 })
btn.start()
}
}
export const defaultData =
{
"recordFlag": true,
"title": "test",
"questionText": "",
"questionTextAudio": "",
"questions": [
{
"questionAudio": "", "duration": 120,
"options": [
{ "type": "img_audio", "image": "http://staging-teach.cdn.ireadabc.com/875862129c75a075b3d710f541258a00.png", "audio": "http://staging-teach.cdn.ireadabc.com/43839adb578c7e01456748b8a176a0c3_l.mp3", "text": "", "duration": 10, "content": "egg", "right": false },
{ "type": "img_txt_audio", "image": "http://staging-teach.cdn.ireadabc.com/011cf423d6fd8760e810644ca6070e34.png", "audio": "http://staging-teach.cdn.ireadabc.com/43839adb578c7e01456748b8a176a0c3_l.mp3", "text": "hammer", "duration": 10, "content": "hammer", "right": false },
{ "type": "img_txt_audio", "image": "http://staging-teach.cdn.ireadabc.com/befdc1801d93fd95b3a8ee7c7a2d2d05.png", "audio": "http://staging-teach.cdn.ireadabc.com/43839adb578c7e01456748b8a176a0c3_l.mp3", "text": "clound", "duration": 10, "content": "clound", "right": false, "audioName": "敲碎蛋的声音.mp3" }]
}], "bgAudio": "", "bgAudioName": "", "audioName": ""
}
{"onlineFlg":false,"title":"钓鱼大作战","questionText":"海洋里有很多鱼,每条鱼身上都藏着魔法信息!亲爱的小玩家,请仔细听游戏指令,找到含有正确魔法信息的鱼,快速完成钓鱼。 在本次的游戏中,你将和其他玩家进行PK,游戏结束,钓鱼数量最多的玩家,将获得胜利。最后根据钓鱼的数量,你将获得相应的能量石奖励!开始挑战吧!","questionTextAudio":"http://staging-teach.cdn.ireadabc.com/e422c682ff3304a532937db64573caa4.mp3","questions":[{"questionAudio":"http://staging-teach.cdn.ireadabc.com/c9db9c8f9c256b928a7f0e1498963404_l.mp3","duration":120,"options":[{"type":"img","image":"http://staging-teach.cdn.ireadabc.com/7782399d0ad0b9578b2109c620d64465.png","audio":"","text":"","right":true},{"type":"img","image":"http://staging-teach.cdn.ireadabc.com/e283a9417dbb578b83c05c5969b4865b.png","audio":"","text":"","right":true},{"type":"img","image":"http://staging-teach.cdn.ireadabc.com/bd01e5bfb67be451fc282671d1b9d883.png","audio":"","text":"","right":false},{"type":"img","image":"http://staging-teach.cdn.ireadabc.com/5ac88495707336f3d34708f0f174a8f0.jpg","audio":"","text":"","right":false}],"audioName":"ready go.mp3"},{"questionAudio":"http://staging-teach.cdn.ireadabc.com/cb76dbc838567b58e2af36e2d2faa923_l.mp3","duration":120,"options":[{"type":"txt","image":"","audio":"","text":"push","right":false},{"type":"txt","image":"","audio":"","text":"monkey","right":true},{"type":"txt","image":"","audio":"","text":"book","right":true},{"type":"txt","image":"","audio":"","text":"bee","right":false}],"audioName":"图片卡片出现.mp3"},{"questionAudio":"http://staging-teach.cdn.ireadabc.com/6d742645880f902efae878facc78da07_l.mp3","duration":120,"options":[{"type":"img","image":"http://staging-teach.cdn.ireadabc.com/3a7fdd71c900985e8f493d8e4035bf84.png","audio":"","text":"","right":false},{"type":"img","image":"http://staging-teach.cdn.ireadabc.com/e6ea7e0efa41ddfbcbbd6e01581a1d2f.png","audio":"","text":"","right":false},{"type":"txt","image":"","audio":"","text":"like","right":false},{"type":"txt","image":"","audio":"","text":"six","right":false}],"audioName":"请在5秒内说出正确答案.mp3"}],"bgAudio":"","bgAudioName":"","audioName":""}
// {
// "recordFlag": true,
// "title": "test",
......
{
"ver": "1.1.2",
"uuid": "abc6e1ca-cb47-4af6-a7fd-d9306376596f",
"isBundle": false,
"bundleName": "",
"priority": 1,
"compressionType": {},
"optimizeHotUpdate": {},
"inlineSpriteFrames": {},
"isRemoteBundle": {},
"subMetas": {}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "bd769e09-b156-4179-aaf6-86f22dfd853e",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 1920,
"height": 1080,
"platformSettings": {},
"subMetas": {
"bg": {
"ver": "1.0.4",
"uuid": "451dd74e-2fb6-4165-ac42-80ad212cb1bb",
"rawTextureUuid": "bd769e09-b156-4179-aaf6-86f22dfd853e",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0,
"offsetY": 0,
"trimX": 0,
"trimY": 0,
"width": 1920,
"height": 1080,
"rawWidth": 1920,
"rawHeight": 1080,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "43b48f56-b6a5-482f-ba5d-7cc5b66c638c",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 400,
"height": 200,
"platformSettings": {},
"subMetas": {
"bottom_megaphone": {
"ver": "1.0.4",
"uuid": "395cc8c2-675f-4316-8528-fa7fee5faf07",
"rawTextureUuid": "43b48f56-b6a5-482f-ba5d-7cc5b66c638c",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": -4,
"offsetY": 0,
"trimX": 18,
"trimY": 0,
"width": 356,
"height": 200,
"rawWidth": 400,
"rawHeight": 200,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "887b90a3-980a-40b5-abab-26476f39c31e",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 450,
"height": 450,
"platformSettings": {},
"subMetas": {
"bubble": {
"ver": "1.0.4",
"uuid": "ee7ceefa-fc90-447c-ad40-9909bc242a4b",
"rawTextureUuid": "887b90a3-980a-40b5-abab-26476f39c31e",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 1,
"offsetY": -6,
"trimX": 22,
"trimY": 27,
"width": 408,
"height": 408,
"rawWidth": 450,
"rawHeight": 450,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "6b7d616d-c25b-420a-ad44-b49f600b49a3",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 483,
"height": 472,
"platformSettings": {},
"subMetas": {
"bubble_broken": {
"ver": "1.0.4",
"uuid": "d467620d-7515-405b-9d15-3693bc6beb45",
"rawTextureUuid": "6b7d616d-c25b-420a-ad44-b49f600b49a3",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0,
"offsetY": 0,
"trimX": 0,
"trimY": 0,
"width": 483,
"height": 472,
"rawWidth": 483,
"rawHeight": 472,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
[
{
"__type__": "cc.SceneAsset",
"_name": "",
"_objFlags": 0,
"_native": "",
"scene": {
"__id__": 1
}
},
{
"__type__": "cc.Scene",
"_objFlags": 0,
"_parent": null,
"_children": [
{
"__id__": 2
}
],
"_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,
"y": 0
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
0,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_is3DNode": true,
"_groupIndex": 0,
"groupIndex": 0,
"autoReleaseAssets": false,
"_id": "80e5878a-4056-40c6-9d42-0202779a00d0"
},
{
"__type__": "cc.Node",
"_name": "Canvas",
"_objFlags": 0,
"_parent": {
"__id__": 1
},
"_children": [
{
"__id__": 3
}
],
"_active": true,
"_components": [
{
"__id__": 5
},
{
"__id__": 6
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 960,
"height": 640
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
480,
320,
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": "3cBzD9IotHb5Pj5l8g4Kym"
},
{
"__type__": "cc.Node",
"_name": "Main Camera",
"_objFlags": 0,
"_parent": {
"__id__": 2
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 4
}
],
"_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": [
0,
0,
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": "9eZOLudRdCqJ30e4xDyXYZ"
},
{
"__type__": "cc.Camera",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 3
},
"_enabled": true,
"_cullingMask": 4294967295,
"_clearFlags": 7,
"_backgroundColor": {
"__type__": "cc.Color",
"r": 0,
"g": 0,
"b": 0,
"a": 255
},
"_depth": -1,
"_zoomRatio": 1,
"_targetTexture": null,
"_fov": 60,
"_orthoSize": 10,
"_nearClip": 1,
"_farClip": 4096,
"_ortho": true,
"_rect": {
"__type__": "cc.Rect",
"x": 0,
"y": 0,
"width": 1,
"height": 1
},
"_renderStages": 1,
"_alignWithScreen": true,
"_id": "9eFwUZ+NpBK6r8zbor4ASZ"
},
{
"__type__": "cc.Canvas",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 2
},
"_enabled": true,
"_designResolution": {
"__type__": "cc.Size",
"width": 960,
"height": 640
},
"_fitWidth": false,
"_fitHeight": true,
"_id": "c0+F2WFRNDjbsIROVJbsav"
},
{
"__type__": "cc.Widget",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 2
},
"_enabled": true,
"alignMode": 1,
"_target": null,
"_alignFlags": 45,
"_left": 0,
"_right": 0,
"_top": 0,
"_bottom": 0,
"_verticalCenter": 0,
"_horizontalCenter": 0,
"_isAbsLeft": true,
"_isAbsRight": true,
"_isAbsTop": true,
"_isAbsBottom": true,
"_isAbsHorizontalCenter": true,
"_isAbsVerticalCenter": true,
"_originalWidth": 0,
"_originalHeight": 0,
"_id": "32T3e0fMBHYpgPSorh6UPM"
}
]
\ No newline at end of file
{
"ver": "1.2.9",
"uuid": "ba2f24ba-f64f-40a7-bbf0-47f557a7c27c",
"asyncLoadAssets": false,
"autoReleaseAssets": false,
"subMetas": {}
}
\ No newline at end of file
This diff is collapsed.
......@@ -6,7 +6,6 @@
"experimentalDecorators": true,
"skipLibCheck": true,
"outDir": "temp/vscode-dist",
"allowJs": true,
"forceConsistentCasingInFileNames": true
},
"exclude": [
......
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