原文地址: juejin.im/post/5da3de…git
如下是 騷年你的屏幕適配方式該升級了! 系列文章,歡迎轉發以及分享:github
掃描或點擊如下二維碼,加入技術交流 QQ 羣 455850365框架
不少人以爲屏幕適配框架,就是應該按照設計圖尺寸,高和寬等比例拉伸頁面而且填充滿屏幕,百分百的還原設計圖的佈局效果。佈局
這難道不對嗎?post
像 AndroidAutoLayout 這種框架,能夠作到設備運行效果和設計圖如出一轍,纔是真正的百分比屏幕適配框架啊。學習
而像 今日頭條屏幕適配方案 和 SmallestWidth 屏幕適配方案 這種,只能以寬或者高中的一個做爲基準進行屏幕適配的方案,明顯是不科學,體驗極差的方案啊。設計
可是我能夠明確的告訴你們,上面的理解是很是片面的,AndroidAutoLayout 這樣的設計反而是錯誤的,至少在當下這個時代是錯誤的。3d
AndroidAutoLayout 這樣的設計只能適配舊時代的設備,但不能適配新時代的適配,那爲何會這樣呢?cdn
由於 AndroidAutoLayout 默認全部設備的高寬比都和設計圖的高寬比一致,因此 AndroidAutoLayout 能夠放心大膽的將頁面的高和寬同時進行等比例拉伸以填滿整個屏幕。blog
可是在這個全面屏手機普及的時代,怎麼可能只有 16 :9 這一種高寬比的屏幕?因而 AndroidAutoLayout 開始水土不服了。
只要手機屏幕的高寬比不是 16 :9,AndroidAutoLayout 的屏幕適配就會出現問題,致使 View 嚴重變形。
AndroidAutoLayout 在任何屏幕上,頁面的高和寬均可以完美填充屏幕,但只要設備的屏幕高寬比和設計圖的高寬比不一致(設計圖的高寬比通常爲 16 :9), View 就會嚴重變形,看下圖,在 18 : 9 的設備上,正方形的 View 已經變成了長方形。
也就是說 AndroidAutoLayout 在任何尺寸的屏幕上,讓頁面的高和寬均可以完美填充屏幕的代價,就是讓 View 在屏幕高寬比和設計圖高寬比不一致的設備上嚴重變形。
就是這個代價咱們也能理解,一個正方形的設計圖除了犧牲等比例的代價,又如何能填充滿一個長方形的屏幕呢。
但像 今日頭條屏幕適配方案 和 SmallestWidth 屏幕適配方案 這種,以寬或者高中的一個做爲基準進行屏幕適配的方案,就是完美的屏幕適配方案嗎?
也不是。
這種方案雖然能夠解決 View 在不一樣高寬比的屏幕上變形的問題,可是卻會致使當以寬爲基準時,頁面的高會超出,或低於屏幕高度,當以高爲基準時,頁面的寬會超出,或窄於屏幕寬度。
看下圖,在 18 : 9 的設備上,正方形 View 雖然沒有變形,可是頁面卻和屏幕底部間隔了 240 px。
可是如今大部分頁面都會使用到 RecyclerView 來展現內容,因此只用保證高或寬中的一個徹底和設計圖一致便可,所以這個問題也就被弱化了。
目前沒有一個屏幕適配方案能夠完美的解決全部問題,AndroidAutoLayout、今日頭條屏幕適配方案 和 SmallestWidth 屏幕適配方案,都有各自的問題,可是 AndroidAutoLayout 的問題明顯要比 今日頭條屏幕適配方案 和 SmallestWidth 屏幕適配方案 影響更大,不能等比例拉伸,有如何稱爲百分比屏幕適配方案呢,因此這是我建議使用後者的緣由。
客觀來講百分比屏幕適配方案,並非適配效果最完美的解決方案,它只是幫助你用最低的成本去完成屏幕適配,在適配成本和適配效果中不斷權衡,取捨出一個折中的方案,纔是百分比屏幕適配方案最核心的理念,若是你極度追求 APP 在每一個設備上的適配效果,那就得花費更大的精力,自行去對每一個設備作更精細化的屏幕適配。
之後不要再問我,使用 AndroidAutoSize 後,頁面爲何和屏幕有間隔,和設計圖的效果不一致了,這個問題已經把我問傷了,此次我經過畫圖的方式,大家應該更能理解。
掃碼關注個人公衆號 JessYan,一塊兒學習進步,若是框架有更新,我也會在公衆號上第一時間通知你們
如下是 騷年你的屏幕適配方式該升級了! 系列文章,歡迎轉發以及分享:
Hello 我叫 JessYan,若是您喜歡個人文章,能夠在如下平臺關注我
-- The end