惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

D
Docker
V
V2EX
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
云风的 BLOG
云风的 BLOG
Blog — PlanetScale
Blog — PlanetScale
Recent Announcements
Recent Announcements
Last Week in AI
Last Week in AI
博客园 - Franky
Microsoft Security Blog
Microsoft Security Blog
Hugging Face - Blog
Hugging Face - Blog
H
Hackread – Cybersecurity News, Data Breaches, AI and More
Vercel News
Vercel News
MyScale Blog
MyScale Blog
大猫的无限游戏
大猫的无限游戏
罗磊的独立博客
H
Help Net Security
月光博客
月光博客
Martin Fowler
Martin Fowler
博客园 - 【当耐特】
宝玉的分享
宝玉的分享
P
Proofpoint News Feed
GbyAI
GbyAI
腾讯CDC
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More

mephisto.cc

修复rime-ice无法弹出候选框的问题 开机滚动字体显示优化 个人网站安全防护 树莓派上部署Vaultwarden 使用goaccess实时分析Caddy日志 个人网站监控 Hugo全站AVIF记 Linux下尝试使用Godot开发小游戏 Arch linux dae 透明代理 Airflow接管galler-dl下载任务 如何使用gallery-dl批量下载图像 Arch核显下如何愉快玩Dota2和CS2 Arch/labwc 环境网络相关设置 Rime添加dota2词库 Arch 重装记录 Supertuxkart iOS版终于发布了 打造自己的流媒体音乐服务 剪切板管理工具clipcat推荐 MangoHud性能监控 微信小程序开发记 Rofi试用 解决Arch下VSCode无法输入中文的问题 独立窗口管理器下无法录屏问题处理 上海市二手房成交数据监控 OpenLDAP监控 Arch linux如何顺畅连接蓝牙设备 使用Git和Ansible管理配置文件 Arch Linux SSL VPN 客户端配置 简单获取celery任务实时结果 Arch linux下iNode客户端的安装和使用方法
使用Inkscape调整svg图片大小
2022-11-28 · via mephisto.cc

有时候需要个特定大小的 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

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

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