屏幕適配 — 更深刻的理解Android屏幕碎片化

如需轉(zhuǎn)載請評論或簡信,并注明出處,未經(jīng)允許不得轉(zhuǎn)載

項目背景

公司有一個基于Android的平板產(chǎn)品翅睛,在醫(yī)院中使用灿巧。也就是說軟件和硬件(平板)都是我們提供給醫(yī)院的,但是我們是個軟件公司袍辞,所以平板是我們從設備制造商采購來的。一開始的計劃是我們只需要采購同一個型號的設備(設備A),所以這個項目幾乎不用考慮屏幕適配的問題袭异。但是最近可能公司和設備商沒有完全談攏,我們又換了一批新的設備(設備B)炬藤。設備B從屏幕大小上來看扁远,是和設備A是一模一樣的,但是卻出現(xiàn)了和設備A差距較大的顯示效果

問題分析

先通過日志打印一下兩個設備的屏幕相關(guān)信息

DisplayMetrics dm = getResources().getDisplayMetrics();
AiLog.d(TAG, "widthPixels: "+dm.widthPixels);
AiLog.d(TAG, "heightPixels: "+dm.heightPixels);
AiLog.d(TAG, "densityDpi: "+dm.densityDpi);
AiLog.d(TAG, "density: "+dm.density);

設備A輸出結(jié)果:

widthPixels: 1280

heightPixels: 737

densityDpi: 210

density: 1.3125

設備B輸出結(jié)果:

widthPixels: 1280

heightPixels: 800

densityDpi: 160

density: 1.0

這里主要三個不同刻像,分別是heightPixels畅买、densityDpidensity细睡,我們一個個來分析

問題一:heightPixels不同

一開始我是有點困惑的谷羞,這個737是什么鬼,兩個屏幕明明是一樣大的溜徙,為什么一個高800湃缎,一個高737?

其實蠢壹,heightPixels代表的是屏幕有效的高度嗓违,就是
heightPixels = 玻璃屏幕垂直方向上的像素點個數(shù)-導航欄高度所占像素點個數(shù)
https://www.cnblogs.com/ldq2016/p/6671819.html

所以,其實就是一個設備帶導航欄图贸,而另一個不帶蹂季,雖然我在應用中隱藏了導航欄冕广,但是這個高度不管你有沒有隱藏導航欄,這個值都不會改變偿洁。

綜合上述撒汉,這兩臺設備的分辨率,其實都是1280像素x800像素涕滋。所以heightPixels不同睬辐,實際上對我們屏幕適配并沒有什么影響

問題二:densityDpi不同

densityDpi就是我們常說的DPI,查閱了計算公式是下面這樣的
densityDpi = 屏幕對角線的像素值(像素)/對角線的尺寸(英寸)
但是宾肺,densityDpi和屏幕分辨率其實是可以通過adb命令改變的

adb shell wm size # 查詢
adb shell wm size 1080x1920 # 修改分辨率為1080x1920溯饵,可自定義成其他值,單位px
adb shell wm density # 查詢屏幕密度
adb shell wm density 480 # 修改屏幕密度為480
adb shell wm overscan 10,10,10,10 # 修改屏幕內(nèi)邊距
# 重置的話锨用,只需在后面加上reset丰刊,比如wm size reset!

那這個公式是不是感覺有點奇怪呢黔酥,兩個都是變量藻三,那對角線的尺寸豈不是也變了?但是顯然一個設備生產(chǎn)出來以后跪者,屏幕對角線尺寸肯定是固定的棵帽。

查閱了百度百科中對DPI的定義

DPI指每一英寸長度中,取樣渣玲、可顯示或輸出點的數(shù)目逗概。每英寸點數(shù)中的“點”,在屏幕上并不是不變的忘衍。他受到分辨率等因素的影響逾苫,所以并不是唯一對應屏幕上的像素點。有可能這個點是4個像素枚钓,也有可能是1個像素铅搓。這就是因為DPI的概念中牽扯到了顯示器上的變化。

所以搀捷,這里我是這么認為的(如果說的有問題歡迎指正)

