安卓UI圖px标注适配攻略：批量轉化px為dp

一款優秀app的産生，往往需要有一套精美華麗的UI設計圖，誠然，UI僅僅隻是個開始，有追求極緻的前端工程師開發軟體時盡可能地去貼近UI的設計才是重中之重。

我們知道，Android的尺寸機關一般采用dp或者sp，然而有時候我們遇到的UI設計圖給的尺寸标注卻是px的，這顯然是給iOS畫的UI。安卓裝置的多樣性決定了我們絕對不能将控件的尺寸大小直接設定為UI圖上的px值。那該如何解決呢？憤憤不平地去找UI工程師出一套安卓的标注？條件允許的話你當然可以這樣幹，但其實我們還有另外一種快準不知道狠不狠的解決方案：px轉dp。

比較關注原理的童鞋會知道，px轉dp的公式：dp = px/density

density是裝置密度，有了裝置密度，我們才可以将px轉為dp。

這時候你可能會想，Android系統不是提供了api供我們轉換嗎，或者Android系統擷取裝置密度：context.getResources().getDisplayMetrics().density，然後将UI圖的px去除以desity？

非也。density值是擷取了，但是請問UI圖上的px值是按照你的手機來标注的嗎？如果UI圖是以iPhone6手機（4.7寸螢幕，分辨率1334*750）為基準進行設計的，那麼你用這個px值去除以你自己安卓手機的裝置密度，怎麼可能對。也就是說，我們要擷取UI圖的裝置密度（density）。

裝置密度公式：density = PPI/160。

PPI是像素密度，公式：PPI = √（長度像素數² + 寬度像素數²） / 螢幕尺寸

不要暈，多看幾遍，多思考，你就會明白這幾個公式間的轉換關系。PPI的公式不難了解，就是指每英寸螢幕有多少個像素點。比如iPhone6的PPI是326,1英寸螢幕有326個像素點。至于裝置密度這個公式，PPI除以160，為什麼是160而不是别的，這個不用太過于糾結。160是谷歌推薦的數值，這樣轉換為hdpi、xhdpi等的數值就比較妥當。

當你已經不糾結160的時候，我來帶你一步步實作尺寸适配方案：

1. 擷取分辨率。拿到UI圖檔檔案，滑鼠右鍵屬性，點選詳細資訊頁籤，即可獲知圖檔的分辨率。（分辨率是多少也可以問UI工程師……）
2. 擷取螢幕尺寸。問UI工程師，問ta是以哪個尺寸為基準進行畫圖的。也有個神器叫PxCook能識别出UI圖的裝置型号基準，然後通過裝置型号搜尋出該裝置是幾寸屏。。如果UI去火星了并且PxCook也江郎才盡了，那就此打住吧。
3. 運作代碼，批量轉化px為dp。将你得到的尺寸分辨率，代入相應的變量，運作下面的代碼：

int width =;//螢幕寬度
int height =;//螢幕高度
float screenInch =f;//螢幕尺寸
//裝置密度公式
float density = (float) Math.sqrt(width * width + height * height) / screenInch /;

StringBuilder stringBuilder = new StringBuilder();
stringBuilder.append("<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<resources>\n");
for (int px =; px <=; px +=) {
    //像素值除以density
    String dp = px *f / density + "";
    //拼接成資源檔案的内容，友善引用
    if (dp.indexOf(".") + < dp.length()) {//保留3位小數
        dp = dp.substring, dp.indexOf(".") +);
    }
    stringBuilder.append("<dimen name=\"px").append(px + "").append("dp\">").append(dp).append("dp</dimen>\n");
}
stringBuilder.append("</resources>");
System.out.println(stringBuilder.toString());
           

運作結果：

<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="px0dp">0.0dp</dimen>
<dimen name="px2dp">0.982dp</dimen>
<dimen name="px4dp">1.965dp</dimen>
<dimen name="px6dp">2.948dp</dimen>
<dimen name="px8dp">3.931dp</dimen>
<dimen name="px10dp">4.913dp</dimen>
<dimen name="px12dp">5.896dp</dimen>
……
           

你也可以将拼接後的字元串，輸出到檔案流。

4. 在你的安卓項目中，values檔案夾，建立名為dimens_px.xml檔案，将控制台輸出的内容全選複制粘貼到xml裡。

5. 引用dimens尺寸檔案值。如下面的使用demo：

<ImageView
    android:layout_width="@dimen/px100dp"
    android:layout_height="@dimen/px100dp" />
           

TextView要用sp怎麼辦？同理，步驟3的拼接代碼将append(dp)改為append(sp)，然後在安卓項目中建立多一個sp值的dimens資源檔案咯。

^_^
           

——END——