Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
O
OP_18
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
template admin
OP_18
Commits
81058fdf
Commit
81058fdf
authored
Dec 14, 2021
by
limingzhe
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 适配窗口
parent
03c59257
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
29 additions
and
535 deletions
+29
-535
OP_18.js
assets/OP_18/scene/OP_18.js
+23
-8
OP_18_.js
assets/OP_18/scene/OP_18_.js
+6
-527
No files found.
assets/OP_18/scene/OP_18.js
View file @
81058fdf
...
...
@@ -431,20 +431,28 @@ cc.Class({
const
letterS
=
this
.
data
.
letter
.
toLowerCase
();
const
itemLetterBig
=
getSprNode
(
'
letter/
'
+
letterS
+
'
_1_1
'
);
itemLetterBig
.
x
=
-
this
.
canvas
.
width
/
2
+
70
*
this
.
_mapScaleMin
;
itemLetterBig
.
y
=
200
*
this
.
_mapScaleMin
;
//
itemLetterBig.x = -this.canvas.width / 2 + 70 * this._mapScaleMin;
//
itemLetterBig.y = 200 * this._mapScaleMin;
itemLetterBig
.
scale
=
this
.
_mapScaleMin
;
itemLetterBig
.
anchorY
=
0.28
this
.
canvas
.
addChild
(
itemLetterBig
);
const
itemBgBig
=
getSprNode
(
'
item_bg
'
);
itemBgBig
.
scale
=
this
.
_mapScaleMin
;
itemBgBig
.
x
=
itemLetterBig
.
x
+
70
*
this
.
_mapScaleMin
;
itemBgBig
.
y
=
itemLetterBig
.
y
;
//
itemBgBig.x = itemLetterBig.x + 70 * this._mapScaleMin;
//
itemBgBig.y = itemLetterBig.y;
itemBgBig
.
anchorX
=
0
;
this
.
canvas
.
addChild
(
itemBgBig
);
this
.
itemBgBig
=
itemBgBig
;
const
letterW
=
50
*
this
.
_mapScaleMin
;
itemBgBig
.
x
=
-
itemBgBig
.
width
/
2
*
itemBgBig
.
scaleX
+
letterW
;
itemBgBig
.
y
=
200
*
this
.
_mapScaleMin
;
itemLetterBig
.
x
=
itemBgBig
.
x
-
letterW
;
itemLetterBig
.
y
=
itemBgBig
.
y
;
const
letterAnim0
=
this
.
getLetterAnimBig0
(
letterS
);
letterAnim0
.
x
=
100
;
...
...
@@ -472,20 +480,27 @@ cc.Class({
const
letterS
=
this
.
data
.
letter
.
toLowerCase
();
const
itemLetterSmall
=
getSprNode
(
'
letter/
'
+
letterS
+
'
_0_1
'
);
itemLetterSmall
.
x
=
-
this
.
canvas
.
width
/
2
+
70
*
this
.
_mapScaleMin
;
itemLetterSmall
.
y
=
-
30
*
this
.
_mapScaleMin
;
//
itemLetterSmall.x = -this.canvas.width / 2 + 70 * this._mapScaleMin;
//
itemLetterSmall.y = -30 * this._mapScaleMin;
itemLetterSmall
.
scale
=
this
.
_mapScaleMin
;
this
.
canvas
.
addChild
(
itemLetterSmall
);
const
itemBgSmall
=
getSprNode
(
'
item_bg
'
);
itemBgSmall
.
scale
=
this
.
_mapScaleMin
;
itemBgSmall
.
x
=
itemLetterSmall
.
x
+
70
*
this
.
_mapScaleMin
;
itemBgSmall
.
y
=
itemLetterSmall
.
y
;
//
itemBgSmall.x = itemLetterSmall.x + 70 * this._mapScaleMin;
//
itemBgSmall.y = itemLetterSmall.y;
itemBgSmall
.
anchorX
=
0
;
this
.
canvas
.
addChild
(
itemBgSmall
);
this
.
itemBgSmall
=
itemBgSmall
;
const
letterW
=
50
*
this
.
_mapScaleMin
;
itemBgSmall
.
x
=
-
itemBgSmall
.
width
/
2
*
itemBgSmall
.
scaleX
+
letterW
;
itemBgSmall
.
y
=
-
30
*
this
.
_mapScaleMin
;
itemLetterSmall
.
x
=
itemBgSmall
.
x
-
letterW
;
itemLetterSmall
.
y
=
itemBgSmall
.
y
;
const
letterAnim0
=
this
.
getLetterAnimSmall0
(
letterS
);
letterAnim0
.
x
=
100
;
letterAnim0
.
y
=
0
;
...
...
assets/OP_18/scene/OP_18_.js
View file @
81058fdf
...
...
@@ -371,19 +371,21 @@ cc.Class({
const
letterS
=
this
.
data
.
letter
.
toLowerCase
();
const
itemLetterBig
=
getSprNode
(
'
letter/
'
+
letterS
+
'
_1_1
'
);
itemLetterBig
.
x
=
-
this
.
canvas
.
width
/
2
+
70
*
this
.
_mapScaleMin
;
itemLetterBig
.
y
=
200
*
this
.
_mapScaleMin
;
itemLetterBig
.
scale
=
this
.
_mapScaleMin
;
itemLetterBig
.
anchorY
=
0.28
this
.
canvas
.
addChild
(
itemLetterBig
);
const
itemBgBig
=
getSprNode
(
'
item_bg
'
);
itemBgBig
.
scale
=
this
.
_mapScaleMin
;
itemBgBig
.
x
=
itemLetterBig
.
x
+
70
*
this
.
_mapScaleMin
;
itemBgBig
.
y
=
itemLetterBig
.
y
;
itemBgBig
.
anchorX
=
0
;
this
.
canvas
.
addChild
(
itemBgBig
);
const
letterW
=
300
*
this
.
_mapScaleMin
;
// itemBgBig.x = this.canvas.width / 2 - itemBgBig.width / 2 * itemBgBig.scaleX + letterW // itemLetterBig.x + 70 * this._mapScaleMin;
itemBgBig
.
y
=
200
*
this
.
_mapScaleMin
;
// itemLetterBig.x = itemBgBig.x - letterW / 2;
itemLetterBig
.
y
=
itemBgBig
.
y
;
const
letterAnim0
=
this
.
getLetterAnimBig0
(
letterS
);
letterAnim0
.
x
=
100
;
...
...
@@ -697,126 +699,6 @@ cc.Class({
_curIndex
:
null
,
initPic
()
{
let
exercises
=
this
.
data
.
exercises
;
this
.
getSprNodeByUrl
(
exercises
.
picUrl
,
(
sprNode
)
=>
{
let
pic
=
cc
.
find
(
"
Canvas/content/bg_green/pic
"
);
const
picNode
=
sprNode
;
picNode
.
scale
=
pic
.
width
/
picNode
.
width
;
picNode
.
x
=
0
;
picNode
.
y
=
0
;
pic
.
addChild
(
picNode
);
});
let
textNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text
"
);
textNode
.
initScale
=
textNode
.
scale
;
let
wordNodeArr
=
[];
let
wordArr
=
this
.
data
.
exercises
.
wordArr
;
for
(
let
i
=
0
;
i
<
wordArr
.
length
;
++
i
)
{
if
(
!
wordArr
[
i
].
val
)
{
continue
;
}
//首字母
let
initial
=
wordArr
[
i
].
val
.
substr
(
0
,
1
);
let
label
=
this
.
getWord
(
initial
,
200
,
true
);
label
.
isInitial
=
true
;
wordNodeArr
.
push
(
label
);
//其余字母
let
last
=
wordArr
[
i
].
val
.
substr
(
1
);
let
lastLabel
=
this
.
getWord
(
last
,
200
,
false
);
wordNodeArr
.
push
(
lastLabel
);
}
textNode
.
wordNodeArr
=
wordNodeArr
;
this
.
resetTextPosition
();
this
.
_curIndex
=
0
;
},
initBtn
()
{
},
getWord
(
wordVal
,
size
,
isInitial
)
{
let
color
=
new
cc
.
color
();
color
.
fromHEX
(
'
#000000
'
);
const
labelNode
=
new
cc
.
Node
();
labelNode
.
color
=
color
;
const
label
=
labelNode
.
addComponent
(
cc
.
Label
);
label
.
lineHeight
=
size
;
label
.
fontSize
=
size
;
label
.
font
=
cc
.
find
(
'
Canvas/res/font/MuliBold-YzEVy
'
).
getComponent
(
cc
.
Label
).
font
;
label
.
string
=
wordVal
;
labelNode
.
x
=
0
;
labelNode
.
y
=
0
;
let
widget
=
labelNode
.
addComponent
(
cc
.
Widget
);
widget
.
isAlignBottom
=
true
;
widget
.
bottom
=
-
size
/
2
;
widget
.
updateAlignment
();
labelNode
.
addComponent
(
cc
.
Button
);
labelNode
.
on
(
'
click
'
,
()
=>
{
if
(
!
this
.
_cantouch
)
{
return
;
}
//设置不可点击
this
.
_cantouch
=
false
;
playAudio
(
this
.
audioBtn
.
clip
,
()
=>
{
//如果是首字母,则添加点击事件
if
(
isInitial
)
{
this
.
playTextAutio
(()
=>
{
this
.
_curIndex
++
;
this
.
moveHand
(
this
.
_curIndex
,
()
=>
{
this
.
_cantouch
=
true
;
this
.
showEnd
();
})
})
}
else
{
//显示完,则播放音频
if
(
this
.
_shown
)
{
this
.
playTextAutio
(()
=>
{
this
.
_cantouch
=
true
;
});
}
else
{
this
.
_cantouch
=
true
;
}
}
})
})
return
labelNode
;
},
playAni
(
name
,
times
=
1
)
{
...
...
@@ -848,387 +730,9 @@ cc.Class({
return
state
;
},
moveHand
(
index
,
callback
=
null
)
{
let
textNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text
"
);
let
wordNodeArr
=
textNode
.
wordNodeArr
let
wordNode
=
wordNodeArr
[
2
*
index
];
if
(
!
wordNode
)
{
if
(
callback
)
{
callback
();
}
return
;
}
let
handNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text/icon_hand
"
);
handNode
.
x
=
wordNode
.
x
;
this
.
handAni
();
if
(
callback
)
{
callback
();
}
},
/**
* 播放文本音频
* @param {*} callback
*/
playTextAutio
(
callback
=
null
)
{
this
.
playAudioByUrl
(
this
.
data
.
exercises
.
audioUrl
,
()
=>
{
//停止监听动画
this
.
_stopAni
=
true
;
if
(
callback
)
{
callback
();
}
},(
audioId
)
=>
{
//显示完成,不再播放动画
if
(
this
.
_shown
)
{
return
;
}
//设置可播放动画
this
.
_stopAni
=
false
;
//隐藏手指
let
handNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text/icon_hand
"
);
handNode
.
opacity
=
0
;
let
lyrics
=
this
.
data
.
exercises
.
lrcData
.
lyrics
;
//临时音频打点数组
let
arr
=
JSON
.
parse
(
JSON
.
stringify
(
lyrics
));
console
.
log
(
arr
);
this
.
monitor
(
audioId
,
arr
);
})
},
/**
* 重新设置文字位置
*/
resetTextPosition
()
{
let
textNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text
"
);
let
wordNodeArr
=
textNode
.
wordNodeArr
;
//间隔
let
space
=
40
;
let
tW
=
0
;
for
(
let
i
=
0
;
i
<
wordNodeArr
.
length
;
++
i
)
{
let
wordNode
=
wordNodeArr
[
i
];
wordNode
.
removeFromParent
();
wordNode
.
parent
=
textNode
;
tW
+=
wordNode
.
width
;
let
widget
=
wordNode
.
getComponent
(
cc
.
Widget
);
widget
.
bottom
=
-
wordNode
.
getComponent
(
cc
.
Label
).
fontSize
/
2
;
widget
.
updateAlignment
();
wordNode
.
initScale
=
wordNode
.
scale
;
}
tW
+=
(
this
.
data
.
exercises
.
wordArr
.
length
-
1
)
*
space
;
let
startX
=
-
tW
/
2
;
for
(
let
i
=
0
;
i
<
wordNodeArr
.
length
;
++
i
)
{
let
width
=
wordNodeArr
[
i
].
width
;
wordNodeArr
[
i
].
x
=
startX
+
width
/
2
;
startX
+=
width
;
if
(
wordNodeArr
[
i
].
isInitial
)
{
continue
;
}
startX
+=
space
;
}
if
(
tW
>
textNode
.
width
){
const
sx
=
textNode
.
width
/
tW
;
textNode
.
scale
=
Math
.
round
(
sx
*
1000
)
/
1000
;
textNode
.
initScale
=
textNode
.
scale
;
}
},
/**
* 显示结束
*/
_shown
:
null
,
showEnd
()
{
console
.
log
(
'
in showEnd
'
);
if
(
this
.
_curIndex
<
this
.
data
.
exercises
.
wordArr
.
length
)
{
return
;
}
if
(
this
.
_shown
)
{
return
;
}
this
.
_shown
=
true
;
let
handNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text/icon_hand
"
);
handNode
.
opacity
=
0
;
this
.
_stop
=
true
;
//播放动画
const
state
=
this
.
playAni
(
'
finish
'
,
0
);
//播放引导音频2
this
.
playAudioByUrl
(
this
.
data
.
guideAudioUrl2
,
()
=>
{
state
.
stop
();
this
.
playAni
(
'
normal
'
,
0
);
this
.
showPhotoBtn
();
});
},
_stop
:
null
,
_tween
:
null
,
handAni
(){
let
handNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text/icon_hand
"
);
handNode
.
opacity
=
255
;
handNode
.
y
=
handNode
.
initY
;
const
move
=
()
=>
{
this
.
_tween
=
cc
.
tween
(
handNode
)
.
to
(
0.5
,{
y
:
handNode
.
initY
+
50
})
.
to
(
0.5
,{
y
:
handNode
.
initY
})
.
call
(()
=>
{
if
(
!
this
.
_stop
){
move
()
}
})
.
start
();
}
this
.
_stop
=
false
;
move
();
},
_stopAni
:
null
,
monitor
(
audioId
,
arr
){
if
(
this
.
_stopAni
){
return
;
}
this
.
_stopAni
=
false
;
let
currentTime
=
cc
.
audioEngine
.
getCurrentTime
(
audioId
);
let
len
=
arr
.
length
;
for
(
let
i
=
len
-
1
;
i
>=
0
;
--
i
){
let
time
=
arr
[
i
].
time
;
time
=
Math
.
round
(
time
*
1000
)
/
1000
;
currentTime
=
Math
.
round
(
currentTime
*
1000
)
/
1000
;
if
(
time
<
currentTime
){
//如果是最后一个匹配,则播放内容动画
if
(
len
==
1
){
this
.
contentAni
();
}
else
{
this
.
textAni
();
}
//移除匹配上的元素
arr
.
splice
(
i
,
1
);
break
;
}
}
requestAnimationFrame
(()
=>
{
this
.
monitor
(
audioId
,
arr
);
})
},
/**
* 文本动画
*/
_playText
:
null
,
textAni
(){
if
(
this
.
_playText
){
return
;
}
this
.
_playText
=
true
;
this
.
_cantouch
=
false
;
const
twinkle
=
(
node
)
=>
{
cc
.
tween
(
node
)
.
to
(
0.3
,{
scale
:
node
.
initScale
*
1.5
})
.
to
(
0.3
,{
scale
:
node
.
initScale
})
.
call
(()
=>
{
this
.
_playText
=
false
;
})
.
start
();
};
let
textNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text
"
);
let
wordNodeArr
=
textNode
.
wordNodeArr
;
for
(
let
i
=
0
;
i
<
wordNodeArr
.
length
;
++
i
)
{
let
wordNode
=
wordNodeArr
[
i
];
//如果是首字母,则执行动画
if
(
wordNode
.
isInitial
){
twinkle
(
wordNode
);
}
}
},
/**
* 内容动画
*/
contentAni
(){
let
handNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text/icon_hand
"
);
handNode
.
opacity
=
0
;
const
twinkle
=
(
node
)
=>
{
cc
.
tween
(
node
)
.
to
(
0.5
,{
scale
:
node
.
initScale
*
1.1
})
.
to
(
0.5
,{
scale
:
node
.
initScale
})
.
to
(
0.5
,{
scale
:
node
.
initScale
*
1.1
})
.
to
(
0.5
,{
scale
:
node
.
initScale
})
.
call
(()
=>
{
this
.
_cantouch
=
true
;
})
.
start
();
};
let
textNode
=
cc
.
find
(
"
Canvas/content/bg_green/bg_word-background/text
"
);
twinkle
(
textNode
);
},
photoBtn
:
null
,
initPhotoBtn
()
{
const
canvas
=
cc
.
find
(
'
Canvas
'
);
const
photoBtn
=
this
.
getSprNode
(
'
btn_photo
'
);
photoBtn
.
active
=
false
;
canvas
.
addChild
(
photoBtn
);
photoBtn
.
scale
=
this
.
_mapScaleMin
;
// photoBtn.x = 100;
photoBtn
.
y
=
-
canvas
.
height
/
2
+
photoBtn
.
height
/
2
*
photoBtn
.
scaleY
;
photoBtn
.
addComponent
(
cc
.
Button
);
photoBtn
.
on
(
'
click
'
,
()
=>
{
this
.
showPhotoTip
();
})
this
.
photoBtn
=
photoBtn
;
},
showPhotoBtn
()
{
if
(
!
this
.
photoBtn
)
{
this
.
initPhotoBtn
();
}
this
.
photoBtn
.
active
=
true
;
},
hidePhotoBtn
()
{
if
(
!
this
.
photoBtn
)
{
return
;
}
this
.
photoBtn
.
active
=
false
;
},
showPhotoTip
()
{
this
.
maskNode
.
active
=
true
;
playAudio
(
this
.
audioOsmoTip
.
clip
);
this
.
playAni
(
'
begin
'
,
0
)
this
.
playTipAni
(
'
normal
'
,
1
,
()
=>
{
console
.
log
(
'
play ani end
'
);
this
.
playAni
(
'
normal
'
,
0
)
this
.
photoBtnClick
();
})
},
photoBtnClick
()
{
console
.
log
(
'
in photoBtnClick
'
)
if
(
!
window
||
!
window
.
courseware
)
{
console
.
log
(
'
window.courseware not found
'
)
return
;
}
// window.courseware.openRecognitionCamera = this.getPhotoData.bind(this);
const
openRecognitionCamera
=
window
.
courseware
.
openRecognitionCamera
;
if
(
!
openRecognitionCamera
)
{
console
.
log
(
'
openRecognitionCamera not found
'
)
return
;
}
openRecognitionCamera
((
data
)
=>
{
console
.
log
(
'
openRecognitionCamera data:
'
,
data
)
this
.
timer_2
=
setTimeout
(()
=>
{
if
(
typeof
data
==
'
string
'
)
{
data
=
JSON
.
parse
(
data
);
}
const
{
result
}
=
data
;
this
.
photoEnd
(
result
);
this
.
maskNode
.
active
=
false
;
},
100
);
})
},
photoEnd
(
data
)
{
...
...
@@ -1630,31 +1134,6 @@ cc.Class({
return
topTitleData
&&
topLeftLetterData
;
// const block = data?.block
// if (!block) {
// return false;
// }
// const letter = this.data.letter || 'Aa';
// const topLabelData = this.getPhotoLabelData(['or', 'cross', 't', 'out'], block);
// if (!topLabelData) {
// console.log('!topLabelData')
// return false;
// }
// this.topLabelData = topLabelData;
// let topLeftLetter = this.getTopLeftLetter(letter, block, topLabelData);
// this.topLeftLetter = topLeftLetter;
// console.log('topLabelData: ', topLabelData);
// console.log('topLeftLetter: ', topLeftLetter);
// return topLeftLetter;
},
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment