jianghe2nd/mota-js
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 2 Wiki Activity

createCanvas return value

Browse Source
This commit is contained in:
oc 2018-12-19 22:35:41 +08:00
parent fe17819443
commit b140146203
7 changed files with 25 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/api.md
View File

@ -524,7 +524,7 @@ core.ui.createCanvas(name, x, y, width, height, zIndex)
动态创建一个画布。name为要创建的画布名，如果已存在则会直接取用当前存在的。 动态创建一个画布。name为要创建的画布名，如果已存在则会直接取用当前存在的。
x,y为创建的画布相对窗口左上角的像素坐标，width,height为创建的长宽。 x,y为创建的画布相对窗口左上角的像素坐标，width,height为创建的长宽。
zIndex为创建的纵向高度（关系到画布之间的覆盖），z值高的将覆盖z值低的；系统画布的z值可在个性化中查看。 zIndex为创建的纵向高度（关系到画布之间的覆盖），z值高的将覆盖z值低的；系统画布的z值可在个性化中查看。
创建一个画布后，可以通过 core.dymCanvas[name] 进行调用。 返回创建的画布的context，也可以通过core.dymCanvas[name]调用。
core.ui.findCanvas(name) core.ui.findCanvas(name)

2
docs/personalization.md
View File

@ -34,7 +34,7 @@ HTML5魔塔是使用画布（canvas）来绘制，存在若干个图层，它们
例如：`core.createCanvas('test', 10, 20, 100, 200, 74)` 创建了一个名为test的画布，其左上角相对窗口的像素坐标为(10,20)，宽100高200，纵向高度74（在动画层和天气层之间）。 例如：`core.createCanvas('test', 10, 20, 100, 200, 74)` 创建了一个名为test的画布，其左上角相对窗口的像素坐标为(10,20)，宽100高200，纵向高度74（在动画层和天气层之间）。
可以通过 `core.dymCanvas[name]` 来获得该画布的context；例如 `core.dymCanvas.test` 就是我们上面创建的画布的context，然后进行操作。 该函数会返回画布的context，也可以通过 `core.dymCanvas[name]` 来获得；例如 `core.dymCanvas.test` 就是我们上面创建的画布的context，然后进行操作。
也可以简单的使用`core.fillText()`, `core.fillRect()`, `core.strokeRect()`等等对画布进行任意绘制。 也可以简单的使用`core.fillText()`, `core.fillRect()`, `core.strokeRect()`等等对画布进行任意绘制。

11
libs/control.js
View File

