使用Inkscape调整svg图片大小

有时候需要个特定大小的 svg 图片,比如某个按钮的图标或者网页上某个位置的缩略图。有才华的自己可以画,业余选手只能去网络上搜个无版权的,自己动手调整优化了。

Google 搜索出来的中文内容,调整 svg 的图片都是直接编辑源文件(xml 文件),简单的图片还好说,复杂的实际操作起来很不方便。开源工具软件 Inkscape 是你的合理选择之一。

示例过程如下:

1. 下载安装 Inksape 后,用 Inkscape 打开你的目标 svg 图片

下载安装过程省略,按'Ctrl+O'快捷打开 svg 图片

2. 设置图片大小

    1. 按'Shift+Ctrl+D'快捷键打开 '文件属性' 对话框(当然也可从菜单栏的 '文件'>'文件属性' 打开,主要是快捷键快)。
    1. 设置图片的宽度和高度,如下图所示:

inkscape set image size

这个示例图片为 128px x 128px, 我要改成 512px x 512px,两个框都填上 512 即可,填写完成后关闭对话框(调整即刻生效)

3. 调整图片'内容(元素? 好像专业的叫图层,反正就是你图片的真实内容)大小/位置',如下图所示:

inkscape manipulate

调整图片大小后,往往图片相对背景的位置也变化了,这个时候要调整位置,比如左右上下居中对齐,按照图中的数字操作步骤

  • 1 选择所有图层(有的图片有好多层组成,不全部选中无法整体位移);
  • 2 确认图层被选中,表现为图层的各个方向冒出可以拖动的图标;
  • 3 点 3 这个地方的按钮,上帝视角观察;
  • 4 和 5,就是调整图层居中;

值得特别说明的是,居中的时候,可以点上那个 移动/对齐选中作为整体(Move/align selection as group)

selection-as-group

点中后,就是当作一个整体对待,好比阅兵的方队,一致行动,图层位置相对位置固定,不然有的时点居中操作时图层会错乱。

一开始我并不知道这一点,图层搞乱会有泪崩的感觉,锁定后让人很放心,特别好用。

这样一通操作后,图片基本放在合适的位置了。紧接着,可能要调整图层元素大小

inkscape set layer size

  • 如果你需要锁定比例大小,把那个锁型图标掉点上(建议一般情况,先把 1 的那个锁点上,这样不至于把图片弄得过于扭曲))

  • 再用鼠标拖动图层的各个方向,调整到合适大小(当然也可以指定高度 W 和宽度 H,这样就不需要拖动鼠标设置大小了,固定大小)

  • 如果需要,再次点击上下左右居中的按钮

4. 另存为保存

inkscape save

这样大小和位置都调整完毕。

当然,你也可以给图片调整颜色、添加辅助线精确调整位置等,非专业人员,我一般情况下用不到,读者可以自行摸索。

最后修改于: Thursday, January 25, 2024
欢迎关注微信公众号,留言交流。

相关文章:

翻译: