自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

點九:避免Andriod平臺圖片失真的圖片形式

移動開發(fā) Android
“點九”是andriod平臺的應(yīng)用軟件開發(fā)里的一種特殊的圖片形式,文件擴(kuò)展名為:.9.png。在android平臺下使用點九PNG技術(shù),可以將圖片橫向和縱向同時進(jìn)行拉伸,以實現(xiàn)在多分辨率下的完美顯示效果。

  “點九”是andriod平臺的應(yīng)用軟件開發(fā)里的一種特殊的圖片形式,文件擴(kuò)展名為:.9.png

  智能手機(jī)中有自動橫屏的功能,同一幅界面會在隨著手機(jī)(或平板電腦)中的方向傳感器的參數(shù)不同而改變顯示的方向,在界面改變方向后,界面上的圖形會因為長寬的變化而產(chǎn)生拉伸,造成圖形的失真變形。

  我們都知道android平臺有多種不同的分辨率,很多控件的切圖文件在被放大拉伸后,邊角會模糊失真。

  OK,在android平臺下使用點九PNG技術(shù),可以將圖片橫向和縱向同時進(jìn)行拉伸,以實現(xiàn)在多分辨率下的***顯示效果。

  【普通拉伸和點九拉伸效果對比】

  

 

  對比很明顯,使用點九后,仍能保留圖像的漸變質(zhì)感,和圓角的精細(xì)度。

  從中我們也可以理解為什么叫“點九PNG”,其實相當(dāng)于把一張png圖分成了9個部分(九宮格),分別為4個角,4條邊,以及一個中間區(qū)域,4個角是不做拉升的,所以還能一直保持圓角的清晰狀態(tài),而2條水 平邊和垂直邊分別只做水平和垂直拉伸,所以不會出現(xiàn)邊會被拉粗的情況,只有中間用黑線指定的區(qū)域做拉伸。結(jié)果是圖片不會走樣

  二.“點九”的制作方法

  方法1:使用 “draw9patch”工具繪制,流程如下

  

 

  1. 安裝工具

  首先你需要給自己的電腦安裝上java于系統(tǒng)的默認(rèn)目錄下。沒有安裝java的同學(xué)可以在百度搜索:jdk-6u20-windows-i586,安裝包大小80M左右。

  然后使用andriod模擬器—android-sdk-windows,打開SDK/tools目錄下的“draw9patch.bat”文件,出現(xiàn)載入窗口:

  

 

 

 

  2.導(dǎo)入并編輯

  將png圖片拖拽到該窗口中

  如下圖,自動進(jìn)入編輯界面。圖中介紹了每個區(qū)域的內(nèi)容及功能注釋。

  

 

  預(yù)覽右側(cè)的視圖發(fā)現(xiàn),圖片的邊緣處于普通拉伸狀態(tài)。

  現(xiàn)在我們在圖片邊緣點擊左鍵,繪制出黑線,即圖片需要被拉伸的部分。如下圖,對4條黑線做了注釋。

  

 

  如果失誤多繪的部分,可按住shift鍵的同時點擊鼠標(biāo)左鍵擦除)。

  如圖所見,三種拉伸結(jié)果均已***顯示,已實現(xiàn)我們想要的拉伸效果,假設(shè)這是一個有顯示文字的窗體,那么文字顯示的區(qū)域,程序也會控制在黑線對應(yīng)范圍。

  

 

  以下這些圖片,包括異性(非規(guī)則圖形)圖片,也可以通過點九PNG實現(xiàn)橫縱向的自然拉伸。

  

 

  

 

 

