在 Sketch 中，您可以使用數學運算以不同方式操作設計的屬性。無論您只是調整圖層大小，還是想使用 pi 建立徑向圖表，本指南都將幫助您掌握數學設計。
開始使用基本函數
Sketch 屬性檢查器中的任何數值欄位都支援數學計算，從圖層大小到畫布對齊。要將數值欄位轉換為數學運算式，只需新增一個基本數學運算子：+、-、/、* 或 ^。還有一些其他運算子可以執行特定功能，我們將在本篇文章後面探討。
- 百分比運算子：
%（僅適用於某些欄位） - 對齊調整大小快捷鍵：
L、R、T、B、C和M - 捨入函數：
round() - 數學常數：
pi(π)
計算機入門
在我們深入了解您可以使用這些計算實際做些什麼之前，讓我們先來看看計算機的運作方式。與任何標準計算機一樣，Sketch 的數學運算遵循 PEMDAS 規則。括號 () 總是先計算，並且可以巢狀 (() + () - () ...) 以進行特定排序。接下來，Sketch 將計算您的指數運算子 ^，然後是標準乘法 * 和除法 /，最後是加法 + 和減法 -。
調整大小和重新對齊
數學運算的主要用例是操作設計中的不同 Sketch 元素。想要將圖示精確向右移動 4px？將您的畫板精確放大 2 倍？不再需要猜測、緊張的滑鼠移動或心算。您只需要一些簡單的數學運算。
將圖層水平移動（目前位置為 100px）50 px
在屬性檢查器中，將圖層的 X 欄位更改為 100+50。這將自動將值設定為 150。
建立比您的內文（20pt）大 50% 的新文字樣式
在文字圖層的屬性檢查器中，將文字大小欄位更改為 20*1.5。這將自動將值設定為 30。
使用進階函數更進一步
現在我們已經掌握了基本知識，讓我們來看看您還可以如何使用您的計算。正如我們前面提到的，還有其他例外情況和特定函數可以幫助您在數學運算中做更多事情。將它們組合在一起將創造更多機會。
使用 % 根據父級調整圖層
百分號 % 是 Sketch 中更強大的運算子之一。與其他運算子不同，它會根據**直接父容器**（換句話說，它所在的畫板或群組）的百分比來更改屬性。
您可以使用 % 來設定圖層寬度為父層寬度的百分比。因此，如果您希望導覽列的寬度與畫板相同，只需在寬度欄位中輸入 100% 即可。
您也可以將這個方法與其他計算結合，以獲得更精確的定位。
要將圖層（寬度 100px）的中心水平對齊到其容器（寬度 375px）的中央：
在 X 欄位中輸入：50%-100/2 將自動設定值為 138
使用對齊快捷鍵更聰明地調整大小
在 Sketch 中調整元素大小時，預設情況下它會始終將左上角作為錨點並相應地調整大小。因此，例如，如果您將正方形的高度增加 10px，Sketch 會自動將其添加到底部。但是，您可以新增快捷鍵來控制此行為並提高工作效率。
可用的對齊選項如下：
L從左邊調整大小（預設）[僅限寬度欄位]R從右邊調整大小 [僅限寬度欄位]T從頂部調整大小（預設）[僅限高度欄位]B從底部調整大小 [僅限高度欄位]C或M從中心或中間調整大小（您可以互換使用）
您可以將這些快捷鍵添加到數值或計算式的結尾，以告知 Sketch 從哪裡開始調整大小。
例如，要將形狀調整為 200px 寬，同時保持右對齊：
寬度欄位：輸入 200R 將自動將形狀的寬度設定為 200，但保持圖層的右邊緣位置不變。
要將形狀（寬度 335px）從中心調整為其容器 (375px) 的 50%：
寬度欄位：輸入 50%c 或 50%M 將自動將形狀的寬度設定為 188 並保持中心對齊。
使用 round() 輕鬆捨入計算結果
大多數設計師都希望保持設計盡可能簡潔。round() 函式會自動將數值四捨五入到最接近的整數。這對於任何可能導致產生不希望出現的小數值（進而使圖層超出像素邊界）的計算都非常有用。
例如，要根據黃金比例乘數 (1.618) 在寬度和高度（均為 100px）上產生序列中的下一個形狀：
首先，複製物件。然後，在其寬度和高度欄位中輸入 round(100*1.618)。這會將計算的實際結果 (161.8) 四捨五入到最接近的整數像素 — 162。
如果您想為設計建立自然風格的縮放比例，這將特別有用。您甚至可以發揮創意，透過操作文字欄位和建立新的文字樣式來產生自己的排版比例。
利用圓周率的威力
pi 是數學常數 π 的快捷方式。您可能還記得，如果想知道圓的周長，可以將其直徑乘以 pi。在 Sketch 中，pi 的一個很好的應用案例是製作徑向進度條 — 類似於 Apple Watch 上的「活動記錄」圓環。
LearnSketch.com 的 Joseph 向我們展示了如何結合我們目前學到的知識來製作完美的徑向條。
著色和陰影
調整大小和移動並不是使用數學運算操作元素的唯一方法。Sketch 的顏色選擇器也支援數學計算，因此您可以更改顏色、Alpha 值或不透明度。
一個很好的例子是，您可以使用此功能以不同的精確亮度來縮放相似的物件。因此，在顏色選擇器內，您可以選擇 HSL 作為您的色彩管理設定。然後到亮度欄位並根據需要進行修改。
例如，如果您的顏色在其亮度欄位中設定為 42，您可以以 20% 的增量建立更亮和更暗的顏色陰影
複製預設顏色並重新命名。然後將亮度欄位設定為 42*0.8，這將建立亮度為 34 的新顏色。
而對於較暗的增量
複製預設顏色並重新命名。然後將亮度欄位設定為 42*1.2，這將建立亮度為 50 的新顏色。
使用批次操作控制多個元素
為什麼我們應該滿足於只改變一個元素？最後，您可以在 Sketch 中使用多選元素執行批次操作。如果您想要在保持所選元素原始偏移的同時移動、調整大小或更改任何內容，這將非常有用。
您只需要選擇要更改的元素，並在其欄位中執行相同的數學公式。主要區別在於，由於多個物件可能具有不同的值，因此某些欄位可能會顯示值 多個。別擔心 - 您仍然可以在這些欄位中執行操作。讓我們看一些例子
要將所有選定的畫板向左移動 120px，請選擇您想要移動的所有畫板。
在 X 欄位中：-120 將自動將所有畫板向左移動 120px
要將圖層高度增加 10px，請選擇您想要調整大小的所有圖層。
在高度欄位中：+10 將自動將每個圖層的高度增加 10px，超過其原始大小
在這篇文章中，我們只是觸及了數學運算元可能性的皮毛。您是否使用數學創造了一些驚人的東西？使用 #MadeWithSketch 標籤在社群媒體上與我們分享 - 我們很樂意分享。