我們一開始使用wm sizewm density查詢到的就是原始的屏幕分辨率和DPI星掰,但是之后我們使用adb命令修改后,實際上屏幕分辨率并沒有變化嫩舟,變化的是圖像分辨率氢烘,即一個圖像像素,其實是已經(jīng)補充了很多個屏幕像素家厌,從而表現(xiàn)出頁面上的元素大小發(fā)生了變化

  1. 屏幕分辨率:
    例如播玖,屏幕分辨率是1024×768,也就是說設備屏幕的水平方向上有1024個像素點饭于,垂直方向上有768個像素點蜀踏。
    像素的大小是沒有固定長度的维蒙,不同設備上一個單位像素色塊的大小是不一樣的。
    例如脓斩,尺寸面積大小相同的兩塊屏幕木西,分辨率大小可以是不一樣的畴栖,分辨率高的屏幕上面像素點(色塊)就多随静,所以屏幕內(nèi)可以展示的畫面就更細致,單個色塊面積更小吗讶。而分辨率低的屏幕上像素點(色塊)更少燎猛,單個像素面積更大,可以顯示的畫面就沒那么細致照皆。

  2. 圖像分辨率:
    例如重绷,一張圖片分辨率是500x200,也就是說這張圖片在屏幕上按1:1放大時膜毁,水平方向有500個像素點(色塊)昭卓,垂直方向有200個像素點(色塊)。
    在同一臺設備上瘟滨,圖片分辨率越高候醒,這張圖片1:1放大時,圖片面積越大杂瘸;圖片分辨率越低倒淫,這張圖片1:1縮放時,圖片面積越小败玉。(可以理解為圖片的像素點和屏幕的像素點是一個一個對應的)敌土。
    但是,在屏幕上把圖片超過100%放大時运翼,為什么圖片上像素色塊也變的越大返干,其實是設備通過算法對圖像進行了像素補足,我們把圖片放的很大后看到的一塊一塊的方格子血淌,雖然理解為一個圖像像素矩欠,但是其實是已經(jīng)補充了很多個屏幕像素;同理六剥,把圖片小于100%縮小時晚顷,也是通過算法將圖片像素進行減少。

問題三:density不同

density其實就是一個比例系數(shù)
density = densityDpi/160
所以兩個設備的density不同疗疟,歸根結(jié)底就是densityDpi不同

解決方案

經(jīng)過我們上面的分析该默,我們可以得出這樣的結(jié)果

兩個設備屏幕寬高尺寸相同,分辨率相同策彤,項目中使用dp作為單位栓袖,但是原始densityDpi不同匣摘,導致了兩個設備上UI元素顯示的大小(px)不同
px = dp*density
對于同樣尺寸的設備裹刮,我們當然希望兩端在UI元素的大小上顯示效果是一致的音榜,但是Android碎片化嚴重,即使同樣尺寸同樣分辨率的設備捧弃,也有可能出現(xiàn)DPI不同赠叼,這就是Android屏幕適配最大的問題

那我們?nèi)绾蝸斫鉀Q這個問題呢?

Google提供了資源目錄的限定符規(guī)則

//格式如下
values-sw480dp
values-sw640dp

sw的意思是smallestWidth违霞,即手機的最小寬度dp值嘴办。
其實更確切的說,是指手機寬度和高度的dp值中最小者
對于常規(guī)手機而言买鸽,肯定是寬度dp值較小涧郊。如果手機切換成橫屏了,那么就是高度dp值較小
但無論是橫屏還是豎屏狀態(tài)眼五,最小者的dp值是不變的妆艘。即無論橫豎屏狀態(tài),此手機都只會尋找對應寬度dp的values目錄下的相關(guān)文件(dimens.xml)來處理UI尺寸問題看幼,而避免了橫豎屏切換時UI變形問題

手機寬度dp值計算方法:

DisplayMetrics dm = getResources().getDisplayMetrics();
//手機寬度dp值 = 手機實際寬度像素px / 手機屏幕密度比
float sw = dm.widthPixels / dm.density;

//如果 高度 < 寬度
//float sw = dm.heightPixels / dm.density;

但需要注意一點批旺。如果你的手機寬度dp值為410.69∽莱裕或許你可以生成values-sw410.59dp這個目錄來做適配朱沃,我沒試過。個人建議你寫成values-sw410dp茅诱,而不是values-sw410.59dp或values-sw411dp逗物。因為系統(tǒng)會向下尋找等于或小于410.59的值的values目錄,直到默認的values目錄為止

