在實際項目中經(jīng)常會遇到在某些手機上特別是大屏幕手機上出現(xiàn)毛邊,邊界看起來模糊不清的情況。這是因為界面上的圖形會因為長寬的變化而產(chǎn)生拉伸,造成圖形的失真變形懒震。
這種情況下,我們可以UI設計師多切出幾套分辨率的圖偶來適配嗤详,但是這樣會導致apk體積增加个扰,有沒有一張圖就能解決的好辦法呢,android平臺下的點9PNG就應運而生了葱色。點9圖可以將圖片橫向和縱向同時進行拉伸递宅,以實現(xiàn)在多分辨率下的完美顯示效果。
首先看一下普通圖片和點9圖片的區(qū)別
布局文件如下
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" ">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="普通圖"/>
<ImageView
android:layout_width="200dp"
android:layout_height="0dp"
android:layout_weight="1"
android:background="@drawable/ic_launcher"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="點9圖"/>
<ImageView
android:layout_width="200dp"
android:layout_height="0dp"
android:layout_weight="1"
android:background="@drawable/ic_launcher_nine_pic"/>
</LinearLayout>
實際顯示效果圖
圖中可以看出經(jīng)過我處理的圖片苍狰,邊角變得不模糊了办龄,雖然不是那么很好看,但這里只是做個例子來說明其作用淋昭。
下面來講講在android studio中怎么去根據(jù)自己實際需求去畫這個點9圖
先找到圖片右鍵
然后修改圖片名稱俐填,選擇目錄,注意必須要放在drawable目錄里面翔忽,不然引用studio會報錯
然后進入點9圖編輯界面
最后講解怎么編輯點9圖
只需要在圖片邊緣鼠標單擊即可英融,一般我們只需要設置左邊和上邊來調節(jié)拉伸區(qū)域盏檐。
變成黑色表示拉伸的坐標點。圖中粉紅色的交叉點原本是白色驶悟,故而拉伸的區(qū)域都在白色點區(qū)域胡野。
所以當拉伸時大家就看到了谷歌機器人的外部四個綠色邊角區(qū)域沒有了毛邊,實際就是保持其不被拉伸而形成的結果撩银。
L1與T1交叉區(qū)域给涕,L2與T2交叉區(qū)域,表圖片在拉伸的時候只會拉伸所以示只拉伸該區(qū)域额获。
至于右邊下邊 要是邊框是透明色區(qū)域則表示這塊區(qū)域占據(jù)空間不被別的內容遮擋够庙,
黑色區(qū)域表示可以顯示別的內容的區(qū)域,比如一個textview放這張圖片做背景抄邀,如果下面左邊一半設置透明色耘眨,右邊一半設置黑色,那么最后文字只會在黑色區(qū)域境肾。
如下圖
以上就是點9圖的部分介紹剔难。