日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時間:8:30-17:00
你可能遇到了下面的問題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
一大波Android劉海屏來襲,全網(wǎng)全面適配技巧!

 一、序

Hi,大家好,我是承香墨影!

Apple 一直在***設(shè)計的潮流,自從 iPhone X 發(fā)布之后,"劉海屏" 就一直存在爭議。不過不管你怎樣,Android 也要躋入 "劉海屏" 的行列,尤其是 Android P 發(fā)布之后,也從系統(tǒng)級支持頂部凹槽屏幕設(shè)計。

很多廠商也在逐漸推出 “劉海屏” 設(shè)計的手機,在國內(nèi)比較常見的就是 OPPO x21 和 華為 P20。

屏幕不一樣了,迎來的就是一些適配上的問題。今天就來聊聊,Android 的 “劉海屏”,以及我們?nèi)绾稳ミm配它。

二、劉海屏的背景介紹

2.1 背景介紹

劉海屏的外觀,我想大家應(yīng)該都有概念,不過不同廠商劉海屏的實現(xiàn)方式也有所不太,這一點需要先有個概念。

就現(xiàn)在市場上的情況來說,會區(qū)分成兩類,一類是標準的 Android P Api,另外一類就是廠商在 Android P 以下的系統(tǒng),做的特殊適配。

例如:華為 P20 就是采用的 Android P 標準 Api 的方式,而 OPPO x21 就不一樣了,它有自己的適配 Api。

2.2 那些需要單獨適配

就算是增加了劉海屏,你也可以發(fā)現(xiàn),大部分都是“切割”的狀態(tài)欄的區(qū)域,所以就面臨了三種情況。

  1. 有狀態(tài)欄的頁面,不會收到劉海屏的影響。
  2. 全屏未適配劉海屏的頁面,系統(tǒng)會對劉海屏區(qū)域進行切割,讓整體 UI 頁面做下移處理,避開劉海屏的顯示。
  3. 全屏已適配劉海屏的頁面,可以兼容劉海屏,做到真正的全屏顯示。

后面會單獨講解這幾種方式的區(qū)別。

2.3 搶先體驗 Android P

在手邊沒有對應(yīng)系統(tǒng)的設(shè)備的時候,模擬器是一條不錯的路,最近 Google 也發(fā)布了 Android P 的模擬器,還有一個辦法就是找一些支持真機云測的平臺,租用一臺需要的遠程設(shè)備,也是一個解決方案。

我這里選擇 Android P 的模擬器,有需要自己更新 SDK ,無腦下載更新就好。

劉海的凹槽區(qū)域,大部分是為了給攝像頭或者其他傳感器留出區(qū)域。而在沒有劉海的設(shè)備或者模擬器上,可以通過開發(fā)者選項里的 “Simulate a display with a cutout”,開啟劉海屏的支持。

如果你把所有的模式都試過一遍,你會發(fā)現(xiàn),其實劉海屏的劉海,在 Android P 上,是有多種樣式的,并非統(tǒng)一的。

2.4 劉海屏的適配

2.2 也講清楚了,劉海屏的切割區(qū)域,都存在于狀態(tài)欄上,所以在有狀態(tài)欄的頁面上,是無需我們特殊處理的,系統(tǒng)會幫我們處理好。

而對于全屏的頁面,就需要單獨的處理了。我這里,簡單做了一個全屏頁面,每個橫條都是等寬的這樣能看到布局上的差異。

從左至右分別是:關(guān)閉劉海屏、開啟劉海屏但不支持、適配劉海屏。

一個全屏的頁面,當沒有支持劉海屏又碰到了劉海屏,會導(dǎo)致 UI 下沉,如果這不是一個列表的布局,底部的控件就會被遮擋。

例如下面這樣的情況:

圖片來自:華為適配指南

還有一些被劉海遮擋區(qū)域的效果,其實主要是依賴 UI 設(shè)計師來規(guī)避了,不要在可能出現(xiàn)劉海切割的地方,設(shè)計可操作的區(qū)域,影響用戶操作。

三、技術(shù)適配劉海屏

說那么多,最終我們還是需要用技術(shù)的方式來適配劉海屏。Android P 的劉海屏,是有標準的 Api 來進行適配,而對于一些廠商自己的劉海屏設(shè)備,例如:OPPO x21,就需要遵循它的開發(fā)文檔進行單獨適配。

Android P 為***的劉海屏,提供了專門的 Api 來支持:DisplayCutout。

3.1 開啟劉海屏

我們在全屏的頁面,需要單獨開啟支持劉海屏。而 Google 提供的適配方案,可以設(shè)置是否在全屏模式下,使用劉海屏的區(qū)域。

 
 
 
 
  1. WindowManager.LayoutParams lp 
  2.                 =getWindow().getAttributes(); 
  3. lp.layoutInDisplayCutoutMode = 
  4.                 WindowManager.LayoutParams.LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS; 
  5. getWindow().setAttributes(lp); 

新的布局屬性 layoutInDisplayCutoutMode 包含三種可選的模式,

 
 
 
 
  1. public static final int LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS = 1; 
  2. public static final int LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT = 0; 
  3. public static final int LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER = 2; 

3.2 劉海屏的高度

在全屏模式下,我們需要有辦法獲取到劉海屏凹槽的高度,才可以做到設(shè)計和布局的時候,留出安全距離。

雖然 Google 要求,劉海屏的凹槽,必須和劉海的高度保持一致,而劉海屏又被隱藏在狀態(tài)欄了,所以有一個思路是直接獲取狀態(tài)欄的高度,來判斷劉海之外,可布局的安全區(qū)域。

不過 Android P 已經(jīng)預(yù)留出了標準的測量 劉海屏凹槽 的 Api:DisplayCutout。

劉海屏的凹槽,就在屏幕的中間,所以只有 getSafeInsetTop() 方法返回的結(jié)果,是我們需要的,而其他的 getSafeInsetXxx() 方法,直接返回的是 0 。

 
 
 
 
  1. view.postDelayed(new Runnable() { 
  2.     @Override 
  3.     public void run() { 
  4.         DisplayCutout displayCutout = view.getRootWindowInsets().getDisplayCutout(); 
  5.         Log.i("cxmyDev", "SafeInsetBottom:" + displayCutout.getSafeInsetBottom()); 
  6.         Log.i("cxmyDev", "SafeInsetLeft:" + displayCutout.getSafeInsetLeft()); 
  7.         Log.i("cxmyDev", "SafeInsetRight:" + displayCutout.getSafeInsetRight()); 
  8.         Log.i("cxmyDev", "SafeInsetTop:" + displayCutout.getSafeInsetTop()); 
  9.     } 
  10. }, 100); 

得到的結(jié)果,也可以看一下:

 
 
 
 
  1. I/cxmyDev: SafeInsetBottom:0 
  2. I/cxmyDev: SafeInsetLeft:0 
  3. I/cxmyDev: SafeInsetRight:0 
  4. I/cxmyDev: SafeInsetTop:112 

3.3 非標準 Api

像 OPPO 這樣的廠商,實現(xiàn)劉海屏的方式,也并不是按照 Android P 的標準做的,它完全是自己修改了劉海屏的實現(xiàn)方式。不過好在,都是會提供完備的適配文檔,這就需要我們直接閱讀他們提供的開發(fā)文檔來進行適配。

oppo 的劉海屏適配文檔:

  • https://open.oppomobile.com/wiki/doc#id=10139

對于 OPPO 而言,它劉海的高度是固定的,就是 80px。

判斷當前設(shè)備是否是劉海屏,也提供了對應(yīng)的 Api,可以用以下方法獲取。

 
 
 
 
  1. context.getPackageManager().hasSystemFeature(“com.oppo.feature.screen.heteromorphism”) 

返回 true 為劉海屏,但是這種方法只能識別 OPPO 品牌所支持的劉海屏。

四、結(jié)語

看完本篇文章,我想你對 Android 的劉海屏也有一定的認識了。這是一個全新的適配技術(shù),現(xiàn)在還不確定不同廠商會不會對其微調(diào),所以你要是碰到什么問題,不妨在留言區(qū)留言討論。


本文標題:一大波Android劉海屏來襲,全網(wǎng)全面適配技巧!
新聞來源:http://m.5511xx.com/article/cojiijc.html