【Inkscape】SVG矢量图形编辑器
Inkscape目錄
- 一、Inkscape簡(jiǎn)介
- 1.1 Inkscape簡(jiǎn)介
- 1.2 矢量圖形的優(yōu)點(diǎn)
- 3.3 參與開(kāi)源
- 二、Inkscape下載與安裝
- 2.1 Inkscape下載
- 2.2 安裝
- 三、Inkscape使用
- 3.1 首次啟動(dòng)
- 3.2 官方教程 - 基礎(chǔ)
- 3.3 官方教程 - 形狀
- 3.4 官方教程 - 高級(jí)
- 3.5 官方教程 - 臨摹
- 3.6 官方教程 - 臨摹像素圖
- 3.7 官方教程 - 書(shū)法
- 3.8 官方教程 - 插值
- 3.9 官方教程 - 設(shè)計(jì)元素
- 3.10 官方教程 - 提示與技巧
- 四、快捷鍵
- 4.1 界面操作
- 4.2 元素方向移動(dòng)
- 4.3 元素層疊順序移動(dòng)
- 4.4 元素選擇
- 4.5 畫(huà)布操作
- 4.6 文件創(chuàng)建和管理
- 4.7 形狀創(chuàng)建
- 4.8 限制鍵
- 4.9 對(duì)象變換
- 4.10 面板快捷鍵
- 五、基礎(chǔ)操作
- 5.1 矩形
- 5.2 橢圓形
- 5.3 星形和多邊形
- 5.4 螺旋形
- 5.5 路徑
- 5.5.1 創(chuàng)建和編輯路徑
- 5.5.2 子路徑,路徑合并
- 5.5.3 形狀和文字轉(zhuǎn)換為路徑
- 5.5.4 布爾運(yùn)算,集合運(yùn)算
- 5.5.5 路徑偏移,放大或縮小
- 5.5.6 路徑簡(jiǎn)化,Ctrl + L ,減少路徑上的節(jié)點(diǎn)數(shù)量
- 5.5.7 描邊轉(zhuǎn)路徑應(yīng)用實(shí)例
- 5.5.8 路徑反向
- 5.5.9 路徑擴(kuò)展 - 插值
- 5.6 文字
- 5.6.1 文字輸入/編輯
- 5.6.2 文字沿路徑排列
- 5.6.3 文字填充到形狀
- 六、典型案例
- 6.1 普通圖片轉(zhuǎn)SVG
一、Inkscape簡(jiǎn)介
1.1 Inkscape簡(jiǎn)介
Inkscape是一個(gè)功能強(qiáng)大的開(kāi)源桌面應(yīng)用程序,用于創(chuàng)建二維可縮放矢量圖形。 盡管Inkscape主要是一種插圖工具,但它可用于各種計(jì)算機(jī)圖形任務(wù)。
Inkscape可以完成的操作種類(lèi)繁多,有時(shí)令人驚訝。 它用于制作圖表,徽標(biāo),程序營(yíng)銷(xiāo)材料,網(wǎng)絡(luò)圖形,甚至用于剪貼簿。 人們還繪制游戲精靈,制作橫幅,海報(bào)和小冊(cè)子。 其他人則使用Inkscape來(lái)草擬Web設(shè)計(jì)模型,印刷電路板的詳細(xì)布局或生成輪廓文件以發(fā)送到激光切割設(shè)備。
1.2 矢量圖形的優(yōu)點(diǎn)
Inkscape的本機(jī)文件格式可縮放矢量圖形(SVG)是W3C的開(kāi)放標(biāo)準(zhǔn) 。 矢量圖形由點(diǎn)和點(diǎn)之間的線組成。 在Inkscape中,這些稱(chēng)為節(jié)點(diǎn)和路徑。 大多數(shù)矢量圖形工具使用戶(hù)能夠創(chuàng)建稱(chēng)為“基本體”或形狀的路徑。 形狀實(shí)際上只是一條封閉的路徑。 諸如圓形,正方形,三角形和其他多邊形之類(lèi)的形狀都廣泛用于創(chuàng)建矢量圖形。 計(jì)算機(jī)圖像的另一種主要類(lèi)型是光柵圖形。 光柵圖形不是由路徑組成,而是由像素網(wǎng)格構(gòu)成。 矢量圖形可以輕松轉(zhuǎn)換為柵格圖形,但是將柵格圖形轉(zhuǎn)換為矢量要困難得多。
柵格圖形的常見(jiàn)文件格式包括JPG,PNG,BMP和TIF。 數(shù)碼照片通常是作為光柵圖像而生的,因此最好在光柵圖形工具(例如GIMP或darktable)中對(duì)其進(jìn)行編輯 。 但是,可以將光柵圖形導(dǎo)入到Inkscape中,以便在較大的矢量圖形項(xiàng)目中使用,方法是將其鏈接或直接將其嵌入到文件中。
使用矢量而不是光柵圖形的主要優(yōu)點(diǎn)歸結(jié)為可伸縮性和文件大小,但是矢量方法并不適合所有用例。
幾乎任何其他矢量圖形工具都可以打開(kāi)Inkscape用作本機(jī)文件格式的SVG格式,并且所有現(xiàn)代Web瀏覽器都可以查看SVG格式,這意味著SVG越來(lái)越多地用于Web和其他類(lèi)型的數(shù)字設(shè)計(jì)中。
3.3 參與開(kāi)源
Inkscape可通過(guò)GPL開(kāi)源許可證獲得,并且該項(xiàng)目是Software Freedom Conservancy的成員。
自2003年以來(lái),一小撮不斷變化的核心開(kāi)發(fā)人員團(tuán)隊(duì)一直在構(gòu)建Inkscape,當(dāng)時(shí)其代碼庫(kù)是從SodiPodi派生的,而SodiPodi本身就是GILL(由Raph Levien創(chuàng)建的GNOME插圖應(yīng)用程序)的一個(gè)分支。 Inkscape網(wǎng)站邀請(qǐng)人們參與其中,并概述了人們可以參與的多種不同方式,例如編寫(xiě)代碼本身,幫助網(wǎng)站,編寫(xiě)文檔,生成示例圖形,創(chuàng)建教程,以及通常有助于推廣Inkscape無(wú)論何時(shí)何地。
二、Inkscape下載與安裝
2.1 Inkscape下載
下載 exe/msi/7z文件均可,我就下載exe了,可以直接安裝。
2.2 安裝
三、Inkscape使用
3.1 首次啟動(dòng)
3.2 官方教程 - 基礎(chǔ)
3.3 官方教程 - 形狀
3.4 官方教程 - 高級(jí)
3.5 官方教程 - 臨摹
3.6 官方教程 - 臨摹像素圖
3.7 官方教程 - 書(shū)法
3.8 官方教程 - 插值
3.9 官方教程 - 設(shè)計(jì)元素
3.10 官方教程 - 提示與技巧
四、快捷鍵
4.1 界面操作
| 打開(kāi)關(guān)閉右側(cè)屬性面板 | F12 |
4.2 元素方向移動(dòng)
| 方向移動(dòng)2px | 上下左右鍵 |
| 方向倍速移動(dòng) | Shift + 方向鍵 |
4.3 元素層疊順序移動(dòng)
| 上移一層 | PgUp |
| 下移一層 | PgDown |
| 移至頂層 | Home |
| 移至底層 | End |
4.4 元素選擇
| 選擇下層元素 | Alt + 點(diǎn)擊 |
| 移動(dòng)下層元素 | Alt + 鼠標(biāo)拖動(dòng) / 方向鍵 |
| 全選元素 | Ctrl + A |
| 選擇相同類(lèi)型元素 | Ctrl + Shitf + A |
4.5 畫(huà)布操作
| 平移畫(huà)布 | Ctrl + 箭頭 或 鼠標(biāo)中鍵(點(diǎn)擊滾輪) 或 空格+鼠標(biāo)移動(dòng) |
| 畫(huà)布縮放 | + - 或 Ctrl+滑動(dòng)滾輪 或 Ctrl+右鍵 Shift+右鍵 |
4.6 文件創(chuàng)建和管理
| 新建文件 | Ctrl+N |
| 從模板新建文件 | Ctrl+Alt+N |
| 打開(kāi)文件 | Ctrl+O |
| 保存文件 | Ctrl+S |
| 文件另存為 | Shift+Ctrl+S |
| 多文件窗口切換 | Ctrl+Tab |
4.7 形狀創(chuàng)建
| 矩形 | R 或 F4 |
| 3D盒子 | X 或 Shift+F4 |
| 圓,橢圓,圓弧 | E 或 F5 |
| 星形,多邊形 | * |
| 螺旋 | I 或 F9 |
| 手繪線 | P 或 F6 |
| 貝塞爾曲線,直線 | B 或 Shift+F6 |
| 貝塞爾曲線,斷開(kāi)節(jié)點(diǎn) | Shift + B |
| 貝塞爾曲線,連接斷開(kāi)的節(jié)點(diǎn) | Shift + J |
| 書(shū)法或筆刷輪廓 | C 或 Ctrl+F6 |
| 文字 | T 或 F8 |
| 裝飾對(duì)象 | A 或 Shift + F3 |
| 擦除現(xiàn)有路徑 | Shift+E |
| 填充封閉區(qū)域 | U 或 Shift+F7 |
| 逐漸漸變 | G 或 Ctrl+F1 |
| 從圖像中拾取顏色 | D 或 F7 |
| 流程圖連接器 | o 或 Ctrl+F2 |
| 選擇工具 | S 或 F1 或 Esc |
| 選擇節(jié)點(diǎn)編輯 | N 或 F2 |
| 扭曲對(duì)象 | W 或 Shift+F2 |
| 測(cè)量工具 | M |
| 縮放工具 | Z 或 F3 |
4.8 限制鍵
執(zhí)行操作時(shí),加上Ctrl 鍵,可以鎖定縱橫比,旋轉(zhuǎn)的角度
4.9 對(duì)象變換
|選擇對(duì)象后:
- < 和 > 可以控制縮放,默認(rèn)縮放變化是 2px
- [ 和 ] 可以控制旋轉(zhuǎn),默認(rèn)旋轉(zhuǎn) 15°
- 加 Ctrl 鍵,縮放變化可以變大,旋轉(zhuǎn)角度變?yōu)?90°
- 加 Alt 鍵,微調(diào)縮放和旋轉(zhuǎn),以一個(gè)屏幕像素
4.10 面板快捷鍵
| 填充和筆刷 | Ctrl+Shift+F |
| 變換 | Ctrl+Shift+M |
| 對(duì)齊和分散 | Ctrl+Shift+A |
| 對(duì)象和屬性 | Ctrl+Shift+O |
| 符號(hào) | Ctrl+Shift+Y |
| 文字和字體 | Ctrl+Shift+T |
五、基礎(chǔ)操作
5.1 矩形
繪制矩形時(shí),按Shift+拖動(dòng),會(huì)以當(dāng)前光標(biāo)點(diǎn)的位置為中心點(diǎn),向四周擴(kuò)張。
繪制矩形時(shí),按Ctrl+拖動(dòng),會(huì)以固定比例(1:1、1:2、1:3 …)來(lái)繪制矩形。
5.2 橢圓形
5.3 星形和多邊形
5.4 螺旋形
5.5 路徑
5.5.1 創(chuàng)建和編輯路徑
5.5.2 子路徑,路徑合并
5.5.3 形狀和文字轉(zhuǎn)換為路徑
5.5.4 布爾運(yùn)算,集合運(yùn)算
5.5.5 路徑偏移,放大或縮小
①對(duì)象轉(zhuǎn)換為路徑;
②Ctrl+D復(fù)制路徑,填充另外的顏色;
③連續(xù)按Ctrl+(,向內(nèi)偏移,上層路徑向內(nèi)收縮,露出下層路徑。
向外偏移 Ctrl + ) ,操作步驟同向內(nèi)偏移,只是快捷鍵不同
動(dòng)態(tài)偏移 Ctrl + J , 操作步驟:
①②同前
③按Ctrl+J,上層路徑頂部出現(xiàn)一個(gè)節(jié)點(diǎn),拉動(dòng)節(jié)點(diǎn)可以放大/縮小路徑,相當(dāng)于向內(nèi)偏移和向外偏移的合體
鏈接偏移 Ctrl + Alt + J , 含義:源路徑發(fā)生變動(dòng),鏈接路徑同步變動(dòng)。操作步驟:
①對(duì)象轉(zhuǎn)換為路徑,此時(shí),藍(lán)色為源路徑;
②不用復(fù)制路徑,直接 Ctrl+Alt+J,會(huì)在藍(lán)色源路徑底層產(chǎn)生一個(gè)新的鏈接路徑,填充橙色。注意,此時(shí)橙色為下層鏈接路徑;
③移出鏈接路徑,利用節(jié)點(diǎn)工具查看,源路徑有若干節(jié)點(diǎn),鏈接路徑只有頂部一個(gè)節(jié)點(diǎn)
④調(diào)整源路徑節(jié)點(diǎn),鏈接路徑會(huì)同步變動(dòng)
鏈接路徑調(diào)整尺寸后,依然可以和源路徑同步變化
源路徑調(diào)整尺寸,鏈接路徑同步變化尺寸
鏈接路徑頂部的一個(gè)節(jié)點(diǎn)為動(dòng)態(tài)偏移節(jié)點(diǎn),可以放大或收縮路徑
如果想解除鏈接路徑和源路徑的同步關(guān)系,可以執(zhí)行 對(duì)象轉(zhuǎn)化為路徑 命令,它就會(huì)轉(zhuǎn)化為普通路徑,出現(xiàn)若干節(jié)點(diǎn)。
5.5.6 路徑簡(jiǎn)化,Ctrl + L ,減少路徑上的節(jié)點(diǎn)數(shù)量
5.5.7 描邊轉(zhuǎn)路徑應(yīng)用實(shí)例
最終效果圖
操作步驟
①繪制矩形/正方形,填充藍(lán)色
②對(duì)象轉(zhuǎn)路徑,依次選中下方兩個(gè)節(jié)點(diǎn),按Shift鍵,向內(nèi)側(cè)移動(dòng)4次,形成等腰梯形
③給等腰梯形添加一個(gè)較粗的描邊,使描邊四角形成圓弧
④描邊轉(zhuǎn)路徑,在描邊的內(nèi)外側(cè)各生成一個(gè)子路徑
⑤分離子路徑,解除群組,刪除內(nèi)部路徑,只保留外部路徑,填充藍(lán)色,Ctrl+D復(fù)制一個(gè),內(nèi)部圓角梯形就做好了。
⑥利用上面復(fù)制的圓角梯形做箭頭。給其中的一個(gè)添加一個(gè)較粗的描邊,使其內(nèi)外拐角處均為圓弧
⑦利用節(jié)點(diǎn)選擇工具將不需要的節(jié)點(diǎn)刪除,選中末端的兩個(gè)節(jié)點(diǎn),移除兩個(gè)非端點(diǎn)節(jié)點(diǎn)間的線段,截?cái)嗝柽?br />
⑧再次描邊轉(zhuǎn)路徑,最右側(cè)中間添加一個(gè)節(jié)點(diǎn),向外拉出箭頭的頭部端點(diǎn),然后在箭頭的末端上下各增加一個(gè)節(jié)點(diǎn)
⑨拉出箭頭的兩翼
⑩拼合圖形,完工。
5.5.8 路徑反向
5.5.9 路徑擴(kuò)展 - 插值
①繪制圓形和五角星,頂端對(duì)齊,設(shè)置填充,描邊。注意,它們的起始節(jié)點(diǎn)都在右側(cè)。
②是否勾選再制一份終點(diǎn)路徑
③插值指數(shù),上1,下-1
④插值步數(shù),上5,下3
⑤插值方式,上1,下2
⑥是否勾選插值樣式
⑦勾選實(shí)時(shí)預(yù)覽
①直線繪制一段折線,Ctrl+D復(fù)制,居中對(duì)齊,描邊改成不同顏色
②選中兩條路徑,擴(kuò)展 - 從路徑生成 - 插值, 步數(shù)改為200,勾選插值樣式
復(fù)制拼接效果
插值應(yīng)用 - 花瓶
①繪制一條曲線,Ctrl+D復(fù)制,對(duì)象-水平翻轉(zhuǎn),上下居中對(duì)齊
②選中兩條路徑,擴(kuò)展 - 從路徑生成 - 插值, 步數(shù)改為220
插值應(yīng)用 - 彩色花瓶
5. 插值應(yīng)用 - 衍射
5.6 文字
5.6.1 文字輸入/編輯
5.6.2 文字沿路徑排列
5.6.3 文字填充到形狀
六、典型案例
6.1 普通圖片轉(zhuǎn)SVG
總結(jié)
以上是生活随笔為你收集整理的【Inkscape】SVG矢量图形编辑器的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: Scala下载及IDEA安装Scala插
- 下一篇: 数字图像处理课程设计