找到你要的答案

Q:Adobe AIR - How to optimize for Mobile

Q:Adobe空气-如何优化莫比尔

I am in the process of converting a flash browser game to Mobile using AIR. Using the flash builder profiler I have found that my bottlenecks are

[render] - 42.31% [pre-render] - 41.41%

over 80% of the time my application is spent rendering. The game currently uses vector graphics for UI elements, characters and pets (there can be up to 15 characters and 15 pets). The background is a bitmap.

We have messed with converting the vector characters and pets into bitmaps and found that in some cases where the vector art animates a lot we get a large gain but for other characters with little animation it actually runs slower (I believe because the redraw regions on the vector art are so small).

I believe the biggest gain we can get on the rendering front is to remove vector art but I don't think our basic approach to animating bitmaps is better in every case. Are there any optimized AS3 libraries that handle animating bitmaps or converting vector art? Any resources you could point me to for research on these topics is greatly appreciated.

Thank you!

我在转换Flash浏览器游戏的过程中使用空气。使用Flash Builder探查器,我发现我的瓶颈是

[render] - 42.31% [pre-render] - 41.41%

超过80%的时间是我的应用程序渲染。游戏目前使用矢量图形的UI元素,人物和宠物(最多可以有15个字符和15宠物)。背景是位图。

我们已经给转换矢量人物和宠物为位图和发现,在某些情况下,矢量艺术赋予了很多我们得到一个大的增益,但其他人物小动画真的跑的慢的(我相信因为重绘的艺术载体的区域太小了)。

我相信我们可以在渲染前最大的收获是消除矢量艺术,但我不认为动画位图我们的基本做法是在每种情况下更好。有没有优化AS3库处理位图转换矢量动画或艺术?任何资源,你可以指出我对这些主题的研究非常感谢。

谢谢您!

answer1: 回答1:

This is a very broad question and might not be particularly well suited to Stack Overflow, but I'll give you some pointers:

Since you are using vector graphics, I assume you are running with the native display list in CPU mode. Basic vector shapes like rectangles have good performance on AIR for mobile in CPU mode, but more advanced shapes can quickly overwhelm mobile CPUs and lead to some loss in framerate.

If you have a lot of vector graphics, you are probably better off running in GPU mode and caching the vector shapes with the cacheAsBitmap property: http://help.adobe.com/en_US/AS2LCR/Flash_10.0/help.html?content=00001283.html#374074 Note that this can murder your performance if the graphics are very large or cause rendering artifacts if you use cacheAsBitmap on objects that have children.

The real answer is that you should switch to a high-performance library like the free and open-source Starling: http://gamua.com/starling/ I haven't used the native display list in several years, because the performance in Starling is significantly better. Starling integrates very easily with AIR and emulates the behavior of the display list as much as possible, so the transition to Starling is almost effortless.

A caveat is that it doesn't support vector graphics, but you can render them to bitmaps and then load those into Starling textures. Even better, render your graphics into sprite sheets and import them into Starling as texture atlases, which gives you excellent performance and easy asset management.

这是一个非常宽泛的问题,可能不是特别适合堆栈溢出,但我会给你一些指针:

既然您使用的是矢量图形,我假设您使用的是CPU模式下的本机显示列表。基本的矢量形状像长方形具有良好的空气在CPU模式移动,但更先进的形状可以很快压倒的移动处理器,导致一些损失的帧率。

如果你有很多的矢量图形,你可能更好的运行在GPU模式和缓存的矢量形状cacheAsBitmap属性:http://help.adobe.com/en_us/as2lcr/flash_10.0/help.html?内容= 00001283。HTML # 374074注意这会谋杀你的表现如果图形非常大或引起的渲染使用的对象,如果你有孩子cacheAsBitmap。

