PhoneGap Build 7.0.1支持iOS启动演示图板（是！）

随着2017年8月1日发布的PhoneGap Build 7.0.1，我们现在可以将iOS Launch Storyboards与PhoneGap Build一起使用。 这意味着我们可以在Cordova，PhoneGap 和 PhoneGap Build中使用它们，这为每个工具带来了完全的奇偶校验。 好极了！ 这会带来一些后果：

• 现在，PhoneGap Build可以使用每台设备的本机分辨率，以iPad Pro 10.5“和12.9”尺寸为目标。 Apple没有提供其他支持的方法来针对这些设备上的本机分辨率，除非使用情节提要。
• 只要Apple继续使用相同尺寸的尺寸类别，PhoneGap Build现在就可以在将来针对任何新的屏幕尺寸（iPhone 8， *咳嗽，咳嗽* ）。
• PhoneGap Build应用程序现在可以支持带附加配置/插件的分屏和滑盖式多任务处理。
• 最酷：您可以使用单个图像来定位所有设备的外形尺寸和视口（如果需要）。

什么是启动故事板？

苹果长期以来一直在努力使开发人员构建能够响应视口大小的应用程序。 作为混合开发人员，这听起来像是“响应式设计”。 但是，在iOS开发的初期，开发人员将代码编码为特定的视口大小，因为只有一个视口大小，所以工作了……直到有很多视口不起作用为止。

长期以来，显示启动画面的唯一方法是“启动图像”-特定分辨率的PNG文件。 苹果公司长期以来也一直在尝试提出这样的想法，即启动映像应以未填充状态反映应用程序。 其想法是给人以更快的启动速度的印象。*但是，不利的一面是，开发人员必须为每个可能的视口创建单独的启动图像版本。 一开始没什么大不了的，但是现在呢？

* 亲自？ 我认为这会使发射速度变慢 。 但这就是我。

随着Apple发布具有新屏幕尺寸的设备，他们还开始使用这些启动图像作为该应用程序支持的视口的指示器。 如果该应用程序未提供适当大小的启动图像，则将缩放该应用程序或将其装箱。

然后发布了iPad Pro 12.9“，Apple 没有提供支持的方法来生成iPad Pro 12.9”启动图像 。 他们还发布了分体式和滑盖式多任务处理功能，没有一种方法可以为所有可能发生的所有广泛变化的视口生成启动图像。 唯一受支持的方法是使用Xcode 6中引入的功能：启动情节提要。

如果您完全熟悉Xcode中的情节提要，那么启动情节提要只是分配给应用程序启动时显示的情节提要。 如果您不熟悉情节提要，那么简单的解释就是：情节提要是应用程序用户界面的可视化设计的集合，以及设计之间的连接（顺序）。

现在，情节提要是提供启动图像的首选方法。 这很有道理-如果您应用的启动图像应该代表一个未填充的UI，那么您（潜在地）可以将现有的故事板重新用作启动图像，并完成此操作。 情节提要板还具有根据大小类调整布局的方法，因此可以使它们响应视口大小。

启动情节提要非常整洁-如果您要构建本机应用程序并使用Xcode。 对于既不执行上述操作的混合开发人员，必须启动Xcode，构建情节提要，将其配置为启动图像等，这在后面很麻烦。 然后，我们不要忘记从技术上讲 Xcode项目被视为构建工件，并且很容易被覆盖，因此需要重复该过程。 不理想。

这样，从4.3.1版本开始，将启动情节cordova-ios板的简单实现合并到了cordova-ios中。 现在，每个项目都带有一个简单的情节提要板，其中包含可缩放以填充屏幕（尊重纵横比）的图像。 假设config.xml中提供了具有特定文件名的图像，那么Cordova将配置该应用程序以自动使用启动情节提要。

以这种方式使用图像不像从头开始构建情节提要和复制用户界面那样灵活。 但是，除了建立DSL外，使用图像似乎是最好的方法。 但是，这确实会对您在Cordova中设计启动情节提要图像产生一些影响，我们稍后将进行介绍。

使用iOS启动情节提要

为了帮助您入门，我创建了五个与PhoneGap Build一起使用的存储库。 从简单的启动画面到微调的启动画面，每一个都展示了启动故事板设计的不同方面。 您可以使用这些存储库中的任何一个来创建PhoneGap Build应用程序，提供开发密钥，并且应该已经准备好将IPA文件安装在设备上。 下面还提供了仿真链接。

• 简单的启动情节提要（中间的徽标，纯色背景）； 查看模拟
• 双音启动故事板（中心徽标，两种背景色）； 查看模拟
• Material Design启动情节提要板（中间的圆形徽标，纯色背景色）； 查看模拟
• 复杂的启动情节提要板（中心徽标，复杂的背景，两个变体）； 查看模拟
• 微调的启动故事板（中心徽标，纯色背景，多种变体）； 查看模拟