@ -575,10 +575,9 @@ control.prototype.setAutomaticRoute = function (destX, destY, stepPostfix) {
sx = Math.min(sx, t.x * 32); dx = Math.max(dx, t.x * 32); sx = Math.min(sx, t.x * 32); dx = Math.max(dx, t.x * 32);
sy = Math.min(sy, t.y * 32); dy = Math.max(dy, t.y * 32); sy = Math.min(sy, t.y * 32); dy = Math.max(dy, t.y * 32);
}); });
core.createCanvas('route', sx-core.bigmap.offsetX, sy-core.bigmap.offsetY, dx-sx+32, dy-sy+32, 95);
core.status.automaticRoute.offsetX = sx; core.status.automaticRoute.offsetX = sx;
core.status.automaticRoute.offsetY = sy; core.status.automaticRoute.offsetY = sy;
var ctx = core.dymCanvas['route']; var ctx = core.createCanvas('route', sx-core.bigmap.offsetX, sy-core.bigmap.offsetY, dx-sx+32, dy-sy+32, 95);
ctx.fillStyle = '#bfbfbf'; ctx.fillStyle = '#bfbfbf';
ctx.strokeStyle = '#bfbfbf'; ctx.strokeStyle = '#bfbfbf';
ctx.lineWidth = 8; ctx.lineWidth = 8;
@ -601,13 +600,13 @@ control.prototype.setAutomaticRoute = function (destX, destY, stepPostfix) {
var step = 0, currStep = null; var step = 0, currStep = null;
moveStep.forEach(function (t) { moveStep.forEach(function (t) {
var dir = t.direction; var dir = t.direction;
if (currStep == null || currStep == dir) { if (currStep == null || currStep == dir)
step++; currStep = dir; step++;
}
else { else {
core.status.automaticRoute.autoStepRoutes.push({'direction': currStep, 'step': step}); core.status.automaticRoute.autoStepRoutes.push({'direction': currStep, 'step': step});
step = 1; currStep = dir; step = 1;
} }
currStep = dir;
}); });
core.status.automaticRoute.autoStepRoutes.push({'direction': currStep, 'step': step}); core.status.automaticRoute.autoStepRoutes.push({'direction': currStep, 'step': step});

6
libs/core.js
View File

@ -712,7 +712,7 @@ core.prototype.setStrokeStyle = function (name, style) {
////// canvas创建 ////// ////// canvas创建 //////
core.prototype.createCanvas = function (name, x, y, width, height, z) { core.prototype.createCanvas = function (name, x, y, width, height, z) {
core.ui.createCanvas(name, x, y, width, height, z); return core.ui.createCanvas(name, x, y, width, height, z);
} }
////// canvas查找 ////// ////// canvas查找 //////
@ -722,12 +722,12 @@ core.prototype.findCanvas = function (name) {
////// canvas重定位 ////// ////// canvas重定位 //////
core.prototype.relocateCanvas = function (name, x, y) { core.prototype.relocateCanvas = function (name, x, y) {
core.ui.relocateCanvas(name, x, y); return core.ui.relocateCanvas(name, x, y);
} }
////// canvas重置 ////// ////// canvas重置 //////
core.prototype.resizeCanvas = function (name, width, height) { core.prototype.resizeCanvas = function (name, width, height) {
core.ui.resizeCanvas(name, width, height); return core.ui.resizeCanvas(name, width, height);
} }
////// canvas删除 ////// ////// canvas删除 //////

4
libs/events.js
View File

@ -1533,9 +1533,9 @@ events.prototype.showImage = function (code, image, x, y, dw, dh, opacityVal, ti
var zIndex = code + 100; var zIndex = code + 100;
time = time || 0; time = time || 0;
var name = "image"+ zIndex; var name = "image"+ zIndex;
core.createCanvas(name, x, y, image.width * dw, image.height * dh, zIndex); var ctx = core.createCanvas(name, x, y, image.width * dw, image.height * dh, zIndex);
core.dymCanvas[name].drawImage(image, 0, 0, image.width * dw, image.height * dh); ctx.drawImage(image, 0, 0, image.width * dw, image.height * dh);
if (time == 0) if (time == 0)
core.setOpacity(name, opacityVal); core.setOpacity(name, opacityVal);
else { else {

10
libs/maps.js
View File

@ -829,16 +829,16 @@ maps.prototype.__initBlockCanvas = function (block, height, x, y) {
} }
if (damage != null) { if (damage != null) {
damageCanvas = "blockDamage"+x+"_"+y; damageCanvas = "blockDamage"+x+"_"+y;
core.createCanvas(damageCanvas, 0, 0, 32, 32, 65); var ctx = core.createCanvas(damageCanvas, 0, 0, 32, 32, 65);
core.dymCanvas[damageCanvas].textAlign = 'left'; ctx.textAlign = 'left';
core.dymCanvas[damageCanvas].font = "bold 11px Arial"; ctx.font = "bold 11px Arial";
core.fillBoldText(core.dymCanvas[damageCanvas], damage, damageColor, 1, 31); core.fillBoldText(ctx, damage, damageColor, 1, 31);
if (core.flags.displayCritical) { if (core.flags.displayCritical) {
var critical = core.enemys.nextCriticals(block.event.id); var critical = core.enemys.nextCriticals(block.event.id);
if (critical.length>0) critical=critical[0]; if (critical.length>0) critical=critical[0];
critical = core.formatBigNumber(critical[0], true); critical = core.formatBigNumber(critical[0], true);
if (critical == '???') critical = '?'; if (critical == '???') critical = '?';
core.fillBoldText(core.dymCanvas[damageCanvas], critical, '#FFFFFF', 1, 21); core.fillBoldText(ctx, critical, '#FFFFFF', 1, 21);
} }
} }
return { return {

24
libs/ui.js
View File

@ -367,15 +367,8 @@ ui.prototype.getTitleAndIcon = function (content) {
// 绘制选择光标 // 绘制选择光标
ui.prototype.drawWindowSelector = function(background,x,y,w,h) { ui.prototype.drawWindowSelector = function(background,x,y,w,h) {
w = Math.round(w), h = Math.round(h); w = Math.round(w), h = Math.round(h);
if (core.isset(core.dymCanvas.selector)) { var dstImage = core.ui.createCanvas("selector", x, y, w, h, 165);
core.relocateCanvas("selector", x, y);
core.resizeCanvas("selector", w, h);
}
else {
core.ui.createCanvas("selector", x, y, w, h, 165);
}
core.setOpacity("selector", 0.8); core.setOpacity("selector", 0.8);
var dstImage = core.dymCanvas.selector;
// back // back
dstImage.drawImage(background, 130, 66, 28, 28, 2, 2,w-4,h-4); dstImage.drawImage(background, 130, 66, 28, 28, 2, 2,w-4,h-4);
// corner // corner
@ -2779,7 +2772,7 @@ ui.prototype.createCanvas = function (name, x, y, width, height, z) {
this.relocateCanvas(name, x, y); this.relocateCanvas(name, x, y);
this.resizeCanvas(name, width, height); this.resizeCanvas(name, width, height);
core.dymCanvas[name].canvas.style.zIndex = z; core.dymCanvas[name].canvas.style.zIndex = z;
return; return core.dymCanvas[name];
} }
var newCanvas = document.createElement("canvas"); var newCanvas = document.createElement("canvas");
newCanvas.id = name; newCanvas.id = name;
@ -2801,6 +2794,7 @@ ui.prototype.createCanvas = function (name, x, y, width, height, z) {
} }
}); });
core.dom.gameDraw.appendChild(newCanvas); core.dom.gameDraw.appendChild(newCanvas);
return core.dymCanvas[name];
} }
////// canvas查找 ////// ////// canvas查找 //////
@ -2815,9 +2809,7 @@ ui.prototype.findCanvas = function (name) {
////// canvas重定位 ////// ////// canvas重定位 //////
ui.prototype.relocateCanvas = function (name, x, y) { ui.prototype.relocateCanvas = function (name, x, y) {
if (!core.isset(name)) return; if (this.findCanvas(name)<0) return null;
var index = core.findCanvas(name);
if (index < 0) return;
if (core.isset(x)) { if (core.isset(x)) {
core.dymCanvas[name].canvas.style.left = x * core.domStyle.scale + 'px'; core.dymCanvas[name].canvas.style.left = x * core.domStyle.scale + 'px';
core.dymCanvas._list[index].style.left = x; core.dymCanvas._list[index].style.left = x;
@ -2826,11 +2818,12 @@ ui.prototype.relocateCanvas = function (name, x, y) {
core.dymCanvas[name].canvas.style.top = y * core.domStyle.scale + 'px'; core.dymCanvas[name].canvas.style.top = y * core.domStyle.scale + 'px';
core.dymCanvas._list[index].style.top = y; core.dymCanvas._list[index].style.top = y;
} }
return core.dymCanvas[name];
} }
////// canvas重置 ////// ////// canvas重置 //////
ui.prototype.resizeCanvas = function (name, width, height) { ui.prototype.resizeCanvas = function (name, width, height) {
if (!core.isset(name)) return; if (this.findCanvas(name)<0) return null;
var dstCanvas = core.dymCanvas[name].canvas; var dstCanvas = core.dymCanvas[name].canvas;
if (core.isset(width)) { if (core.isset(width)) {
dstCanvas.width = width; dstCanvas.width = width;
@ -2840,12 +2833,11 @@ ui.prototype.resizeCanvas = function (name, width, height) {
dstCanvas.height = height; dstCanvas.height = height;
dstCanvas.style.height = height * core.domStyle.scale + 'px'; dstCanvas.style.height = height * core.domStyle.scale + 'px';
} }
return core.dymCanvas[name];
} }
////// canvas删除 ////// ////// canvas删除 //////
ui.prototype.deleteCanvas = function (name) { ui.prototype.deleteCanvas = function (name) {
if (!core.isset(name)) return; if (this.findCanvas(name)<0) return null;
var index = core.findCanvas(name);
if (index == -1) return;
core.dom.gameDraw.removeChild(core.dymCanvas[name].canvas); core.dom.gameDraw.removeChild(core.dymCanvas[name].canvas);
delete core.dymCanvas[name]; delete core.dymCanvas[name];
core.dymCanvas._list.splice(index,1); core.dymCanvas._list.splice(index,1);