明日方舟人物立绘反混淆

明日方舟安装包和升级包解包后得到的立绘周围有多余的像素，需要通过分离出来的灰度图来获得具有 alpha 通道的立绘图片。

用 sharp 来实现还是蛮简单的，就写了一个小工具来完成这一过程（文章最后仓库内有全部立绘可供下载）。

Sharp 的实现#

在老版本的 sharp 中，能够直接通过 OverlayWith 方法将灰度图片与原图片合成来获得具有 alpha 通道的图片。但是在新版本中，OverlayWith 方法被废弃，所以我通过下面这种方法来实现类似的功能。

Ⅰ. 载入需要操作的图片#

由于 sharp 返回 Promise 对象，下面全部代码都会使用 async 函数和 await

(async function () {
    let mask = await sharp("mask.png"); //载入灰度图像
    let image = await sharp("origin.png"); //载入原始图像
})()

Ⅱ. 获得灰度图的通道信息#

想要将灰度图作为 alpha 通道合并到，需要保证原图没有alpha 通道，灰度图只有一个通道。只有这样，才能保证灰度图作为 alpha 通道合并到原图中。

我们要做的，就是删除原图的 alpha 通道，并且只保留灰度图的任意一个通道。

(async function () {
    let mask = await sharp("mask.png") //载入灰度图像
        .extractChannel("red"); //提取灰度图像的任意一个通道都是一
                                //样的，这里提取红色通道

    let image = await sharp(`origin.png`) //载入原始图像
        .removeAlpha(); //去除原图的alpha通道
})()

Ⅲ. 将两张图合成#

(async function () {
    let mask = await sharp("mask.png") //载入灰度图像
        .extractChannel("red"); //提取灰度图像的任意一个通道都
                                //是一样的，这里提取红色通道

    let image = await sharp(`origin.png`) //载入原始图像
        .removeAlpha(); //去除原图的alpha通道

    let maskBuffer = await mask.toBuffer();
    let imageBuffer = await image.toBuffer();
    sharp(imageBuffer) //以Buffer的形式载入原始图像，其
                       //实这行可以用image代替，这么写
                       //是为了满足我的强迫症😂
        .joinChannel(maskBuffer) //将灰度图像的红色通道加入到
                                 //原图中，因为之前删除了原图
                                 //的Alpha通道，所以实际上是
                                 //重新添加了Alpha通道
        .toFile(`out.png`) //输出最终的图像
})()