随着越来越多的设备开始使用刘海屏，这里给出一部分刘海屏的适配方法

在刘海屏幕的适配中， 我们先引入一个新的概念 屏幕安全区域 屏幕安全区域示意图 上图是苹果给出的iphone的屏幕安全区的范围，Android中其实有可能出现下部刘海的可能性，不过兼容下部刘海的出现可能会出现设计上的很多东西都要改变， 这里在复杂情况交互下先不考虑下部刘海的这种情况，比如bttomBar 遇到下部刘海，可暂时使用padding将bottomBar移动到安全区。

通常情况下，异形安卓屏幕的安全区就是在竖屏将内容下移状态栏高度，横屏状态下的安全区高度就是左右各预留状态栏高度

在刘海屏的适配中，还要引入一个新的概念 Bleed

通常在平面印刷设计中，为了顾及之后纸张裁切过程中可能出现的误差，设计师会在画布四周留出的一点边缘空间，这一圈额外的空间就叫做「出血」。同时，设计师一般也会设置一个「安全区」，确保设计稿中的重要内容都出现在安全区内。 Bleed 在当前的手机屏幕中，不单单刘海会导致安全区与手机屏幕实际可用区域不一，手机的圆角切割也可能导致这类的问题，所以在ui的设计中其实我们也应该尽量的避免在屏幕的边角显示一些重要的内容，防止被手机的圆角屏幕切割掉显示内容。

下图是不适配圆角显示和不考虑安全区的情况下对ui造成的影响： 安全区对UI的影响 在Android中，对于上部刘海的情况 我们可以很方便的确定他的安全区范围。 由于安卓的要求，刘海的高度一般会比状态栏的高度小一点或者一样大

对于刘海屏幕的适配，再安卓下分为这么几种情况

  1. P之前刘海手机的非全屏flags 和P中的LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER 在非全屏下，系统会为状态栏，底部导航栏自动加上一个padding， 用户拿到的可绘制区域就是完全的安全区，直接在上面绘制即可，无需考虑刘海遮盖内容的问题，缺点就是用户内容无法侵入状态栏和导航栏。只能使用着色api对状态栏和导航栏进行着色。
  2. P之前的LayoutFullscreen和P中的LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS 在这种状态下，系统会让内容侵入状态栏所在区域，这里就要考虑安全区的概念了，通常情况下，将状态栏作为bleed区域即可。将用户的交互内容放在安全区域里，保证不会被遮挡即可.
  3. P之前的LayoutFuscreen 和P之后的layoutfucreen并且没有设置LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS这种情况下，分为几种情况，P上的标准处理逻辑是，将刘海部分设置padding，由系统将由户可操作区域移动至安全区范围，大致效果同LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER一样，但是在P之前的系统的刘海手机上有不同的表现方式:
  • 在华为的8.0刘海上，可以通过设置华为规定的的meta来让系统认为你已经适配了华为的刘海屏幕，对于适配了华为刘海的app，emui会在fullscreen时让用户的可绘制区域完全充满屏幕，这是用户只需要自己手动注意安全区的问题即可， 对于没有适配华为刘海的app emui会在全屏模式下由系统为用户设置一个padding，将显示区域移动到安全范围内。
  • 在oppo的机器上P之前的刘海机器上， 对fullscreen的逻辑是统一的，系统不会在fullscreen的时候做任何的干涉，用户需要手动将内容便宜到安全区域中显示，否则可能会出现遮挡问题。
  • 在VIVO的机器上8.0刘海上，系统会默认对fullscreen的时候由系统用户内容到安全区域， 如果用户在设置中针对当前app开启了使用全面屏优化后则不会做任何的干预， 但是oppo并没有提供给开发者任何方式通知系统该app已经针对全面屏优化，只能由用户手动开启。
  • 在小米的8.0刘海机器上： emmm 抢不到 抢到的时候AndroidQ都出来了。(后续更新，小米已经在自己的开发者文档里提供了8.0刘海的适配方法，适配请见小米开发者文档）

    • 在锤子的R1工作站上： 老罗的机器目前没有提供这方面任何文档，而且看起来好像出厂的时候刘海区域默认是黑掉的。

      我们应该将什么内容放在安全区中

      所有用户能点击的内容， 按钮，用户能看到的文字，全屏状态下视频的控制条 都应该被显示在安全区域中 这里说下全屏状态下控制条为啥应该显示在安全区内 TIANMA 2018 OLED 上图是天马在ces2018中显出的新屏幕，这种不同于我们的目前类似苹果的异形切割屏幕，这种情况的开口，意味着厂商配合P的api 是有能力在屏幕任意地方进行开口的，这种情况下，可能会正好挡上了全屏播放器的控制条，导致视频无法暂停等问题， 所以，视频的控制条我认为显示在安全区域外是不安全的

什么内容应该扩展出安全区，进入Bleed区域

背景颜色， 背景图， 全屏状态下的视频（控制条不应该显示在安全区外）， recycler里面的内容（在某些特殊情况下）

这里在说下recycler里的内容 为什么这里说是在某些情况下呢，当recycler view在toolbar下的时候，当然是没有这种问题的，但是如果有这样一种需求，当recycler滑动的时候 toolbar隐藏，这时候 当toolbar隐藏的时候recycler我认为是应该显示在安全区外部的，这样才能显示出全面屏的优势 “视野” 如果 只是用一个纯色吧安全区外可显示区域盖上，效果并不好，而且全面屏也就失去了它的意义。

Written with StackEdit.