9 Patch 編輯器 - 線上所見即所得工具，用於建立9 patch圖像
9 Patch 編輯器是一個類似於 Android Studio 中的線上所見即所得工具。該工具允許您建立可自動調整大小以適應視圖內容和螢幕尺寸的點陣圖圖像。您可以根據圖像中繪製的指示器水平或垂直縮放圖像的選定部分。
如何使用
按照以下步驟使用 9 Patch 編輯器建立 NinePatch 圖形。您需要一張想要建立 NinePatch 圖像的圖片。
- 點擊選擇圖片按鈕或將要建立 NinePatch 圖像的圖片拖入編輯器。
在開啟的工作區中，中間面板是您的繪圖區域，您可以在其中編輯可拉伸補丁和內容區域的線條。右側面板是預覽區域，您可以在其中預覽拉伸後的圖形。
- 為您的 NinePatch 圖像更改圖像名稱。您的圖像將以 .9.png 檔案副檔名儲存。
- 在1像素周邊內點擊以繪製定義可拉伸補丁和（可選）內容區域的線條。
- 完成後，點擊儲存圖像按鈕儲存更改。
圖1. 顯示 NinePatch 圖像的 9 Patch 編輯器。
為確保您的 NinePatch 圖形能夠正確縮小，請驗證任何可拉伸區域的大小至少為 2x2 像素。否則，這些區域在縮小時可能會消失。為避免縮放過程中的插值導致邊界處的顏色發生變化，請在可拉伸區域的前後提供1像素的額外安全空間。
注意：普通 PNG 檔案（*.png）載入時會在圖像周圍添加一個空的1像素邊框。您可以在邊框內繪製可拉伸補丁和內容區域。之前儲存的 NinePatch 檔案（*.9.png）會按原樣載入，不會添加繪圖區域，因為它已經存在。
可選控制項
- 縮放：調整繪圖區域中圖形的縮放級別。
- 補丁縮放：調整預覽區域中圖像的比例。
- 顯示鎖定：在滑鼠懸停時可視化圖形的不可繪製區域。
- 顯示補丁：在繪圖區域預覽粉色可拉伸補丁。如圖2所示，粉色表示可拉伸補丁。
- 顯示內容：在預覽圖像中突出顯示內容區域。如圖2所示，紫色表示允許內容的區域。
- 顯示錯誤補丁：在拉伸時可能在圖形中產生瑕疵的補丁區域周圍添加紅色邊框，如圖2所示。如果消除所有錯誤補丁，您將保持拉伸圖像的視覺連貫性。
圖2. 編輯器中顯示內容、補丁和錯誤補丁的 NinePatch 圖像。