這里我提供了一個自動生成sw文件工具類

import java.io.BufferedWriter;
import java.io.File;
import java.io.FileWriter;
import java.io.IOException;


class Sw {
    static int[] i = {1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24, 25, 26, 27, 28, 29, 30, 31, 32, 33, 34, 35, 36, 37, 38, 39, 40, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 58, 59, 60, 61, 62, 63, 64, 65, 66, 67, 68, 69, 70, 71, 72, 73, 74, 75, 76, 77, 78, 79, 80, 81, 82, 83, 84, 85, 86, 87, 88, 89, 90, 91, 92, 93, 94, 95, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105, 106, 107, 108, 109, 110, 111, 112, 113, 114, 115, 116, 117, 118, 119, 120, 121, 122, 123, 124, 125, 126, 127, 128, 129, 130, 131, 132, 133, 134, 135, 136, 137, 138, 139, 140, 141, 142, 143, 144, 145, 146, 147, 148, 149, 150, 151, 152, 153, 154, 155, 156, 157, 158, 159, 160, 161, 162, 163, 164, 165, 166, 167, 168, 169, 170, 171, 172, 173, 174, 175, 176, 177, 178, 179, 180, 181, 182, 183, 184, 185, 186, 187, 188, 189, 190, 191, 192, 193, 194, 195, 196, 197, 198, 199, 200, 201, 202, 203, 204, 205, 206, 207, 208, 209, 210, 211, 212, 213, 214, 215, 216, 217, 218, 219, 220, 221, 222, 223, 224, 225, 226, 227, 228, 229, 230, 231, 232, 233, 234, 235, 236, 237, 238, 239, 240, 241, 242, 243, 244, 245, 246, 247, 248, 249, 250, 251, 252, 253, 254, 255, 256, 257, 258, 259, 260, 261, 262, 263, 264, 265, 266, 267, 268, 269, 270, 271, 272, 273, 274, 275, 276, 277, 278, 279, 280, 281, 282, 283, 284, 285, 286, 287, 288, 289, 290, 291, 292, 293, 294, 295, 296, 297, 298, 299, 300, 301, 302, 303, 304, 305, 306, 307, 308, 309, 310, 311, 312, 313, 314, 315, 316, 317, 318, 319, 320, 321, 322, 323, 324, 325, 326, 327, 328, 329, 330, 331, 332, 333, 334, 335, 336, 337, 338, 339, 340, 341, 342, 343, 344, 345, 346, 347, 348, 349, 350, 351, 352, 353, 354, 355, 356, 357, 358, 359, 360, 361, 362, 363, 364, 365, 366, 367, 368, 369, 370, 371, 372, 373, 374, 375, 376, 377, 378, 379, 380, 381, 382, 383, 384, 385, 386, 387, 388, 389, 390, 391, 392, 393, 394, 395, 396, 397, 398, 399, 400, 401, 402, 403, 404, 405, 406, 407, 408, 409, 410, 411, 412, 413, 414, 415, 416, 417, 418, 419, 420, 421, 422, 423, 424, 425, 426, 427, 428, 429, 430, 431, 432, 433, 434, 435, 436, 437, 438, 439, 440, 441, 442, 443, 444, 445, 446, 447, 448, 449, 450, 451, 452, 453, 454, 455, 456, 457, 458, 459, 460, 461, 462, 463, 464, 465, 466, 467, 468, 469, 470, 471, 472, 473, 474, 475, 476, 477, 478, 479, 480, 481, 482, 483, 484, 485, 486, 487, 488, 489, 490, 491, 492, 493, 494, 495, 496, 497, 498, 499, 500};

    public static void main(String[] args) {

//      300,360,420,480,500,520,560,600,640,680,720,760,780,800,820,860,
//      900,960,1000,1080,1200,1400,1600,1920,2000

        int[] j = {609, 800}; //想要生成的sw目錄

        for (int m = 0; m < j.length; m++) {
            System.out.println(" \n適配大小" + j[m] + "\n");
            createFile(j[m]);
        }
    }

