Contents

在Linux终端合并图像

1. 简介

将多个图像合并为一个以创建精灵文件可能很乏味。当有大量图像时,它会变得特别耗时,或者它们经常变化,并且需要重复该过程。

在本教程中,我们将学习如何在 Linux 终端中使用一个命令快速合并图像。

2. 用例

假设我们有一个使用图像作为导航按钮的 Web 应用程序项目。我们有一个名为*“icons”*的目录,用于存储为此目的所需的 jpeg 文件。我们希望将所有这些文件合并到一个精灵文件中,稍后我们将其用作CSS 精灵

我们经常想更新它们,所以我们希望有一个命令或脚本在项目构建期间合并这些图标。

3. 使用 ImageMagick 合并图像

**要在终端中操作图像,我们将使用ImageMagick 。*我们将从“icons”*目录中获取所有图像并将它们垂直附加:

$ magick ./icons/*.jpg -append nav-sprite.jpg

如果出于某种原因,我们需要一个水平精灵,我们需要在命令中用*“-append”替换“+append”*:

$ magick ./icons/*.jpg +append nav-sprite.jpg

如果我们对减少执行时间感兴趣,我们还可以使用 ImageMagick 的轻量级分支,称为GraphicsMagick 。它在附加图像方面的用法是相同的:

$ gm convert ./icons/*.jpg -append nav-sprite.jpg

4. 处理大图像

用作精灵的图像通常很小。但是,如果我们想处理一些大文件,由于 ImageMagick 的默认限制,我们可能会遇到问题。幸运的是,我们可以通过编辑 ImageMagick 的“policy.xml”文件来改变这些限制。

我们可以在*“/etc/ImageMagick-7”目录中找到它(其中 7 是当前安装的 ImageMagick 的版本)。或者,我们可以使用find*命令:

$ find / -name policy.xml

我们对*“资源”*域中的行特别感兴趣:

<policy domain="resource" name="memory" value="2GiB"/>
<policy domain="resource" name="map" value="4GiB"/>
<policy domain="resource" name="width" value="10KP"/>
<policy domain="resource" name="height" value="10KP"/>
<policy domain="resource" name="area" value="100MP"/>
<policy domain="resource" name="disk" value="16EiB"/>
<policy domain="resource" name="file" value="768"/>
<policy domain="resource" name="thread" value="4"/>
<policy domain="resource" name="time" value="3600"/>

例如,我们可以将像素限制扩大两倍并相应地调整内存:

<policy domain="resource" name="memory" value="8GiB"/>
<policy domain="resource" name="map" value="16GiB"/>
<policy domain="resource" name="width" value="20KP"/>
<policy domain="resource" name="height" value="20KP"/>
<policy domain="resource" name="area" value="400MP"/>

5. 使用 Netpbm 合并图像

我们还可以使用Netpbm 工具包连接图像。有一个名为pnmcat的简单工具可以做我们想做的事情,但它在pnm图像上运行。我们将首先将我们的图像转换为pnm格式,然后将它们连接起来,最后将它们转换回所需的格式:

$ pnmcat -lr <(pngtopnm ./icons/1.png) <(pngtopnm ./icons/2.png) | pnmtopng > nav-sprite.png

只要我们在没有透明度的情况下合并大小完全相同的图像,这将正常工作。如果我们处理不同大小的图像,我们需要添加“ -jtop ”参数来将图像对齐到最终图片的顶部。如果我们使用透明度,我们需要创建一个 alpha 通道掩码并将其传递给pnmtopng命令:

$ pnmcat -jtop -lr <(pngtopnm ./icons/1.png) <(pngtopnm ./icons/2.png) | pnmtopng -alpha <(pnmcat -black -jtop -lr <(pngtopnm -alpha ./icons/1.png) <(pngtopnm -alpha ./icons/2.png))> nav-sprite.png