使用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 _ 128px, 我要改成 512px _ 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

相關文章:

翻譯: