每天一点技术小文章(1)

akazz

这个系列主要是给大家讲解一下游戏的一些相关代码。
今天主要是讲解数据库中，角色头像如何映射到菜单界面的头像。




其核心的实现代码在 rmmz_windows.js这个文件

代码复制

Window_Base.prototype.drawFace = function(

    faceName, faceIndex, x, y, width, height

) {

    width = width || ImageManager.faceWidth;

    height = height || ImageManager.faceHeight;

    const bitmap = ImageManager.loadFace(faceName);

    const pw = ImageManager.faceWidth;

    const ph = ImageManager.faceHeight;

    const sw = Math.min(width, pw);

    const sh = Math.min(height, ph);

    const dx = Math.floor(x + Math.max(width - pw, 0) / 2);

    const dy = Math.floor(y + Math.max(height - ph, 0) / 2);

    const sx = Math.floor((faceIndex % 4) * pw + (pw - sw) / 2);

    const sy = Math.floor(Math.floor(faceIndex / 4) * ph + (ph - sh) / 2);

    this.contents.blt(bitmap, sx, sy, sw, sh, dx, dy);

};

Window_Base.prototype.drawFace = function(



    faceName, faceIndex, x, y, width, height



) {



    width = width || ImageManager.faceWidth;



    height = height || ImageManager.faceHeight;



    const bitmap = ImageManager.loadFace(faceName);



    const pw = ImageManager.faceWidth;



    const ph = ImageManager.faceHeight;



    const sw = Math.min(width, pw);



    const sh = Math.min(height, ph);



    const dx = Math.floor(x + Math.max(width - pw, 0) / 2);



    const dy = Math.floor(y + Math.max(height - ph, 0) / 2);



    const sx = Math.floor((faceIndex % 4) * pw + (pw - sw) / 2);



    const sy = Math.floor(Math.floor(faceIndex / 4) * ph + (ph - sh) / 2);



    this.contents.blt(bitmap, sx, sy, sw, sh, dx, dy);



};

在这个代码里，主要要关注的是    const bitmap = ImageManager.loadFace(faceName); 这里是导入图片到bitmap 大家可以在这里去console.log(faceName)会发现这个faceName其实是图片名。
然后因为我们mz格式的图片一般是一整张图片，然后我们去选择做切割，那么这里就通过 const sx = Math.floor((faceIndex % 4) * pw + (pw - sw) / 2);
    const sy = Math.floor(Math.floor(faceIndex / 4) * ph + (ph - sh) / 2); 去确定我们选的是哪张图片，其实就是通过faceIndex去计算，用户选择的那块头像在整块图片的x,y，然后由于每个图像的宽度高度都一致，所以再加上pw、ph，就可以获取那一块图片。
然后通过this.contents.blt去绘制，bitmap是图片，sx，sy是头像的方位，sw，sh是长度宽度，dx，dy是这个头像显示的方位。
有什么不懂的欢迎交流。

gejiziliao

到位，虽然用不啊哦