創(chuàng)建可拉伸位圖 (9-Patch files)

Draw 9-patch 工具 是一個可以讓你制作自動調(diào)整大小來適應(yīng)視圖內(nèi)容和屏幕大小的圖片位圖的所及即所得的工具。基于圖像中的作圖指示,圖像中被選中的部分呈水平或垂直分布

關(guān)于NinePatch圖片的介紹及它的工作原理,請閱讀Canvas and Drawables文檔中的NinePatch 圖片的相關(guān)章節(jié)。

這是一個使用Draw 9-patch 工具制作NinePatch 圖片的快速引導(dǎo)。首先你需要你想制作NinePatch 圖片的png圖片。


1.從你的SDK sdk/tools目錄下運行draw9patch 命令來啟動Draw 9-patch工具。

2.拖拽你的png圖片到Draw 9-patch工具的窗口中(或者File open 9-patch... 查找你的文件) 現(xiàn)在你的工作區(qū)域?qū)⒋蜷_。
左邊的窗口是你的繪圖區(qū)域,在這個區(qū)域你可以編輯可伸縮的線以及內(nèi)容的區(qū)域。右邊的窗口是視圖的展示區(qū)域,當它被拉伸時,你可以看到它的變化。

3.點擊其中,畫一個像素的線來定義可拉伸區(qū)域和內(nèi)容展示區(qū)域。右鍵點擊(在mac上是按住shift鍵點擊)來抹去之前劃過的線

4.結(jié)束的時候 選擇 File > Save 9-patch...
你的圖片將被保存成.9.png圖片。

確保你的NinePatch 圖片可以適當?shù)目s小,任何可伸縮的地區(qū)至少2 x2像素大小。.否則當你縮小的時候它可能會消失, Also, provide one pixel of extra safe space in the graphics before and after stretchable regions to avoid interpolation during scaling that may cause the color at the boundaries to change.

note:一個正常的png圖片(*.9)將在它周圍增加一像素的空白邊,來使我們繪制可拉伸區(qū)域和內(nèi)容顯示區(qū)域,之前保存的ninepatch文件(.9.png)繪制的線與空白的區(qū)域都將被加載,因為他們已經(jīng)存在了。

控制選項:
·Zoom: 調(diào)整繪制區(qū)域中圖像的縮放級別
·Patch scale: 調(diào)整繪制區(qū)域中圖像的比例
·Show lock: 當鼠標懸浮在圖形區(qū)域上時顯示不可繪制區(qū)域
·Show patches: 顯示可拉伸區(qū)域 (粉紅色區(qū)域就是可拉伸區(qū)域 )
·Show content: 內(nèi)容區(qū)域高亮顯示 (紫藍色就是內(nèi)容的可顯示區(qū)域)
·Show bad patches: 拉伸時會在相應(yīng)區(qū)域周邊人為的添加紅色的邊。如果你消除了所有的斑塊區(qū)域,你所拉伸的圖片將看上去很連貫(Visual coherence of your stretched image will be maintained if you eliminate all bad patches.)

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 179,228評論 25 708
  • 線稿總是讓人期待, 成品總是讓人遺憾。 上色水平太需要精進了。
    夏暖心閱讀 241評論 0 4
  • 今天特別開心 zhizhi內(nèi)推有了消息 百草味面試 手串收到了出乎意料的好看 這是最重要的 希望自己接下來好運連連...
    角落蜷縮閱讀 173評論 0 0
  • 一年風(fēng)雨一年秋,一壺相思一盞愁。 那一年,我們相識在風(fēng)光正好的年紀,我們是既是同窗也是戀人。如今我們同在一方卻不...
    阿_卟閱讀 271評論 0 0

友情鏈接更多精彩內(nèi)容