明日方舟人物立绘反混淆

戴兜

发布于 2023-02-23 10:01:53

4680

发布于 2023-02-23 10:01:53

文章被收录于专栏：daidr

明日方舟安装包和升级包解包后得到的立绘周围有多余的像素，需要通过分离出来的灰度图来获得具有alpha通道的立绘图片。用sharp来实现还是蛮简单的，就写了一个小工具来完成这一过程（文章最后仓库内有全部立绘可供下载）。

Sharp的实现

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

https://i.loli.net/2020/01/21/9xe6j2YlnaBvDL8.png

原始立绘

https://i.loli.net/2020/01/21/Kcz8tQ1NGg4PehH.png

立绘alpha通道图

Ⅰ. 载入需要操作的图片

由于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`) //输出最终的图像
})()