#p#

 

  【draw9patch.bat其他功能說明】

 ?、?nbsp;Show lock:顯示不可繪區(qū)域

 ?、?nbsp;Show patches:預(yù)覽這個繪圖區(qū)中的可延伸宮格(粉紅色代表一個可延伸區(qū)域)

 ?、?nbsp;Show patches:預(yù)覽視圖中的高亮區(qū)域(紫色區(qū)域)

 ?、?nbsp;Show bad patches:在宮格區(qū)域四周增加一個紅色邊界,這可能會在圖像被延伸時產(chǎn)生人工痕跡。如果你消除所有的壞宮格,延伸視圖的視覺一致性將得到維護(hù)。

  3.保存和輸出

  點擊左上file- save,保存文件,自動生成一張后綴名為“*.9.png”格式的圖片,圖片上下左右各增加了1px的黑線。

  方法2:直接使用 PS等平面工具繪制,流程圖如下

  

 

  如流程圖所示,相對與方法1,只需2個步驟就可得到.9.png圖片,具體步驟為:

  1. 確定切圖后直接改變圖片的畫布大小,

  2. 手動將上下左右各增加1px

  3. 使用鉛筆工具,手動繪制拉伸區(qū)域,色值必須為黑色(#000000)。

  4. 存儲為web所用格式,選擇png-24,儲存時手動將后綴名改為.9.png

  不過這種方法的缺點是不能實時預(yù)覽,判斷并測試?yán)靺^(qū)域的準(zhǔn)確性。

  使用此方法需要注意以下2點:

  1. 手繪的黑線拉伸區(qū)必須是#000000,透明度100%,并且圖像四邊不能出現(xiàn)半透明像素;

  2. 你的.9.png必須繪有拉伸區(qū)域的黑線;

  否則,圖片不會通過android系統(tǒng)編譯,導(dǎo)致程序報錯。還有,有同學(xué)疑惑解壓縮apk文件后,.9.png圖片里的黑線怎么沒了?

  那是因為andriod程序在把文件打包成apk的時候,程序會自動把*.9.png圖片邊緣的黑線去掉,所以解壓縮apk后看到的.9.png文件是沒有黑線的。

  三.使用“點九”的意義

  關(guān)于下圖,經(jīng)過測試發(fā)現(xiàn)使用普通png的顯示效果出現(xiàn)明顯的變色橫紋。而.9.png圖片的顯示效果明顯優(yōu)于普通png。

  

 

  使用.9.png格式后,橫紋問題基本已解決。因為對于.9.png圖片,android系統(tǒng)程序有對其優(yōu)化的算法。

  由于android手機(jī)屏幕的材質(zhì)質(zhì)量差距大。很多屏幕不支持16位以上的顏色顯示。

  所以渲染后結(jié)果出現(xiàn)丟失顏色,故造成橫紋顯示。

  經(jīng)與多款android手機(jī)對比后發(fā)現(xiàn),屏幕越次的手機(jī)橫紋越明顯。

  而使用了*.9.png圖片技術(shù)后,只需要采用一套界面切圖去適配不同的分辨率,而且大幅減少安裝包的大小。而且這樣程序不需要專門做處理的就可以實現(xiàn)其拉伸,也減少了代碼量和開發(fā)工作量。

  相信每個人android平臺的切圖工作,會有不同的技巧和心得,非常歡迎大家能在評論中留下自己的個人經(jīng)驗及心得。相互交流會讓我們的工作模式更靈活,更高效,同時帶給大家更多優(yōu)質(zhì)的移動端應(yīng)用:)

 

責(zé)任編輯:佚名 來源: 百度MUX
相關(guān)推薦

2010-08-27 13:19:46

2010-06-10 14:28:13

UML建模誤區(qū)

2022-04-19 10:29:56

外包誤區(qū)IT外包IT領(lǐng)導(dǎo)者

2020-04-10 20:32:44

網(wǎng)絡(luò)安全黑客隱私

2024-07-09 08:27:52

2009-12-11 09:52:39

Chrome圖片搜索

2011-08-08 18:26:52

UIWebView圖片

2020-08-21 09:58:16

谷歌Android工具

2009-11-11 10:14:15

ADO.NET學(xué)習(xí)

2013-08-13 13:56:06

Android軟引用

2021-02-19 07:59:21

數(shù)據(jù)埋點數(shù)據(jù)分析大數(shù)據(jù)

2015-09-22 10:49:40

Android滑動漸變

2010-09-07 16:11:55

CSS Sprites

2009-04-01 17:24:14

多核四核服務(wù)器

2010-03-30 14:06:35

2010-03-02 10:26:32

Android系統(tǒng)平臺

2012-02-17 10:00:15

圖片存儲圖片服務(wù)器架構(gòu)

2012-04-05 16:20:53

圖片分享拍照應(yīng)用

2021-10-27 10:03:16

風(fēng)險管理企業(yè)ERM

2023-06-25 14:55:28

編輯圖片鴻蒙
點贊
收藏

51CTO技術(shù)棧公眾號