真正的答案是,你应该切换到一个高性能的图书馆喜欢免费和开源http://gamua.com/starling/八哥:我没有使用原生的显示列表的几年里,因为Starling的表现明显好。Starling将很容易与空气和模拟显示列表的行为尽可能多的,所以Starling的过渡几乎毫不费力。

一个需要注意的是,它不支持矢量图形,但是你可以使位图然后加载到八哥的纹理。更好的是,使你的图形为雪碧表导入到Starling作为纹理地图集,它给你卓越的性能和易资产管理。

answer2: 回答2:

. Avoid Vector graphics all together.

. Keep Starling engine and similar for desperate cases where graphic display performance must be optimal. Using those engine require ultra precise GPU memory management + uploading to GPU is very slow and heavy on CPU (app crashes possible due to memory overload). If you must use it, use it only for the graphic parts you need performance for.

. Use blittering and BitmapData a lot. In most cases that technic would be enough to get very fast and flexible graphic display.

。避免矢量图形一起。

。让斯特林发动机和类似绝望的情况下,图形显示性能必须优化。使用这些发动机需要超精密的GPU内存管理+上传到GPU非常缓慢而沉重的CPU(应用程序崩溃可能由于内存过载)。如果你必须使用它,只使用你需要表现的图形部分。

。使用blittering和BitmapData很多。在大多数情况下,该技术将足以获得非常快速和灵活的图形显示。

answer3: 回答3:

You can create regular mcs (vector, jpgs, bitmaps, dynamic text, whatever), create bitmap copies, and remove regular mcs. You can put the bitmaps in movieclips and sub-movieclips and move them around smoothly at 60fps as long as you're reasonable with total ram you're using (pool when needed). Scout will show you

Here's some code pieces showing converting regular mcs to bitmap tiles - you have to keep the dimensions of your bitmaps under the device's maximum so the easy solution is to use the device's screen dimensions as a max.

//  set the bmp dimensions to device screensize to prevent exceeding device's max bmp dimensions
if (bStagePortrait) {
    iTileWidth = Capabilities.screenResolutionX;
    iTileHeight = Capabilities.screenResolutionY;
} else {
    iTileWidth = Capabilities.screenResolutionY;
    iTileHeight = Capabilities.screenResolutionX;
}

//  mcList.mcListVector is the source mc - a regular mc containing mcs, jpgs, dynamic text, vector shapes, etc.
//  mcList.mcListBmp is an empty mc

aListTiles = new Array();
iNumberOfTiles = Math.ceil(mcList.height / iTileHeight);

for (i = 0; i < iNumberOfTiles; i++) {
    var bmpTile: Bitmap;
    //  move the source mc
    mcList.mcListVector.y = -(i * iTileHeight);
    bmpTile = fDrawTile(mcList, 0, 0, iTileWidth, iTileHeight);
    mcList.mcListBmp.addChild(bmpTile);
    bmpTile.x = 0;
    bmpTile.y = (i * iTileHeight);
    aListTiles.push(bmpTile);
}

//  remove the regular mc
mcList.mcListVector.removeChild(mcList.mcListVector.mcPic);
mcList.mcListVector.mcPic = null;
mcList.removeChild(mcList.mcListVector);
mcList.mcListVector = null;
}


function fDrawTile(pClip: MovieClip, pX: int, pY: int, pWidth: int, pHeight: int): Bitmap {
    trace("fDrawTile: " + pX + "," + pY + "  " + pWidth + "," + pHeight);
    var rectTemp: Rectangle = new Rectangle(pX, pY, pWidth, pHeight);
    var bdClip: BitmapData = new BitmapData(pWidth, pHeight, true, 0x00000000);
    var bdTemp: BitmapData = new BitmapData(pWidth, pHeight, true, 0x00000000);
    bdClip.draw(pClip, null, null, null, rectTemp, true);
    bdTemp.copyPixels(bdClip, rectTemp, new Point(0, 0));
    var bmpReturn: Bitmap = new Bitmap(bdTemp, "auto", true);
    return bmpReturn;
}

