iPhone闪存中不同的屏幕尺寸？ （获得黑条）

Question

我是整个编码世界的新手，动作脚本3是我的第一次真实体验，如果我不能立即理解你的答案，那就很抱歉。

我在AIR for iOS中使用Adobe Flash CC构建了一个iPhone应用程序。所有代码都在时间轴或单独的.as文件中（因此不使用文档类）。

游戏的核心概念是随机生成的对象从屏幕顶部掉落，用户必须点击它们才能让它们在触及底部之前消失。

我的问题是我的文件尺寸为640 x 960。我认为这适合iPhone 4（尚未测试过）但是当我在iPhone 5s上测试它时，我会在顶部和底部找回条形图。显然他们有不同的屏幕尺寸，但我希望该应用能够在许多不同尺寸的iPhone上运行。

我花了几个小时搜索这个，但仍然不明白我的意图。我尝试过使用stage.scaleMode设置，但没有任何变化。我还在包含的文件中添加了一个名为default-568h@2x.png的文件（只是一个尺寸为640 x 1136的绿色矩形），但这也没有显示。

基本上我想知道如何更改我的应用和AS3代码以允许我的应用适合所有不同尺寸的iPhone？

非常感谢任何帮助。

Answer 1

LAUNCH IMAGES

First, before anything else, you need to make sure you have the correct launch images included in your project.

Here is a table from Adobe's website：

• 默认~iphone.png | iPhone 4（非视网膜）640 x 960 Potrait
• Default@2x~iphone.png | iPhone 4,4s 640 x 960 Potrait
• Default-568h@2x~iphone.png | iPhone 5,5c，5s 640 x 1136 Potrait
• Default-375w-667h@2x~iphone.png | iPhone 6/7/8 750 x 1334 Potrait
• Default-414w-736h@3x~iphone.png | iPhone 6 + / 7 + / 8 + 1242 x 2208 Potrait
• Default-Landscape-414w-736h@3x~iphone.png | iPhone 6 + / 7 + / 8 + 2208 x 1242 风景
• Default-Landscape-812h@3x~iphone.png | iPhone X 2436 x 1125 风景
• Default-812h@3x~iphone.png | iPhone X 1125 x 2436 人像

一旦您制作了这些图像（并且完全如图所示命名），请将它们包含在您的项目中（它们必须位于应用程序的 root 中）以下内容：

在FlashPro中

• 转到您的发布设置
• 转到AIR for iOS设置。
• 转到“常规”标签
• 将所有这些图像添加到“包含文件”列表（根目录）

缩放您的内容

• 选项1，填充和作物

如果您不介意稍微裁剪一下内容，可以在应用启动时执行此操作：

stage.scaleMode = StageScaleMode.NO_BORDER

这将缩放您的swf，使其在保持纵横比的同时填满整个屏幕。很容易弄清楚需要多少填充才能使这种方法适用于各种iPhone的宽高比的微小变化。

但是，如果您想允许方向更改（纵向到横向），裁剪可能会太严重。

• 选项2 - 响应式设计

适应不同屏幕分辨率和宽高比的最佳方法是使您的应用程序响应。这涉及到应用程序开始时的以下代码：

stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align     = StageAlign.TOP_LEFT;

现在你的舞台界限（stage.stageWidth＆amp; stage.stageHeight）将是设备*的全宽和高度。 （某些设备底部或顶部带仍有软件工具栏）

然后，您可以通过代码定位。

如果您希望轻松转换所拥有的内容（您不希望使用代码调整大小并完全对齐所有内容），只需将所有内容放入实例名称为container的容器MovieClip中，然后你可以像这样对它进行大小和定位：

//scale the container as big as possible while still fitting entirely in the screen:

//figure out which dimension should match the stage (widht or height)
if(container.width - stage.stageWidth >= container.height - stage.stageHeight){
    container.width = stage.stageWidth;
    container.scaleY = container.scaleX;
}else {
    container.height = stage.stageHeight
    container.scaleX = container.scaleY;
}

//center it on the screen:
container.x = (stage.stageWidth - container.width) * 0.5;
container.y = (stage.stageHeight - container.height) * 0.5;

如果屏幕尺寸发生变化（例如，您在桌面上最大化/恢复，或者在移动设备上从纵向移动到横向），那么收听调整大小事件也是一个好主意。

您可以通过在舞台上收听调整大小事件来做到这一点：

stage.addEventListener(Event.RESIZE, redrawScreen);

function redrawScreen(e:Event):void {
    //resize everything as the window size has changed.
}

Answer 2

编码员负责为不同的屏幕尺寸提供不同的解决方案。您检查设备大小，然后相应地显示内容。总而言之，它与基于旋转显示不同内容没有什么不同。如果你希望有一个神奇的解决方案可以在AIR中为你做所有这些，那么你就没有运气了。

不推荐使用舞台音阶模式（你应该总是在手机上不使用音阶），因为你完全放弃了根据真实物理设备大小比较你的显示对象的位置的能力（基本上你赢了＆＃39;我知道你显示的内容是在屏幕上还是完全不在屏幕上。

如果您认为开发移动设备很容易（不仅仅是使用AIR而是使用任何技术）那么很抱歉，您不必特别考虑所有这些尺寸。

如何处理它的基本原则：

1. 获取真实的设备尺寸。
2. 计算实际密度/比率。
3. 将该尺寸与应用尺寸进行比较。 （再次缩放模式到无比例）
4. 提取一般比率（应用的尺寸与设备尺寸相比）
5. 使用该比率来缩放和放置主容器（包含整个应用程序的容器），硬盘：缩放并将所有DisplayObject放置在应用程序中。
6. 由于维持了应用比率，因此无论如何填空空白。
7. 您的应用在任何设备上正确填充整个屏幕。