From d0e3b48147fd1cd28ccd6aca6136864749b90a83 Mon Sep 17 00:00:00 2001 From: ckcz123 Date: Thu, 20 Dec 2018 17:04:59 +0800 Subject: [PATCH] keyUpKeyBoard --- docs/api.md | 13 ++++----- libs/actions.js | 12 ++++++++ libs/core.js | 8 ++--- libs/ui.js | 77 +++++++++++++++++++++++++++---------------------- 4 files changed, 64 insertions(+), 46 deletions(-) diff --git a/docs/api.md b/docs/api.md index a43454ba..b2912204 100644 --- a/docs/api.md +++ b/docs/api.md @@ -467,25 +467,24 @@ core.maps.removeBlockByIds(floorId, ids) ui.js主要用来进行UI窗口的绘制，比如对话框、怪物手册、楼传器、存读档界面等等。 -core.ui.getContextByName(name) +core.ui.getContextByName(canvas) 根据画布名找到一个画布的context；支持系统画布和自定义画布。如果不存在画布返回null。 +也可以传画布的context自身，则返回自己。 core.clearMap(name) 清空某个画布图层。 -name为画布名，可以是系统画布之一，也可以是任意自定义动态创建的画布名。 +name为画布名，可以是系统画布之一，也可以是任意自定义动态创建的画布名；还可以直接传画布的context本身。（下同） 如果name也可以是'all'，若为all则为清空所有系统画布。 core.ui.fillText(name, text, x, y, style, font) 在某个画布上绘制一段文字。 -name为画布名，可以是系统画布之一，也可以是任意自定义动态创建的画布名。（下同） -text为要绘制的文本，x,y为要绘制的坐标，style可选为绘制的样式，font可选为绘制的字体。 +text为要绘制的文本，x,y为要绘制的坐标，style可选为绘制的样式，font可选为绘制的字体。（下同） -core.ui.fillBoldText(canvas, text, style, x, y, font) +core.ui.fillBoldText(name, text, style, x, y, font) 在某个画布上绘制一个描黑边的文字。 -canvas为要绘制的画布的context，text为文本，style为颜色样式，x,y坐标，font可选为要绘制的字体。 core.ui.fillRect(name, x, y, width, height, style) @@ -531,7 +530,7 @@ font可选，如果存在则会先设置该画布上的字体。 core.ui.drawImage(name, image, x, y, w, h, x1, y1, w1, h1) 在一个画布上绘制图片。 -name为画布名，可以是系统画布之一，也可以是任意自定义动态创建的画布名。 +name为画布名，可以是系统画布之一，也可以是任意自定义动态创建的画布名；还可以直接传画布的context本身。 image为要绘制的图片，可以是一个全塔属性中定义的图片名（会从images中去获取），图片本身，或者一个画布。 后面的8个坐标参数与canvas的drawImage的八个参数完全相同。 请查看 http://www.w3school.com.cn/html5/canvas_drawimage.asp 了解更多。 diff --git a/libs/actions.js b/libs/actions.js index 3f6af8fb..bab6f53d 100644 --- a/libs/actions.js +++ b/libs/actions.js @@ -251,6 +251,10 @@ actions.prototype.keyUp = function(keyCode, altKey, fromReplay) { this.keyUpSL(keyCode); return; } + if (core.status.event.id == 'keyBoard') { + this.keyUpKeyBoard(keyCode); + return; + } if (core.status.event.id=='switchs') { this.keyUpSwitchs(keyCode); return; @@ -2546,6 +2550,14 @@ actions.prototype.clickKeyBoard = function (x, y) { core.ui.closePanel(); } +////// “虚拟键盘”界面时的点击操作 ////// +actions.prototype.keyUpKeyBoard = function (keycode) { + if (keycode==27 || keycode==88 || keycode==13 || keycode==32 || keycode==67) { + core.ui.closePanel(); + return; + } +} + ////// 光标界面时的点击操作 ////// actions.prototype.clickCursor = function (x,y) { diff --git a/libs/core.js b/libs/core.js index 86691bbb..b00f7a7c 100644 --- a/libs/core.js +++ b/libs/core.js @@ -630,8 +630,8 @@ core.prototype.changeFloor = function (floorId, stair, heroLoc, time, callback, } ////// 从名字获得画布 ////// -core.prototype.getContextByName = function (name) { - return core.ui.getContextByName(name); +core.prototype.getContextByName = function (canvas) { + return core.ui.getContextByName(canvas); } ////// 清除地图 ////// @@ -645,8 +645,8 @@ core.prototype.fillText = function (name, text, x, y, style, font) { } ////// 在某个canvas上绘制一段描边文字 ////// -core.prototype.fillBoldText = function (canvas, text, style, x, y, font) { - core.ui.fillBoldText(canvas, text, style , x, y, font); +core.prototype.fillBoldText = function (name, text, style, x, y, font) { + core.ui.fillBoldText(name, text, style , x, y, font); } ////// 在某个canvas上绘制一个矩形 ////// diff --git a/libs/ui.js b/libs/ui.js index 182b6d4e..ff35e60d 100644 --- a/libs/ui.js +++ b/libs/ui.js @@ -17,11 +17,16 @@ ui.prototype.init = function () { ////////////////// 地图设置 -ui.prototype.getContextByName = function (name) { - if (core.isset(core.canvas[name])) - return core.canvas[name]; - if (core.isset(core.dymCanvas[name])) - return core.dymCanvas[name]; +ui.prototype.getContextByName = function (canvas) { + if (typeof canvas == 'string') { + if (core.isset(core.canvas[canvas])) + canvas = core.canvas[canvas]; + else if (core.isset(core.dymCanvas[canvas])) + canvas = core.dymCanvas[canvas]; + } + if (core.isset(canvas) && core.isset(canvas.canvas)) { + return canvas; + } return null; } @@ -53,18 +58,17 @@ ui.prototype.fillText = function (name, text, x, y, style, font) { } ////// 在某个canvas上绘制粗体 ////// -ui.prototype.fillBoldText = function (canvas, text, style, x, y, font) { - if (typeof canvas == "string") - canvas = this.getContextByName(canvas); - if (!core.isset(canvas)) return; - if (core.isset(font)) canvas.font = font; - canvas.fillStyle = '#000000'; - canvas.fillText(text, x-1, y-1); - canvas.fillText(text, x-1, y+1); - canvas.fillText(text, x+1, y-1); - canvas.fillText(text, x+1, y+1); - canvas.fillStyle = style; - canvas.fillText(text, x, y); +ui.prototype.fillBoldText = function (name, text, style, x, y, font) { + var ctx = this.getContextByName(name); + if (!ctx) return; + if (core.isset(font)) ctx.font = font; + ctx.fillStyle = '#000000'; + ctx.fillText(text, x-1, y-1); + ctx.fillText(text, x-1, y+1); + ctx.fillText(text, x+1, y-1); + ctx.fillText(text, x+1, y+1); + ctx.fillStyle = style; + ctx.fillText(text, x, y); } ////// 在某个canvas上绘制一个矩形 ////// @@ -97,12 +101,11 @@ ui.prototype.drawLine = function (name, x1, y1, x2, y2, style, lineWidth) { core.setLineWidth(name, lineWidth); } var ctx = this.getContextByName(name); - if (ctx) { - ctx.beginPath(); - ctx.moveTo(x1, y1); - ctx.lineTo(x2, y2); - ctx.stroke(); - } + if (!ctx) return; + ctx.beginPath(); + ctx.moveTo(x1, y1); + ctx.lineTo(x2, y2); + ctx.stroke(); } ////// 在某个canvas上绘制一个箭头 ////// @@ -115,18 +118,17 @@ ui.prototype.drawArrow = function (name, x1, y1, x2, y2, style, lineWidth) { core.setLineWidth(name, lineWidth); } var ctx = this.getContextByName(name); - if (ctx) { - var head = 10; - var dx = x2-x1, dy=y2-y1; - var angle = Math.atan2(dy,dx); - ctx.beginPath(); - ctx.moveTo(x1,y1); - ctx.lineTo(x2, y2); - ctx.lineTo(x2-head*Math.cos(angle-Math.PI/6),y2-head*Math.sin(angle-Math.PI/6)); - ctx.moveTo(x2, y2); - ctx.lineTo(x2-head*Math.cos(angle+Math.PI/6),y2-head*Math.sin(angle+Math.PI/6)); - ctx.stroke(); - } + if (!ctx) return; + var head = 10; + var dx = x2-x1, dy=y2-y1; + var angle = Math.atan2(dy,dx); + ctx.beginPath(); + ctx.moveTo(x1,y1); + ctx.lineTo(x2, y2); + ctx.lineTo(x2-head*Math.cos(angle-Math.PI/6),y2-head*Math.sin(angle-Math.PI/6)); + ctx.moveTo(x2, y2); + ctx.lineTo(x2-head*Math.cos(angle+Math.PI/6),y2-head*Math.sin(angle+Math.PI/6)); + ctx.stroke(); } ////// 设置某个canvas的文字字体 ////// @@ -2555,6 +2557,11 @@ ui.prototype.drawKeyBoard = function () { }); core.fillText("ui", "返回游戏", 416-80, offset-3, '#FFFFFF', 'bold 15px '+globalFont); + + if (isWindowSkin) + this.drawWindowSelector(background, 300, offset - 22, 72, 27); + else + core.strokeRect('ui', 300, offset - 22, 72, 27, "#FFD700", 2); } ////// 绘制状态栏 /////