android9png製作
① Android的.9圖製作
先來認識一下界面,並可以看到不管是橫縱向拉升都使得圖片失真
下面四個小選項分別是
從上圖我們可以看到,不對圖片進行任何修改,圖片在某一方向拉伸時都是整體縮放的. 縮放同時,圖片圓角也會跟埋圓著縮放,導致最終展示效果很差.
在編輯區可以看到要編輯的圖片四周多了一像素的內容,這就是我們可以操作的區域了。
繪制小黑點 :只需要在四邊需要的位置左鍵單擊繪制小黑點,或者拖動繪制小黑線(其實是連續的多個小黑點)
刪除小黑點 :按shift鍵,並左鍵單擊或拖動進行刪除操作,也可以按住滑鼠右鍵進行擦除。
小黑點在png圖最外層有一像素寬的邊,除了四個頂角,小黑點可以繪制在png最外邊的任一點處,
每個小黑點占據一像素
小黑點繪制之後。其規定一個區域,即小黑點處,垂直於所在邊,且一像備液清素寬的區域
頂部:在水平拉伸的時候,保持其他位置不動,只在這個點代表區域做無限的延伸
左邊:在豎直拉伸的時候,保持其他位置不動,只在這個點代表區域做無限的延伸
底部:在水平拉伸的時候,指定圖片里的內容顯示的區域
右邊:在豎直拉伸的時候,指定圖片里的內容顯示的區域
從上圖可以看出拉伸後我們希望的箭頭區域沒有失真,並且而且箭頭距離右邊距與上邊距的距離沒有變因此,保證了想要部分不失真
首先沒有本質上的區別,下面通過一個例子來理解
假如有一個5px 5px大小的圖片,橫向上需要拉伸至20px
那麼就是要橫向拉升H=15px
假如橫向上畫了一個小黑點--則每個小黑點所代表區域拉伸h=15px h=H/1
假如橫向上畫了三個小黑點--則每個小黑點所代表區域拉伸h=5px h=H/3
因此 每條邊上的每個小黑點所代表區域拉伸的寬度是一樣的 *
所以要合理的布置我們的小喝仿前點以至png圖能夠達到我們想要的方向伸縮
點擊左上file- save,保存文件,自動生成一張後綴名為「*.9.png」格式的圖片,圖片上下左右各增加了1px的黑線。
9patch圖片是andriod app開發里一種特殊的圖片形式,文件的擴展名為:.9.png
「點九」也是由於Android平台多種解析度需適配的需求下,發展出來的一種獨特的技術。它可以將圖片橫向和縱向隨意進行拉伸,而保留像素精細度、漸變質感和圓角的原大小,實現多解析度下的完美顯示效果,同時減少不必要的圖片資源,可謂切圖利器。
.9.PNG確實是標準的PNG格式,只是在最外面一圈額外增加1px的邊框,這個1px的邊框就是用來定義圖片中可擴展的和靜態不變的區域。特別說明,left和top邊框中交叉部分是可拉伸部分,未選中部分是靜態區域部分。right和bottom邊框中交叉部分則是內容部分
無論是left和top,還是right和bottom都是把圖片分成9塊 (邊角四塊是不能縮放的,其他的四塊則是允許縮放的),所以叫做9.PNG。
.9.png圖片,android系統程序有對其優化的演算法。
參考
http://www.jianshu.com/p/3fd048644e3f
http://bbs.itheima.com/thread-251222-1-1.html
http://www.yimui.com/archives/117
② android中.9png怎麼用
9png圖片一般用在需要拉伸的地方,比如聊天程序的對話框,字數不同,對話框的大小也不同。
之所以叫9是因為圖片被分割為9個部分。
要在四周畫至少四條線(點),他們功能不一樣。
右邊和下邊:決定了中間content區域的大小,比如對話框中的文字區域的大小。
(注意黑色的線條,決定了content區域大小)
draw9patch操作
使用SDK自帶的draw9patch的時候,可以查看content area (Show content 打勾)和拉伸效果(Show patch打勾)。
③ 什麼是9png圖片 原理是什麼,9png工具又如何使用
9png圖片它是Android系統特有的一種圖片格式,文件擴展名為.9.PNG。
9png的原理:其實相當於把一張png圖分成了9個部分(九宮格),分別為4個角,4條邊,以及一個中間區域,4個角是不做拉升的,所以還能一直保持圓角的清晰狀態,而2條水平邊和垂直邊分別只做水平和垂直拉伸,所以不會出現邊緣。
如何操作:滑鼠左鍵選取需要拉伸的像素點;shift+滑鼠左鍵取消當前像素點。
從圖中可以看出,導入的png圖片默認周圍多了一像素點,也就是這一圈一像素點就是可操作區域。因為下方和右方可操作區域是指定內容的顯示區域,屬於可選區域,可不予理會;但是要注意內容區域的標記不能有間斷,否則.9.png圖片在放入項目下會報錯。
注意上方和左邊的黑色像素,是想讓此png圖像拉伸操作的時候,只是中間區域被拉伸。選擇上方中間區域是為了橫向拉伸的時候選取的拉伸像素點,左邊則是縱向拉伸像素點。
在Android的設計過程中,為了適配不同的手機解析度,圖片大多需要拉伸或者壓縮,這樣就出現了可以任意調整大小的一種圖片格式「.9.png」。
這種圖片是用於Android開發的一種特殊的圖片格式,它的好處在於可以用簡單的方式把一張圖片中哪些區域可以拉伸,哪些區域不可以拉伸設定好,同時可以把顯示內容區域的位置標示清楚。
④ Android-.9圖詳解
Android設備適配,圖片方面很重要的一部分就是.9圖的使用了,我們今天就來記錄一下。
.9.png圖片本質上還是png圖片,區別是.9.png圖比正常的png圖片在最外圍多了1px的邊框,這就允許我們在這個1px的邊框上定義圖片的可拉伸區域以及圖片的內容區域。這也就是說.9.png的製作實際上就是我們在這1px的邊框上按我們的需求,把對應位置設置為黑線,然後系統幫我們自動拉伸了。
正常圖片都有四個邊,.9圖的左上(左邊和上邊兩條邊)表示可以拉伸區域,其中上面黑線(或者點)表示橫向可拉伸的區域;左邊黑線(或者點)表示縱向可拉伸的區域.在圖片拉伸時只有黑線區域內的圖像會被拉伸,黑線兩邊的圖像保持原狀。
右下(右邊和下邊兩條邊)表示間隔區域,其中下邊表示橫向填放內容的區域;右邊表示縱向填放內容的區域,在圖片拉伸時,控制項內部的文字上下左右邊界只能放在黑線區域(有點類似垂直居中顯示)。
如果你還用eclipse開發,在你sdk中的tools文件夾找Draw9patch.bat文件,這是一個Windows 批處理文件,雙擊進入界面,拖入圖片開始製作.
如果是studio直接以.9.png為後綴,雙擊編輯進入圖片界面,選擇左下角的9-patch即可開始制,或者圖片右擊在列表選則Create 9-Patch file即可。
我們就以一個TextView為例,給其設置一個圖片背景,效果如下:
直接設置為背景:
.9圖各邊框含義
完畢!
⑤ .9.png圖片的含義及製作過程
開發中難免的會碰到背景圖片部分區域拉伸的需求,那麼.9.png圖片可以說是完美解決問題了。
首先看下什麼是.9.png圖片:
網路:.9.PNG是安卓開發裡面的一種特殊的圖片,這種格式的圖片通過ADT自帶的編輯工具生成,使用九宮格切分的方法,使圖片支持在android 環境下的自適應展示。
在eclipse版本中製作.9圖片是通過sdk中自帶的工具進行,在這里就不闡述了,下面講述在as中.9.png的製作過程,首先我們只需要一個普通的圖片然後放到mipmap/drawable目錄下,再點擊右鍵選擇該選項陪洞。
這樣的話,.9圖片的初步就製作完成,接下來。
我們可以看到總共有四個邊,分別含義是:
頂部:在水平拉伸的時候,保持其他位置不動,只在這個點的區域做無限的延伸(拷貝)
左邊:在豎直拉伸的時候,保持其他位置不動,只在這個點的區域做無限的延伸(拷貝)
底橡亂空部:在水平拉伸梁瞎的時候,指定圖片里的內容顯示的區域
右邊:在豎直拉伸的時候,指定圖片里的內容顯示的區域
如圖所示,左邊和頂部就是我需要這張.9圖片需要拉伸的地方了,而右邊和底部就是我需要這個圖片的內容所在的區域。
那麼,謝謝大家觀看!
⑥ Android設計中的.9.png圖片
在Android的UI設計開發中,很多控制項需要適配不同的手機解析度進行拉伸或者壓縮,這樣就出現了可以任意調整大小的一種圖片格式「.9.png」。這種圖片是用於Android開發的一種特殊的圖片格式,它可以指定特定的區域進行拉伸而不失真,同時可以指定前景內容的顯示區域。即.9.png圖片的用處可以概括為以下兩點:
通過上面的對比,我們可以發現,.9.png圖片周圍會有一條黑色的線條,這些黑色線條有什麼作用呢?就是用於指定我們背景的拉伸區域或者前景內容的顯示區域。
通過上面的的介紹,我們知道.9.png的四條邊上的黑線有哪些用途,那麼我們將介紹下關於拉伸區域的界定。
這么強大的一種圖片,在我們android開發中的適配環節,灶基起了很大的作用。那麼怎麼製作這種.9.png圖片呢?在Android的工具中給我們提供了draw9patch.bat工具來製作.9文件。該工具目錄在 android-sdk-windows oolsdraw9patch.bat 。
我們直接打開draw9path.bat二進製程序,將我們需要製作的圖片導入進去。然後按住滑鼠左鍵進行劃黑邊,如果畫錯了,通過Shift+滑鼠左鍵進行拖動取消。
首先,我們通過簡單的布局文件看看普通圖片的展示效果。
在上面的效果圖沒有進行自適應,兩邊的邊框已經被文字嵌入進去,所以我們要對圖片作如下修改:
在我們的處理中,通過對圖片添加縱橫向的拉伸,來保持背景的自適應。這里需要我們注意指定的拉伸區域,需要我們仔細體會。
在上面我們對橫向拉伸區域有了一定認識。下面看看內容拉伸區域:
在上面的.9圖中,我們將整個右邊線作為內容縱向顯示的區域,看看效果圖:
我們可以看到,內容的顯示是緊緊填滿上下之間。沒有間隙。
在來看看效果圖:
通過上面對比,我們可以發現右側變現控制著局帶內容視圖的顯示區域的規律。
同樣底部也是一隱臘謹樣,在開發的過程中,合理的使用.9.png文件可以很好的優化我們的資源文件,減小apk的包大小。也能進行很好的適配效果。
⑦ 如何用手機製作png圖片
我們都知道手機可以對圖片做一些簡單的處理,但是比較復雜一點的就需要專業的圖片處理軟體來進行處理了,手機拍出來的圖片一般都是JPG格式的,要轉換成PNG格式塌悶,那麼,手機要怎麼完成製作png圖片呢?
首先,打開手機,找到文件管理並點擊進入手機存儲,選擇相機文件夾進入,滑動手機屏幕找到需要更改為PNG格式的圖片,選中圖片後按住不動;
然後會彈出新的頁面,有「復制」、「剪切鉛凳」、「刪除」、「更多」四個選項,選擇「更多」選項,可以對圖片進行分享、壓縮、重命名、更改後綴名;
選擇更改後綴名,即可對圖片的格式進行修改,將JPG改為PNG,再點擊確定;
我們就可以看到圖片已經是PNG格式了。
當看到需要製作png圖片時,可能很多人第一時間想團激彎到的就是利用各種圖片處理軟體來進行處理,卻不知道其實手機上就有可以處理的方法,簡單又方便。
⑧ Android Studio製作 .9.png
注意:一般會把圖片的寬高減去2個像素(例如 750x1334 的 png圖的大小設置為748x1332)
因為生成.9.png的時候會加上2個像素
直接生成.9.png圖片
保存之後能看到.9.png圖片了
可以看到 右邊預覽的區域發生了變形
一般啟動圖都是中間部分保留 四邊拉伸
四個邊操作之後的結果是這樣的
這就是四個邊的拉伸區域 中間部分不會被拉伸 (可以看右邊的預覽效果圖)