Sketch基礎教程(五)文本、圖像

​ 文本

一、添加文本


要插入文本,請在工具欄或菜單欄中選擇“ 置入”>“文本 ”,或按T,然後在畫布上單擊任意位置並開始輸入。


Sketch基礎教程(五)文本、圖像


你也可以單擊並拖動以創建固定大小的文本框。這樣,文本將自動換行,而不是擴展文本框本身的大小。


Sketch基礎教程(五)文本、圖像


#添加富文本#


要插入富文本格式(具有其他應用程序的樣式),請選擇“ 編輯”>“粘貼”>“粘貼為富文本格式”,或按⌘+ ⌥+ ⇧+ V。


Sketch基礎教程(五)文本、圖像


#如何使用路徑上的文本#


要將文本添加到矢量路徑,在“圖層列表”中需要一個文本圖層和一個位於其下方的形狀圖層。選擇文本層,然後選擇“ 字符”>“路徑文字”。最後,將你的文本層拖向形狀層,使其對齊到位。


Sketch基礎教程(五)文本、圖像


要從路徑中刪除文本,請再次選擇“ 字符”>“路徑文字”,或在“層列表”中移動其位置。


二、文本選項


你可以在檢查器中以及菜單欄的“ 文本”菜單中找到用於更改文本外觀的選項。如果你選擇的字體支持OpenType功能,則可以在“ 文本”菜單中找到它們;如果它具有“變量”選項,則可以在“檢查器”中找到它們。


#如何使用文本菜單更改文本#


在“ 文本”菜單欄中,你將找到以下選項:

  • 基本樣式(粗體,斜體,下劃線)
  • 增大和減小大小,對齊
  • 創建無序列表和有序列表
  • 轉換(大寫和小寫)
  • 字距調整,連字和基線。


#如何使用OpenType功能#


如果使用支持OpenType功能的字體,請選擇文本,然後從菜單欄中選擇“ 文本”>“ OpenType功能 ”,然後選擇並啟用要使用的OpenType功能。


#如何更改文本的檢查員#


在畫布上選擇一個文本層,你將在檢查器中看到其所有格式設置選項和屬性。


Sketch基礎教程(五)文本、圖像


  1. 在外觀面板下,你可以保存和應用文本樣式,以在設計中保持不同文本層的外觀一致。查看“ 文字樣式”以瞭解更多信息。
  2. 使用這些控件來選擇文本層的字體(字體),粗細,字體大小和顏色。
  3. 如果你使用帶有可變選項(重量,寬度,傾斜度,光學尺寸等)的OpenType字體,請單擊此按鈕以顯示“可變字體選項”彈出窗口,然後在滑塊上拖動以調整每個單獨的屬性。
  4. 使用“ 字符”,“ 行”和“ 段落”控件可以調整字符,行和段落之間的間距。
  5. 自動寬度,自動高度和固定寬度控件改變文本框大小如何調整以適應其內容。自動寬度表示文本框將盡可能擴大以使你的文本適合一行。在這種情況下,你只能使用水平對齊方式。自動高度會將文本自動換行以適合文本框的寬度,並調整文本框的高度以適合其內容。固定寬度使您可以控制文本的高度和寬度。文本將自動換行以適合框本身,並在超出其高度時裁剪。在這種情況下,你可以設置水平和垂直對齊方式。
  6. 使用“對齊”面板中的按鈕來設置文本的水平和垂直對齊。
  7. 要打開“文本選項”面板,請單擊“文本”面板頂部的齒輪圖標。你可以在此處設置文本修飾(下劃線,刪除線)和轉換選項(大寫,小寫)。轉換選項是非破壞性的,因此你可以鍵入常規的大寫字母,然後將文本自動轉換為全部大寫。

#如何更改文字顏色#


有兩種方法可以更改文本的顏色。你可以使用“文本”面板中的“顏色”按鈕將不同的顏色應用於文本的不同部分。


Sketch基礎教程(五)文本、圖像


或者,你可以在“填充”面板下應用填充。這將影響整個文本層,是應用漸變的理想選擇。它還將覆蓋您在“文本”面板中設置的任何顏色。


Sketch基礎教程(五)文本、圖像


#如何調整線高#


創建新的文本層時,其線高將自動調整以匹配其字體大小。

手動調整文本層的行高,字體或字體大小時,它將重新定位自身,以便第一個基線始終保持在原位。


如果你更改段落中的字體或字體粗細,則行高將保持一致。


Sketch基礎教程(五)文本、圖像


三、將文本轉換為矢量圖形


要將文本轉換為矢量形狀(並像其他矢量圖層一樣對其進行編輯),請選擇文本圖層,然後選擇“ 圖層”>“輪廓化”。或按⌥+ ⇧+ O。


Sketch基礎教程(五)文本、圖像


如果將布爾操作應用於文本圖層,則其效果將與轉換為輪廓相同。


注意:將文本轉換為輪廓線是一個破壞性的過程,你將無法再次編輯文本本身。將大量文本轉換為輪廓會降低Sketch的速度。


圖片


除了將圖像填充和數據源中的圖像添加到現有圖層外,還可以將常規位圖圖像添加到Sketch文檔中。


一、插入圖片


要將圖像插入文檔,請直接將其從Finder或桌面拖出,或選擇“ 置入”>“圖像”。


Sketch基礎教程(五)文本、圖像


二、替換圖片


如果你已經調整了文檔中圖像層的大小並設置了樣式,但又想替換圖像本身,請選擇它,然後選擇“ 圖層”>“圖像”>“替換...”。


Sketch基礎教程(五)文本、圖像


三、縮小圖像尺寸


在文檔中添加大量圖像會增加其文件大小,並減慢Sketch的速度。為了解決這個問題,你可以通過選擇圖層>圖像>最小化文件大小來減小圖像的大小。


Sketch基礎教程(五)文本、圖像



Sketch具有少量的位圖圖像編輯工具選擇。要使用它們,請在“畫布”上選擇一個圖像,然後雙擊它以進入編輯模式。從那裡,你可以從檢查器中的兩個工具中進行選擇:

  • 選擇:讓你選擇圖像上的矩形區域。
  • 魔術棒:可讓你單擊並拖動圖像上的任意位置以選擇特定區域。阻力越大,選擇公差越大。


做出選擇後,按住⇧可以添加其他選擇,或者按住⌥可以從選擇中減去。你還可以使用以下工具:


  • 反選:反向你的選擇,因此現在選擇了未選擇的區域。
  • 裁剪:裁剪圖層,使其僅包含所選內容。
  • 填充:使用顏色彈出框中的顏色填充選擇。


Sketch基礎教程(五)文本、圖像


完成編輯後,請在圖像外部單擊,或按Esc或Enter。


你還可以使用“檢查器”中的“顏色調整”面板對圖像進行基本的,非破壞性的顏色調整。只需選擇要編輯的圖像,然後移動滑塊即可調整色相,飽和度,亮度和對比度。


Sketch基礎教程(五)文本、圖像


文末福利:sketch漢化破解安裝包+sketch UI源文件素材+sketch視頻教程;

領取方式:關注公眾號,後臺回覆:sketch


分享到:


相關文章: