Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
C
cc_mz_003
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
cc_mz_003
Commits
f7228ce8
Commit
f7228ce8
authored
Dec 08, 2020
by
Li MingZhe
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 背景色更改
parent
82c22ffd
Changes
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
215 additions
and
22 deletions
+215
-22
scene.js
play/assets/mz_003/script/scene.js
+215
-22
No files found.
play/assets/mz_003/script/scene.js
View file @
f7228ce8
...
@@ -42,8 +42,14 @@ cc.Class({
...
@@ -42,8 +42,14 @@ cc.Class({
// baseHeight: 720;
// baseHeight: 720;
onLoad
()
{
onLoad
()
{
// cc.sys.capabilities = true;
cc
.
macro
.
ENABLE_MULTI_TOUCH
=
true
;
cc
.
debug
.
setDisplayStats
(
false
);
this
.
initSceneData
();
this
.
initSceneData
();
this
.
initSize
();
this
.
initSize
();
},
},
initSceneData
()
{
initSceneData
()
{
...
@@ -54,8 +60,18 @@ cc.Class({
...
@@ -54,8 +60,18 @@ cc.Class({
_designSize
:
null
,
_designSize
:
null
,
initSize
()
{
initSize
()
{
// 注意cc.winSize只有在适配后(修改fitHeight/fitWidth后)才能获取到正确的值,因此使用cc.getFrameSize()来获取初始的屏幕大小
let
screen_size
=
cc
.
view
.
getFrameSize
().
width
/
cc
.
view
.
getFrameSize
().
height
let
design_size
=
cc
.
Canvas
.
instance
.
designResolution
.
width
/
cc
.
Canvas
.
instance
.
designResolution
.
height
let
f
=
screen_size
>=
design_size
cc
.
Canvas
.
instance
.
fitHeight
=
f
cc
.
Canvas
.
instance
.
fitWidth
=
!
f
this
.
_designSize
=
cc
.
view
.
getDesignResolutionSize
();
this
.
_designSize
=
cc
.
view
.
getDesignResolutionSize
();
},
},
start
()
{
start
()
{
...
@@ -216,7 +232,8 @@ cc.Class({
...
@@ -216,7 +232,8 @@ cc.Class({
const
bgBottom
=
cc
.
find
(
'
Canvas/bgBottom
'
);
const
bgBottom
=
cc
.
find
(
'
Canvas/bgBottom
'
);
const
canvas
=
cc
.
find
(
'
Canvas
'
);
const
canvas
=
cc
.
find
(
'
Canvas
'
);
// this.initWebListener();
let
downFlag
=
false
;
let
downFlag
=
false
;
bgBottom
.
on
(
'
item_touch_start
'
,
(
item
)
=>
{
bgBottom
.
on
(
'
item_touch_start
'
,
(
item
)
=>
{
downFlag
=
true
;
downFlag
=
true
;
...
@@ -242,10 +259,14 @@ cc.Class({
...
@@ -242,10 +259,14 @@ cc.Class({
if
(
canvas
.
hasEventListener
(
cc
.
Node
.
EventType
.
TOUCH_MOVE
))
{
if
(
canvas
.
hasEventListener
(
cc
.
Node
.
EventType
.
TOUCH_MOVE
))
{
canvas
.
off
(
cc
.
Node
.
EventType
.
TOUCH_MOVE
,
touchMove
)
canvas
.
off
(
cc
.
Node
.
EventType
.
TOUCH_MOVE
,
touchMove
)
this
.
removeHtmlCanvasListener
(
'
touchmove
'
);
}
}
}
}
const
touchEnd
=
(
e
)
=>
{
const
touchEnd
=
(
e
)
=>
{
// if (downFlag == false) {
// return;
// }
downFlag
=
false
;
downFlag
=
false
;
this
.
canvasTouchEnd
(
e
);
this
.
canvasTouchEnd
(
e
);
console
.
log
(
'
touch end
'
)
console
.
log
(
'
touch end
'
)
...
@@ -256,10 +277,15 @@ cc.Class({
...
@@ -256,10 +277,15 @@ cc.Class({
if
(
canvas
.
hasEventListener
(
cc
.
Node
.
EventType
.
MOUSE_LEAVE
))
{
if
(
canvas
.
hasEventListener
(
cc
.
Node
.
EventType
.
MOUSE_LEAVE
))
{
canvas
.
off
(
cc
.
Node
.
EventType
.
MOUSE_LEAVE
,
mouseUp
)
canvas
.
off
(
cc
.
Node
.
EventType
.
MOUSE_LEAVE
,
mouseUp
)
}
}
this
.
removeHtmlTouchEnd
();
}
}
const
mouseUp
=
(
e
)
=>
{
const
mouseUp
=
(
e
)
=>
{
// if (downFlag == false) {
// return;
// }
downFlag
=
false
;
downFlag
=
false
;
this
.
canvasTouchEnd
(
e
);
this
.
canvasTouchEnd
(
e
);
console
.
log
(
'
mouse up
'
)
console
.
log
(
'
mouse up
'
)
...
@@ -271,6 +297,15 @@ cc.Class({
...
@@ -271,6 +297,15 @@ cc.Class({
}
}
}
}
// canvas.on(cc.Node.EventType.TOUCH_START, () => {
// console.log('canvas touch start')
// })
// canvas.on(cc.Node.EventType.MOUSE_DOWN, (e) => {
// console.log('canvas MOUSE_DOWN ')
// })
canvas
.
on
(
cc
.
Node
.
EventType
.
TOUCH_MOVE
,
touchMove
)
canvas
.
on
(
cc
.
Node
.
EventType
.
TOUCH_MOVE
,
touchMove
)
canvas
.
on
(
cc
.
Node
.
EventType
.
MOUSE_MOVE
,
mouseMove
)
canvas
.
on
(
cc
.
Node
.
EventType
.
MOUSE_MOVE
,
mouseMove
)
...
@@ -278,34 +313,132 @@ cc.Class({
...
@@ -278,34 +313,132 @@ cc.Class({
canvas
.
on
(
cc
.
Node
.
EventType
.
TOUCH_CANCEL
,
touchEnd
)
canvas
.
on
(
cc
.
Node
.
EventType
.
TOUCH_CANCEL
,
touchEnd
)
canvas
.
on
(
cc
.
Node
.
EventType
.
MOUSE_UP
,
mouseUp
)
canvas
.
on
(
cc
.
Node
.
EventType
.
MOUSE_UP
,
mouseUp
)
// canvas.on(cc.Node.EventType.MOUSE_LEAVE, mouseUp)
// canvas.on(cc.Node.EventType.MOUSE_LEAVE, mouseUp)
},
// canvas.on(cc.Node.EventType.MOUSE_MOVE, (e) => {
removeHtmlCanvasListener
(
type
)
{
// // this.canvasTouchMove(e);
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
// if (!downFlag) {
canvasHtml
.
addEventListener
(
type
,
(
e
)
=>
{})
// return;
},
// }
// console.log('mouse');
// moveFunc(e);
// canvas.off(cc.Node.EventType.TOUCH_MOVE, moveFunc)
// })
// canvas.on(cc.Node.EventType.MOUSE_UP, (e) => {
initWebListener
()
{
// // this.canvasTouchMove(e);
// canvas.off(cc.Node.EventType.TOUCH_END, endFunc)
// })
// canvas.on(cc.Node.EventType.MOUSE_DOWN, (e) => {
// canvas.on(cc.Node.EventType.TOUCH_CANCEL, (e) => {
// console.log('mouse down e: ', e)
// downFlag = false;
// console.log('location: ', e.getLocation());
// this.canvasTouchEnd(e);
// })
// canvas.on(cc.Node.EventType.TOUCH_END, (e) => {
// downFlag = false;
// this.canvasTouchEnd(e);
// })
// })
console
.
log
(
'
in initWebListener
'
);
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
document
.
addEventListener
(
'
touchstart
'
,
this
.
htmlCanvasTouchstartFunc
.
bind
(
this
),
this
);
document
.
addEventListener
(
'
touchmove
'
,
this
.
htmlCanvasTouchmoveFunc
.
bind
(
this
),
this
);
document
.
addEventListener
(
'
touchend
'
,
this
.
htmlCanvasTouchendFunc
.
bind
(
this
),
this
);
document
.
addEventListener
(
'
click
'
,
this
.
htmlCanvasClickFunc
.
bind
(
this
),
this
);
// canvasHtml.addEventListener('touchcancel', this.htmlCanvasTouchcancelFunc, this);
// canvasHtml.addEventListener('touchstart', (e) => {
// console.log('html touch start e: ', e);
// const evt = this.createTouchEvent(canvas, 'mousedown', e);
// canvas.dispatchEvent(evt);
// });
// canvasHtml.addEventListener('touchmove', (e) => {
// console.log('html touch move e: ', e);
// const evt = this.createTouchEvent(canvas, 'mousemove', e);
// canvas.dispatchEvent(evt);
// });
// canvasHtml.addEventListener('touchend', (e) => {
// console.log('html touch end e: ', e);
// const evt = this.createTouchEvent(canvas, 'mouseup', e);
// canvas.dispatchEvent(evt);
// });
// canvasHtml.addEventListener('touchcancel', (e) => {
// console.log('html touch cancel e: ', e);
// const evt = this.createTouchEvent(canvas, 'mouseleave', e);
// canvas.dispatchEvent(evt);
// });
// canvasHtml.addEventListener('mousedown', (e) => {
// console.log('html mousedown e: ', e);
// const baseNode = canvas
// const subY = e.target.clientHeight;
// const p1 = baseNode.parent.convertToNodeSpaceAR(cc.v2(e.clientX, subY - e.clientY));
// const p2 = baseNode.parent.convertToNodeSpaceAR(cc.v2(e.layerX, subY - e.layerY));
// const p3 = baseNode.parent.convertToNodeSpaceAR(cc.v2(e.offsetX, subY - e.offsetY));
// const p4 = baseNode.parent.convertToNodeSpaceAR(cc.v2(e.pageX, subY - e.pageY));
// const p5 = baseNode.parent.convertToNodeSpaceAR(cc.v2(e.screenX, subY - e.screenY));
// const p6 = baseNode.parent.convertToNodeSpaceAR(cc.v2(e.x, subY - e.y));
// console.log('p1: ', p1);
// console.log('p2: ', p2);
// console.log('p3: ', p3);
// console.log('p4: ', p4);
// console.log('p5: ', p5);
// console.log('p6: ', p6);
// });
},
htmlCanvasTouchstartFunc
(
e
)
{
console
.
log
(
'
html htmlCanvasTouchstartFunc
'
)
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
const
evt
=
this
.
createTouchEvent
(
canvasHtml
,
'
mousedown
'
,
e
);
canvasHtml
.
dispatchEvent
(
evt
);
},
htmlCanvasTouchmoveFunc
(
e
)
{
console
.
log
(
'
html htmlCanvasTouchmoveFunc
'
)
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
const
evt
=
this
.
createTouchEvent
(
canvasHtml
,
'
mousemove
'
,
e
);
canvasHtml
.
dispatchEvent
(
evt
);
},
htmlCanvasTouchendFunc
(
e
)
{
console
.
log
(
'
html htmlCanvasTouchendFunc
'
)
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
const
evt
=
this
.
createTouchEvent
(
canvasHtml
,
'
mouseup
'
,
e
);
canvasHtml
.
dispatchEvent
(
evt
);
},
htmlCanvasTouchcancelFunc
(
e
)
{
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
const
evt
=
this
.
createTouchEvent
(
canvasHtml
,
'
mouseleave
'
,
e
);
canvasHtml
.
dispatchEvent
(
evt
);
},
htmlCanvasClickFunc
(
e
)
{
if
(
e
.
aaas
){
return
}
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
const
evt
=
this
.
createTouchEvent
(
canvasHtml
,
'
click
'
,
e
);
evt
.
aaas
=
1
canvasHtml
.
dispatchEvent
(
evt
);
},
removeHtmlTouchEnd
()
{
const
canvasHtml
=
document
.
querySelector
(
'
canvas
'
);
canvasHtml
.
removeEventListener
(
'
touchend
'
,
this
.
htmlCanvasTouchendFunc
,
this
);
},
},
initView
()
{
initView
()
{
this
.
initBg
();
this
.
initBg
();
this
.
initHotZone
();
this
.
initHotZone
();
},
},
...
@@ -332,6 +465,22 @@ cc.Class({
...
@@ -332,6 +465,22 @@ cc.Class({
bgNode
.
anchorY
=
0
;
bgNode
.
anchorY
=
0
;
bgNode
.
x
=
frameSize
.
width
/
2
*
s
;
bgNode
.
x
=
frameSize
.
width
/
2
*
s
;
bgNode
.
y
=
-
frameSize
.
height
/
2
*
s
;
bgNode
.
y
=
-
frameSize
.
height
/
2
*
s
;
const
bg
=
cc
.
find
(
'
Canvas/bg
'
);
const
rectNode
=
new
cc
.
Node
();
rectNode
.
x
=
-
bg
.
x
;
rectNode
.
y
=
-
bg
.
y
;
rectNode
.
scaleX
=
bg
.
scaleX
;
rectNode
.
scaleY
=
bg
.
scaleY
;
bg
.
addChild
(
rectNode
);
const
ctx
=
rectNode
.
addComponent
(
cc
.
Graphics
);
ctx
.
fillColor
=
this
.
data
.
bgColor
||
'
#f9bd03
'
;
ctx
.
fillRect
(
-
bg
.
width
/
2
,
-
bg
.
height
/
2
,
bg
.
width
,
bg
.
height
);
ctx
.
fill
();
},
},
...
@@ -1037,5 +1186,49 @@ cc.Class({
...
@@ -1037,5 +1186,49 @@ cc.Class({
createTouchEvent
(
touchTarget
,
type
,
e
)
{
const
otcs
=
[...
e
.
touches
];
// console.log(e.type, e)
// e = e.type.startsWith('touch') ? e.touches[0] : e
// if (!e.touches) {
// e.touches = otcs
// }
const
posInfo
=
e
.
touches
?
e
.
touches
[
0
]
||
{}
:
e
;
const
touch
=
new
Touch
({
identifier
:
-
Date
.
now
(),
target
:
touchTarget
,
clientX
:
posInfo
.
clientX
||
0
,
clientY
:
posInfo
.
clientY
||
0
,
force
:
posInfo
.
force
,
pageX
:
posInfo
.
pageX
,
pageY
:
posInfo
.
pageY
,
radiusX
:
posInfo
.
radiusX
,
radiusY
:
posInfo
.
radiusY
,
rotationAngle
:
e
.
rotationAngle
,
screenX
:
posInfo
.
screenX
,
screenY
:
posInfo
.
screenY
,
});
const
touchEvent
=
new
TouchEvent
(
type
,
{
touches
:
[
touch
],
view
:
window
,
cancelable
:
true
,
bubbles
:
true
,
changedTouches
:
[
touch
]
});
touchEvent
.
fireByMe
=
true
;
touchEvent
.
pageX
=
posInfo
.
pageX
touchEvent
.
pageY
=
posInfo
.
pageY
touchEvent
.
clientX
=
posInfo
.
clientX
touchEvent
.
clientY
=
posInfo
.
clientY
touchEvent
.
screenX
=
posInfo
.
screenX
touchEvent
.
screenY
=
posInfo
.
screenY
return
touchEvent
;
},
// update (dt) {},
// update (dt) {},
});
});
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