起點課堂會員權益
職業體系課特權
線下行業大會特權
個人IP打造特權
30+門專項技能課
1300+專題課程
12場職場軟技能直播
12場求職輔導直播
12場專業技能直播
會員專屬社群
榮耀標識PaintCode 用戶操作指南（動態圖形篇）
調整大小限制（Resizing Constraints?）
設計師能夠在檢查器中使用 縮放約束（Resizing Constraints）來定義圖形調整行為。
這個約束定義著圖形和框架之間的關系。主要有以下 6 種：靠左，靠右，靠上，靠下，寬和高。
在定義圖形和框架之間的關系時，橫向約束（靠左、寬、靠右）是完全獨立的，垂直約束（靠上、高、靠下）也是一樣。為了清晰起見，在這里只描述水平約束行為。
每一個約束都是有剛性（尖的）和柔性（弧形）的。
靠左約束表示的是圖形的左側和圍框左邊的距離。當靠左約束是剛性（尖的）的， PaintCode 將確保無論設計師如何調整框架的大小，圖形的左側與框架的左側將會保持一個恒定的距離。當靠左約束是柔性（弧形）的，PaintCode 會使得相應的距離盡可能的大，尊重其他兩種約束（寬、靠右）。
寬和靠右約束也和靠左約束類似。通過具體的 剛性（尖的）／柔性（弧形） 約束的組合，設計師能夠實現各種有用的行為。
居中（Centering a fixed-width shape）
按比例調整（Making the shape resize proportionally）
右對齊（Shape that sticks to the right）
左對齊并按照一定比例縮放（Shape that sticks to the left and resizes proportionally）
框架與圖形等級（Frame & Shape Hierarchy?）
- 設計師能夠嵌套多框架
- 框架也有大小限制
PaintCode 為設計師自動創建框架，并將框架的位置和大小帶入描述中。默認情況下，所有的圖形是完全或者部分屬于某一框架的。
在某些情況下，框架通過它影響完全封閉的圖形。設計師可以在框架檢查器中通過檢查 只應用到完全封閉的圖形（Apply only to entirely enclosed shapes）復選框來開啟這個行為。
如果一個圖形屬于多個框架，這些框架中最小的會被用來做這個圖形的參考框架。
動態貝塞爾曲線（Dynamic Béziers?）
對于簡單的圖形，像矩形和橢圓形，完全可以通過縮放約束來指定縮放行為。然而，設計師需要通過貝塞爾曲線來完成更精確的控制。
它們之間的不同主要有：
- 設計師能夠通過貝塞爾曲線為每個單獨的控制節點定義縮放限制
- 不同的控制節點依托于不同的框架（對貝塞爾曲線來說沒有一個單獨的參考框架）
控制節點沒有寬和高，對它的控制更簡單：
設計師能夠通過四個方向限制控制節點：左、右、上、下，每個限制點都可以是剛性（尖的）或者柔性（弧形）。
當靠左約束是剛性（尖的），控制節點會與參考框架的左側保持一個固定的距離。相同的，當右約束是剛性（尖的），控制節點也會雨參考框架的右側保持一個固定的距離。
當左、右約束都是柔性（弧形）的時候，控制節點會與參考框架保持在一個相對的位置。例如，想象一個 300 px 寬，控制點距離參考框架左側 100 px 的框架。當設計師調整框架到 600 px 寬，控制節點距離參考框架左側 200 px。
一個框架不可能同時擁有左右約束。
能夠通過設置單獨控制節點的縮放約束，來實現復雜的縮放行為調整。此外，設計師可以使用多個（甚至嵌套）框架，創建更多有趣的行為變的容易。
動態圖形和變換（Dynamic Shapes & Transforms）
一旦圖形變換（例如，旋轉），將不再能對其進行縮放限制，就像前面章節中提到的一樣。
這種情況下，設計師仍然能夠指定變換源頭的位置行為。這允許設計師在框架中以某個中心點旋轉圖形，甚至設計師不再能夠控制它的尺寸。
這種情況下，縮放控制看起來會有些不同 – 在中間會有一個綠色變換原點符號：
當一個變量連接到其他圖形的變換屬性的時候，也會有同樣的限制。
PaintCode 用戶操作指南系列文章
文章已經完結，敬請期待下一部《Sketch 3用戶操作指南及實戰案例全解》
本作品由人人都是產品經理特邀專欄作家@鄭幾塊 翻譯并獨家授權發布，未經許可禁止轉載
- 目前還沒評論，等你發揮！