创建您的启动情节提要

那么，如何创建自己的启动故事板？ 好吧，如果您想创建简单的东西，这很容易。 如果您想构建任何复杂的东西，它将涉及更多。

但是，在进行下一步之前，您应该忘记一件事：没有简单的方法可以像Apple所建议的那样轻松呈现未填充的UI。 提供的图像将从中心缩放和裁剪，这意味着几乎不可能在所有目标设备上制作出看起来正确的图像。

您应该查看有关此主题的文档以获取全部详细信息，但这是真正的简短版本：

• 选择一种与您的应用的背景色匹配的颜色。 然后创建一个正方形PNG（2732 x 2732，但从技术上讲，任何大小都可以）。 然后填充它。 做一个快乐的舞蹈。 （ 如果您想知道，是的，Apple似乎确实接受“空白”启动屏幕。我对此方法还没有问题。 ）

哦，您不想空白的启动屏幕？ 没关系-这是稍长的版本：

• 以正方形开头 （至少2732 x 2732）。 当然，没有设备屏幕是正方形的，但是启动情节提要板无论如何都将针对各种各样的视口。 使用正方形可让您轻松地在单个图像中支持纵向和横向方向。
• 为中心设计。 由于启动情节提要板很少会与任何设备屏幕完全匹配，因此几乎可以肯定会对其进行缩放和裁剪。 只能保证保留发射情节提要面板中心的信息。
• 除非要提供变化，否则请保持狭窄 。 iPad多任务处理的范围可能会非常狭窄，这意味着在多任务处理中使用时，在其他任何地方都可以使用的徽标最终可能会被裁剪掉。
• 仅在必要时提供变体，并且仅保留重要信息。 徽标和文本属于此类别。 艺术品通常不会。 请记住，Apple并不建议您在启动屏幕上放任自己。 因此，采取简单的方法： 不要！
• 测试，测试以及更多测试 。 您需要在所有可能的外形尺寸和视口比例上测试启动情节提要板，以确保不会以不幸的方式裁剪启动图像（例如徽标的一部分被切除）。 想要采取简单的方法吗？ 使用我的启动Storyboard预览实用程序。 那里还有更多示例。

现在，我们如何获得PhoneGap Build来识别您的新启动情节提要图像？

首先，通过将以下内容添加到config.xml ，使用新的7.0.1 CLI：

其次，请确保再次在config.xml使用cordova-ios@4.4.0或更高版本，或者，如果您不想将项目固定到特定版本，则可以只使用cordova-ios@latest （请注意这一点！）

第三，从项目和config.xml 删除所有旧的启动映像。 如果将它们包括在内，它们仍将与您的项目捆绑在一起，这意味着您的应用程序将比需要的更大。

最后，添加对新的启动情节提要图像的引用，如下所示：

   
 ... 

关于这些标签的格式，需要注意以下几点：

• 没有width或height属性。 您也不能提供。 （如果这样做，将触发旧版启动图像处理。）
• 文件名中有一个比例说明符-可以是@ 1x，@ 2x或@ 3x。 必须提供它以便识别故事板图像。
• 有一个成语说明符-可以是universal ， ipad或iphone 。 通常，您将使用universal 。 必须提供它以便识别故事板图像。
• 有一个大小类说明符-可以是anyany ， anycom ， comany或comcom 。 有关此特定值的更多信息，请参见文档。 如果您只是创建一个启动情节anyany板， anyany都可以。 还必须提供此名称，以便识别情节提要图像。

否则，文件名可以是您喜欢的任何名称。 （ 不，这根本没有限制，对吗？ ）如果您在识别情节提要图像时遇到问题，请仔细检查命名方案。

通常，如果要为所有设备创建单个映像，则只需在config.xml添加一行即可：

您需要注意的怪癖

关于iOS如何支持启动故事板，我已经看到了一些怪癖：

• 启动情节提要板已缓存。 如果没有看到您期望的启动映像，请尝试重新启动。 如果失败，请删除该应用程序并重新安装。
• 如果在安装应用程序后，设备在启动应用程序时显示黑屏，请尝试重新启动。 这一直对我有用。 至于为什么，我不确定。 它可能只是我的设备，也可能是其他设备（尚未固定）。
• 如果提供变体（ anycom ， comany ， comcom ），则还必须提供相同习语和小数anyany版本。 否则，将不会使用该变体。

有什么问题吗 有问题吗？

如有任何疑问，请随时与以下任何一个机构联系：

• Adobe PhoneGap论坛
• Adobe PhoneGap构建论坛
• 科尔多瓦休闲频道
• PhoneGap Google网上论坛
• 或者，通过Twitter与我联系，我会尽力提供帮助。