读一读
const {ccclass, property} = cc._decorator;
@ccclass
export default class NetStuidy extends cc.Component {
start ()
{
let ws = new WebSocket("ws://echo.websocket.org");
ws.onopen = function (event) {
console.log("Send Text WS was opened.");
};
ws.onmessage = function (event) {
console.log("response text msg: " + event.data);
};
ws.onerror = function (event) {
console.log("Send Text fired an error");
};
ws.onclose = function (event) {
console.log("WebSocket instance closed.");
};
setTimeout(function () {
if (ws.readyState === WebSocket.OPEN) {
ws.send("Hello WebSocket, I'm a text message.");
}
else {
console.log("WebSocket instance wasn't ready...");
}
}, 3);
}
}
const {ccclass, property} = cc._decorator;
@ccclass
export default class NetStuidy extends cc.Component {
start ()
{
let xhr = new XMLHttpRequest()
xhr.onreadystatechange = ()=>{
if(xhr.readyState == 4 && (xhr.status >= 200 && xhr.status < 400)){
console.log(xhr.responseText)
}
}
xhr.open("GET","http://www.baidu.com",true)
xhr.send()
}
}
const {ccclass, property} = cc._decorator;
@ccclass
export default class ScheduleStudy extends cc.Component {
timer:number = 0
callback()
{
this.timer += 1
console.log("定时器执行：" + this.timer)
if(this.timer == 10)
{
this.unschedule(this.callback)
//this.unscheduleAllCallbacks() //取消这个组件所有的定时器
}
}
start () {
let interval = 2
let repeat = 20
let delay = 3
//3秒后 每隔2秒执行一次callback 重复20次
this.schedule(this.callback,interval,repeat,delay)
//this.scheduleOnce(this.callback,delay) 只执行定时器一次
}
}
缓动系统是对Cocos-x的动作系统的再一层封装，使api更加好用，链式调用，具体使用时可以查看相关的api和具体参数
const {ccclass, property} = cc._decorator;
@ccclass
export default class TweenStudy extends cc.Component {
start ()
{
let tw = new cc.Tween()
tw.target(this.node).to(1,{position:cc.v2(100,100),rotation:360}) //属性定义多个同时进行
.to(1,{position:cc.v2(0,200)})
.call(this.callback.bind(this)) //回调函数
.start()
}
callback()
{
let tw = new cc.Tween()
tw.target(this.node)
.delay(2) //延迟2s执行
.repeat(10,new cc.Tween().by(1,{rotation:360})) //重复10次 repeatForever永久重复
.call(()=>{console.log("执行完成")})
.start()
}
}
const {ccclass, property} = cc._decorator;
@ccclass
export default class SysEvent extends cc.Component {
start ()
{
cc.systemEvent.on(cc.SystemEvent.EventType.KEY_DOWN,function(event){
console.log(event.keyCode + "被按下了")
})
cc.systemEvent.on(cc.SystemEvent.EventType.KEY_UP,function(event){
console.log(event.keyCode + "被抬起了")
})
cc.systemEvent.on(cc.SystemEvent.EventType.DEVICEMOTION,function(event){
console.log(event.acc.x + " " + event.acc.y) //重力传感
})
}
}
触摸事件在移动平台和桌面平台都会触发，属于节点事件
const {ccclass, property} = cc._decorator;
@ccclass
export default class SysEvent extends cc.Component {
start ()
{
//当手指触点落在目标节点区域内时
this.node.on(cc.Node.EventType.TOUCH_START,function(event:cc.Event.EventTouch){
console.log("TouchStart")
})
//当手指在屏幕上目标节点区域内移动时
this.node.on(cc.Node.EventType.TOUCH_MOVE,function(event){
console.log("TouchMove")
})
//当手指在目标节点区域内离开屏幕时
this.node.on(cc.Node.EventType.TOUCH_END,function(event){
console.log("TouchEnd")
})
//当手指在目标节点区域外离开屏幕时
this.node.on(cc.Node.EventType.TOUCH_CANCEL,function(event){
console.log("TouchCancle")
})
}
}
鼠标事件只会在桌面平台才会触发，属于节点事件
const {ccclass, property} = cc._decorator;
@ccclass
export default class SysEvent extends cc.Component {
start ()
{
//当鼠标在目标节点区域按下时触发一次
this.node.on(cc.Node.EventType.MOUSE_DOWN,function(event){
console.log("MouseDown")
},this)
//当鼠标移入目标节点区域时，不论是否按下
this.node.on(cc.Node.EventType.MOUSE_ENTER,function(event){
console.log("MouseEnter")
})
//当鼠标在目标节点在目标节点区域中移动时，不论是否按下
this.node.on(cc.Node.EventType.MOUSE_MOVE,function(event:cc.Event.EventMouse){
console.log(event.getLocation())
})
//当鼠标移出目标节点区域时，不论是否按下
this.node.on(cc.Node.EventType.MOUSE_LEAVE,function(event){
console.log("MouseLevel")
})
//当鼠标从按下状态松开时触发一次
this.node.on(cc.Node.EventType.MOUSE_UP,function(event){
console.log("MouseUp")
})
//当鼠标滚轮滚动时
this.node.on(cc.Node.EventType.MOUSE_WHEEL,function(event:cc.Event.EventMouse){
console.log(event.getScrollY())
})
}
}
使用dispatchEvent派发可以冒泡的形式一层一层向父物体传递事件。
//Label
const {ccclass, property} = cc._decorator;
@ccclass
export default class Helloworld extends cc.Component {
start()
{
this.node.on("say",function(){
console.log(this.node.name + ":Hello")
}.bind(this))
//派送自定义事件 是否冒泡传递
this.node.dispatchEvent(new cc.Event.EventCustom("say",true))
}
}//Background、Btn、Canvas
const {ccclass, property} = cc._decorator;
@ccclass
export default class LoadTest extends cc.Component {
start () {
this.node.on("say",function(event){
console.log(this.node.name + ":Hello")
if(this.node.name == "Btn")
{
event.stopPropagation() //停止向上派送事件
}
}.bind(this))
}
onDestroy()
{
//关闭监听事件
this.node.off("say")
}
}
const {ccclass, property} = cc._decorator;
@ccclass
export default class LoadTest extends cc.Component {
@property(cc.Sprite)
spr:cc.Sprite = null
private remoteTex:cc.Texture2D = null
start () {
//监听一次事件
this.spr.node.once("mousedown",this.onMouseClick.bind(this))
//监听事件
this.spr.node.on("say",function(msg){
console.log(msg)
})
}
onMouseClick(event)
{
//发射事件
this.spr.node.emit("say","HelloWrold")
}
onDestroy()
{
//关闭监听事件
this.spr.node.off("say")
}
}
const {ccclass, property} = cc._decorator;
@ccclass
export default class LoadTest extends cc.Component {
@property(cc.Sprite)
spr:cc.Sprite = null
private remoteTex:cc.Texture2D = null
start () {
let self = this
cc.loader.loadRes("111",cc.Texture2D,function(err,tx){ //动态加载resources目录下的图片
let sf = new cc.SpriteFrame()
sf.setTexture(tx)
self.spr.spriteFrame = sf
})
cc.loader.loadRes("testPlist",cc.SpriteAtlas,function(err,atlas:cc.SpriteAtlas){ //动态加载resources目录下的图集
let sf = atlas.getSpriteFrame("logo-111")
self.spr.spriteFrame = sf
})
let url = "http://www.chicai.group/uploads/ueditor/php/upload/image/20190605/1559744982223328.png"
cc.loader.load({url:url,type:"png"},function(err,tx){ //加载远程的图片资源
let sf = new cc.SpriteFrame()
sf.setTexture(tx)
self.spr.spriteFrame = sf
self.remoteTex = tx
})
//cc.loader.loadResDir() //加载在resources下的一整个文件夹
//cc.loader.releaseResDir()
}
onDestroy(){
cc.loader.releaseRes("111",cc.Texture2D)
cc.loader.releaseRes("testPlist",cc.SpriteAtlas)
cc.loader.releaseAsset(this.remoteTex)
}
}