    private static void createFile(int n) {
        File file = new File("/Users/geekholt/Desktop/sw/values-sw" + n + "dp");
        if (!file.exists()) {//如果文件夾不存在
            file.mkdir();//創(chuàng)建文件夾
        }

        try {//異常處理

            BufferedWriter bw = new BufferedWriter(new FileWriter("/Users/geekholt/Desktop/sw/values-sw" + n + "dp" + "/dimens.xml"));
            bw.write("<resources>\n");

            for (int k = 0; k < i.length; k++) {
                System.out.println();
                bw.write("  <dimen name=\"DP" + i[k] + "\">" + Math.round(i[k] * (n / 609.0)) + "dp</dimen>\n");
            }
            bw.write("</resources>\n");
            bw.close();//一定要關(guān)閉文件
        } catch (IOException e) {
            e.printStackTrace();
        }

    }

}

由于一開始的UI設計是以設備A為基準的瑟俭,所以設備A(即values-sw609dp)中的dp值保持不變翎卓,設備B(即values-sw800dp)中的1dp = 1.3125dp,這樣兩個設備上的UI顯示就達到了一致的效果

還有別的辦法嗎摆寄?

經(jīng)過我們上面的分析失暴,應該有很多人會發(fā)現(xiàn),我們使用adb命令wm density 210的將設備B的densityDpi設置成設備A一致微饥,也能達到一樣的效果逗扒。但是這也只能在開發(fā)調(diào)試過程中這么做,我們不可能通過這種方法去修改廠家或者所有用戶手中的設備

通過本文的分析欠橘,你是否對android屏幕的碎片化有一個新的理解呢矩肩,并不是分辨率和屏幕大小完全相同的兩個設備,它們的頁面顯示效果就一定是一致的

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末肃续,一起剝皮案震驚了整個濱河市黍檩,隨后出現(xiàn)的幾起案子叉袍,更是在濱河造成了極大的恐慌,老刑警劉巖刽酱,帶你破解...
    沈念sama閱讀 206,126評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件喳逛,死亡現(xiàn)場離奇詭異,居然都是意外死亡棵里,警方通過查閱死者的電腦和手機润文,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,254評論 2 382
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來衍慎,“玉大人转唉,你說我怎么就攤上這事皮钠∥壤Γ” “怎么了?”我有些...
    開封第一講書人閱讀 152,445評論 0 341
  • 文/不壞的土叔 我叫張陵麦轰,是天一觀的道長乔夯。 經(jīng)常有香客問我,道長款侵,這世上最難降的妖魔是什么末荐? 我笑而不...
    開封第一講書人閱讀 55,185評論 1 278
  • 正文 為了忘掉前任,我火速辦了婚禮新锈,結(jié)果婚禮上甲脏,老公的妹妹穿的比我還像新娘。我一直安慰自己妹笆,他們只是感情好块请,可當我...
    茶點故事閱讀 64,178評論 5 371
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著拳缠,像睡著了一般墩新。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上窟坐,一...
    開封第一講書人閱讀 48,970評論 1 284
  • 那天海渊,我揣著相機與錄音,去河邊找鬼哲鸳。 笑死臣疑,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的徙菠。 我是一名探鬼主播讯沈,決...
    沈念sama閱讀 38,276評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼懒豹!你這毒婦竟也來了芙盘?” 一聲冷哼從身側(cè)響起驯用,我...
    開封第一講書人閱讀 36,927評論 0 259
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎儒老,沒想到半個月后蝴乔,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 43,400評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡驮樊,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 35,883評論 2 323
  • 正文 我和宋清朗相戀三年薇正,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片囚衔。...
    茶點故事閱讀 37,997評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡挖腰,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出练湿,到底是詐尸還是另有隱情猴仑,我是刑警寧澤,帶...
    沈念sama閱讀 33,646評論 4 322
  • 正文 年R本政府宣布肥哎,位于F島的核電站辽俗,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏篡诽。R本人自食惡果不足惜崖飘,卻給世界環(huán)境...
    茶點故事閱讀 39,213評論 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望杈女。 院中可真熱鬧朱浴,春花似錦、人聲如沸达椰。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,204評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽砰碴。三九已至躏筏,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間呈枉,已是汗流浹背趁尼。 一陣腳步聲響...
    開封第一講書人閱讀 31,423評論 1 260
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留猖辫,地道東北人酥泞。 一個月前我還...
    沈念sama閱讀 45,423評論 2 352
  • 正文 我出身青樓,卻偏偏與公主長得像啃憎,于是被迫代替她去往敵國和親芝囤。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 42,722評論 2 345