Weple

屏幕折起又展开的地方

iPhone Duo 适配

让界面在折叠和展开之间不散架,也让用户正在写的内容不会消失

按机型名分支的代码,下一款机型出来时还会再散一次。

多出来的不是一种分辨率,是好几种状态

折叠屏同时带着合上时用的外屏和展开时用的大内屏。应用会落在折叠、展开、旋转、分屏,以及在它们之间切换的那一瞬间等多种状态里。按某一种状态钉死的界面,在其余状态里就会错位:文字被截断,按钮跑到手指够不到的位置,写了一半的内容消失。

具体做什么

  • 按窗口尺寸判断,而不是机型名

    改成以当前可用的窗口尺寸和安全区域为准来决定布局。按机型名分支,每出一款新机就要再改一次,而且像分屏这种使用途中尺寸就变了的情况根本抓不到。

  • 适合展开状态的结构

    不把一列内容硬拉满整个宽度,而是改成列表与详情并排的两列结构。同一个界面,合上时回到一列。

  • 把折痕位置空出来

    标签栏、输入框、主要按钮压在屏幕中间那道折痕上,既难读也难按。我们逐个状态确认那个位置上会出现什么,再把它挪开。

  • 合上再打开,手里的东西还在

    确认正在输入的文字、滚动位置、播放进度在切换之后是否原样保留。折叠和旋转不是同一件事,不单独确认就会悄悄丢掉。

  • 逐个状态实际跑一遍

    把折叠、展开、旋转、分屏、切换中逐一摆开,记录每个界面在每种状态下的表现。

适配记录

哪种状态下什么地方错位、怎么修的,连同截图一并整理给你。下次做新界面时,直接拿这份记录里的状态清单来用就行。

这样推进

  1. 提供应用与重点界面

    给代码仓库的读取权限或一个能安装的构建版本,再告诉我们哪几个界面绝对不能出问题。

  2. 逐个状态检查

    把折叠、展开、旋转、分屏、切换中逐一摆开,记录哪里错位。

  3. 确定范围与周期

    先定下要修的地方和所需时间。未达成一致之前不产生费用。

  4. 修改与交付

    修好布局与状态保留,连同工作记录一起交回。

适合这些情况

  • 已经上架、界面只按一种尺寸做出来的 iOS 应用
  • 在 iPad 或分屏下本来就会错位的应用
  • 代码里还留着按机型名或固定尺寸分支的团队

常见问题

只适配 iPhone Duo 吗?
不是。因为改成按当前可用的窗口尺寸判断,同一份代码也能覆盖其他折叠屏、iPad 和分屏。只盯着一款机型加分支,下一款出来还得把同样的活再干一遍。
需要把应用重做吗?
多数情况下不需要。要动的是布局和状态保留。如果某个应用确实需要改界面结构本身,我们会在检查阶段先告诉你,再重新确定范围。
必须有真机吗?
不需要。我们在模拟器里切换状态确认。如果有真机,还会一并确认握在手里时拇指实际够得到的位置。
React Native 或 Flutter 做的应用也可以吗?
可以,判断标准是一样的。只是各框架取窗口尺寸和安全区域的方式不同,告诉我们你用的是哪一种,我们先确认可行范围。
和应用商店要求适配有什么不同?
商店要求适配是为了通过审核而提升目标版本。这项服务与审核无关,是在屏幕变大、会对折的情况下保住布局和用户手里的内容。两项一起交给我们,可以一次处理完。

先把设备打开一次看看

告诉我们应用名称和几个绝对不能出问题的界面,我们先确认它们在哪些状态下会错位。

查看全部服务