如何使用 ActionScript 管理移动应用程序中图像资源的大小？答案

【问题标题】：How to manage size of image assets in mobile apps with ActionScript?如何使用 ActionScript 管理移动应用程序中图像资源的大小？
【发布时间】：2012-02-10 00:39:37
【问题描述】：

由于 iPhone 的屏幕密度，图像资源被开发得更大。所以，在为 Flex 组件指定图标和图像时，采用这种形式。

<s:ViewNavigator id="tab1" label="Tab1 width="100%" height="100%" firstView="views.Tab1">
        <s:icon>
            <s:MultiDPIBitmapSource source160dpi="@Embed('assets/tabIcon.png')"/>
        </s:icon>
</s:ViewNavigator>

Flex 当然会正确呈现它并将大小调整到应有的大小。

但是，当我自己加载图像时，它们看起来被放大了，因为它们看起来会变大。

这就是我在覆盖标签栏时使用它的方式。

public class TabbedViewNavigatorTabBarSkin extends ButtonBarSkin
{

    [Embed (source="/assets/tabBar.png" )]
    private var TabBarPng:Class;

    override protected function createChildren():void
    {
        var bgb:Bitmap = new TabBarPng() ;

        addChild(bgb);
    }
}

这是图像被炸毁的时候。我做错了什么？

【问题讨论】：

您是否设置了 applicationDPI，如果有，Flex 将根据 applicationDPI/运行时实际 DPI 缩放所有内容。因此，如果 applicationDPI 低于实际的运行时 DPI，它将按比例放大您的组件。在第一种情况下，您使用的类专门根据您指定的内容和运行时 DPI 选择要使用的图像（我想不会进一步缩放）。另一种情况是你只是告诉它使用位图但没有指定它已经适当地缩放......你不能只使用 MultiDPIBitmapSource 并将其设置为 source160dpi=new TabBarPng() 吗？
我不确定我明白你的意思。你能把这段代码贴出来吗？如果它有效，我很乐意使用它，它看起来是一个好方法。不，我没有在任何地方专门设置 applicationDPI。我的图像是 72ppi 和视网膜大小。
如果你去掉applicationDPI，你的Bitmap是否仍然会缩放到太大？如果不是，您可能只想关闭该属性。它将为您做的是根据 applicationDPI 与运行时 DPI 对静态设置的宽度/高度属性进行缩放，因此就像屏幕上的 100 px 框具有两倍的分辨率最终将成为 200 px 框，即使它将报告宽度为 100。我会看看是否能找到一种简单的方法来使用我坐在那里的演示移动应用程序来测试它。
删除 applicationDPI 属性时它可以正确缩放。但这意味着什么，我想它确实有其他目的，而不是搞砸加载的图像。
哈哈，是的，所以这样做的目的是，如果您设置了 applicationDPI，那么它将根据属性与运行时 DPI 调整绘图值，对不起，我知道我在重复自己，但实际上这是最好的我可以解释一下。我最近回答了另一个类似的问题，这是我知道的唯一原因。在我的 Galaxy Nexus 上，如果我将应用程序中的 applicationDPI 设置为 160，因为我的屏幕密度为 320，它会使所有内容的大小加倍，这样，如果我设计假设屏幕为 160DPI 并且有人拥有更高的对象，我的对象将是正确的视觉大小他们的屏幕也是

标签： actionscript-3 apache-flex mobile flex4.5

【解决方案1】：

好吧，我认为您想要做的事情可以使用以下代码来实现，这基本上会否定内部完成的工作以根据屏幕尺寸缩放资产，同时允许它缩放其他基于 DPI 的组件，我不确定这在实践中会如何发挥作用。

        import mx.core.mx_internal;

...

        var bgb : Bitmap = new TabBarPng();
        bgb.scaleX = 1 / systemManager.mx_internal::densityScale;
        bgb.scaleY = 1 / systemManager.mx_internal::densityScale;

或者我认为的另一种可能性是：

        var mul : MultiDPIBitmapSource = new MultiDPIBitmapSource();
        mul.source160dpi = new TabBarPng();

        var bgb : BitmapImage = new BitmapImage();
        bgb.source = mul;

        var gr : Graphic = new Graphic();
        gr.width = 100 / systemManager.mx_internal::densityScale; //not sure if you'd want densityScale being applied here or what?  Same below just a matter of testing on more devices
        gr.height = 100 / systemManager.mx_internal::densityScale;
        gr.addElement(bgb)
        addChild(gr);

[来自 MultiDPIBitmapSource API 文档]

这个类提供了不同运行时密度的位图列表。它作为 BitmapImage 或 Image 的源和按钮的图标提供。组件将使用 Application.runtimeDPI 来选择要显示的图像。

我认为这个文档：

http://help.adobe.com/en_US/flex/mobileapps/WS19f279b149e7481c682e5a9412cf5976c17-8000.html

可能仍然是您能找到的最清晰的解释，尽管尚不完全清楚这将如何影响不同设备上运行时的应用程序。最好的选择是在尽可能多的设备上进行测试（或需要支持）。

【讨论】：

感谢您参与其中。看起来像 Flex 设计中另一个明显的邋遢。我知道我将不得不放弃 DPI 管理器并在设备上进行更多测试。
applicationDPI 只能在 MXML 中设置。