❶ 用android Studio製作點9圖
選擇需要製作點9圖的文件。直接右鍵
點擊確定 會在列表顯示一張該圖片的點9圖。打開
打開點9圖進行編輯
左側是原圖,也就是編輯區。右側是預覽區。預覽區分三個部分。一個是橫向拉伸,一個是縱向拉伸,一個是橫縱都拉伸。
編輯區下方有個zoom。直接拉到800%。然後就可以直接在你需要拉伸的地方,直接單擊,就可以選擇拉伸區域了。
設置完拉伸區域後,可以在預覽區實時看到拉伸效果
❷ 在Android Studio中畫點9圖
在實際項目中經常會遇到在某些手機上特別是大屏幕手機上出現毛邊,邊界看起來模糊不清的情況。這是因為界面上的圖形會因為長寬的變化而產生拉伸,造成圖形的失真變形。
這種情況下,我們可以UI設計師多切出幾套解析度的圖偶來適配,但是這樣會導致apk體積增加,有沒有一張圖就能解決的好辦法呢,android平台下的點9PNG就應運而生了。點9圖可以將圖片橫向和縱向同時進行拉伸,以實現在多解析度下的完美顯示效果。
首先看一下普通圖片和點9圖片的區別
布局文件如下
實際顯示效果圖
圖中可以看出經過我處理的圖片,邊角變得不模糊了,雖然不是那麼很好看,但這里只是做個例子來說明其作用。
下面來講講在android studio中怎麼去根據自己實際需求去畫這個點9圖
先找到圖片右鍵
然後修改圖片名稱,選擇目錄,注意必須要放在drawable目錄裡面,不然引用studio會報錯
然後進入點9圖編輯界面
最後講解怎麼編輯點9圖
只需要在圖片邊緣滑鼠單擊即可,一般我們只需要設置左邊和上邊來調節拉伸區域。
變成黑色表示拉伸的坐標點。圖中粉紅色的交叉點原本是白色,故而拉伸的區域都在白色點區域。
所以當拉伸時大家就看到了谷歌機器人的外部四個綠色邊角區域沒有了毛邊,實際就是保持其不被拉伸而形成的結果。
L1與T1交叉區域,L2與T2交叉區域,表圖片在拉伸的時候只會拉伸所以示只拉伸該區域。
至於右邊下邊 要是邊框是透明色區域則表示這塊區域占據空間不被別的內容遮擋,
黑色區域表示可以顯示別的內容的區域,比如一個textview放這張圖片做背景,如果下面左邊一半設置透明色,右邊一半設置黑色,那麼最後文字只會在黑色區域。
如下圖
以上就是點9圖的部分介紹。