This conversion will choke your fps for a second but then you can move mcList around using regular code (tweening) at 60fps.

你可以创建普通的MCS(矢量,JPG,位图,动态文本,等等),创建位图拷贝和删除规则的MCS。你可以把位图动画剪辑和子影片剪辑和移动它们顺利60fps只要你合理的总内存你使用(池需要的时候)。球探会告诉你

这里是一些代码片断显示转换规则的MCS位图瓦-你必须保持你的位图的尺寸设备的最大,最简单的办法是使用设备的屏幕尺寸为最大。

//  set the bmp dimensions to device screensize to prevent exceeding device's max bmp dimensions
if (bStagePortrait) {
    iTileWidth = Capabilities.screenResolutionX;
    iTileHeight = Capabilities.screenResolutionY;
} else {
    iTileWidth = Capabilities.screenResolutionY;
    iTileHeight = Capabilities.screenResolutionX;
}

//  mcList.mcListVector is the source mc - a regular mc containing mcs, jpgs, dynamic text, vector shapes, etc.
//  mcList.mcListBmp is an empty mc

aListTiles = new Array();
iNumberOfTiles = Math.ceil(mcList.height / iTileHeight);

for (i = 0; i < iNumberOfTiles; i++) {
    var bmpTile: Bitmap;
    //  move the source mc
    mcList.mcListVector.y = -(i * iTileHeight);
    bmpTile = fDrawTile(mcList, 0, 0, iTileWidth, iTileHeight);
    mcList.mcListBmp.addChild(bmpTile);
    bmpTile.x = 0;
    bmpTile.y = (i * iTileHeight);
    aListTiles.push(bmpTile);
}

//  remove the regular mc
mcList.mcListVector.removeChild(mcList.mcListVector.mcPic);
mcList.mcListVector.mcPic = null;
mcList.removeChild(mcList.mcListVector);
mcList.mcListVector = null;
}


function fDrawTile(pClip: MovieClip, pX: int, pY: int, pWidth: int, pHeight: int): Bitmap {
    trace("fDrawTile: " + pX + "," + pY + "  " + pWidth + "," + pHeight);
    var rectTemp: Rectangle = new Rectangle(pX, pY, pWidth, pHeight);
    var bdClip: BitmapData = new BitmapData(pWidth, pHeight, true, 0x00000000);
    var bdTemp: BitmapData = new BitmapData(pWidth, pHeight, true, 0x00000000);
    bdClip.draw(pClip, null, null, null, rectTemp, true);
    bdTemp.copyPixels(bdClip, rectTemp, new Point(0, 0));
    var bmpReturn: Bitmap = new Bitmap(bdTemp, "auto", true);
    return bmpReturn;
}

这种转换会窒息你的FPS一秒钟然后你可以移动mclist经常使用代码(渐变)60fps。

answer4: 回答4:
  • As everybody mention don't use vector or draw it in a bitmapdata
  • Use GPU Rendering
  • You can't use filters in GPU mode so you will have to use BitmapData.applyFilter if you use any
  • Check out Starling or Flixel
  • Use copyPixel instead of BitmapData.draw wherever you can
  • If you are rendering a lot of content that will animate after that, aways skip one ENTER_FRAME event before animating the objects. This will make all transitions and animations as smooth as possible (this one actually made a lot of difference in all the apps that I have made)
  • As everybody mention don't use vector or draw it in a bitmapdata
  • Use GPU Rendering
  • You can't use filters in GPU mode so you will have to use BitmapData.applyFilter if you use any
  • Check out Starling or Flixel
  • Use copyPixel instead of BitmapData.draw wherever you can
  • If you are rendering a lot of content that will animate after that, aways skip one ENTER_FRAME event before animating the objects. This will make all transitions and animations as smooth as possible (this one actually made a lot of difference in all the apps that I have made)
actionscript-3  mobile  air