将 HTML5 Canvas WebGL 游戏移植到 Flash ActionScript 3.0
我在一月份创建了一个 HTML5 Canvas WebGL 游戏 Mozilla Game On 2010 竞赛（相当漂亮）晚了，我知道 - 直到昨天我才发布它）。现在我想将其移植到 Flash ActionScript 3.0 中以完成大学作业。
我精通 C/C++ 和 Java 等静态语言；以及 Python 和 JavaScript 等动态语言。不过我不知道 ActionScript，但由于它是 ECMAScript 的子集，所以应该很容易理解。
我想学习 ActionScript 3.0 编程，以便能够将我的游戏移植到 Flash 中。更具体地说，我想了解更多关于：
- ActionScript 与浏览器和服务器端 JavaScript 有何不同以及基础知识。
- ActionScript 中的 OpenGL 编程（包括加载纹理、着色器等）。
- 如何使用类似 API 的 2D HTML5 Canvas 在 Flash 中创建 HUD（在我的游戏中，我有 2 个画布，一个用于 3D 游戏，另一个覆盖它用于平视显示器）。
- 支持 ActionScript 中的向量和矩阵计算。
- 如何在 Flash 中加载音频和精灵等资源。
如果您能为我提供一个页面链接，我可以从中了解有关这些主题的更多信息，我将不胜感激。更直接的实践方法会更好。
如果您能检查我的 JavaScript 源代码并建议我解决此问题的最佳方法，那将会更有帮助。
main 的代码游戏引擎和游戏本身可以在我的 Github 中找到存储库。
I had created an HTML5 Canvas WebGL game in January for the Mozilla Game On 2010 competition (pretty late, I know - I never released it until yesterday). Now I want to port it to Flash ActionScript 3.0 for a college assignment.
I'm well versed with both static languages like C/C++ and Java; and dynamic languages like Python and JavaScript. However I don't know ActionScript, but since it's a subset of ECMAScript it should be pretty easy to understand.
I want to learn programming in ActionScript 3.0 so that I may be able to port my game in Flash. To be more specific, I want to know more about:
- How is ActionScript different from Browser and Server-Side JavaScript, and basics.
- OpenGL programming in ActionScript (including loading textures, shaders, etc).
- How to create a HUD in Flash using a 2D HTML5 Canvas like API (in my game I have 2 canvases, one for the 3D game and another overlaying it for the heads-up display).
- Support for vector and matrix calculations in ActionScript.
- How to load assets like audio and sprites in Flash.
I would appreciate it if you would provide me a link to a page from where I can learn more about these topics. A more direct hands-on approach would be preferable.
It would be even more helpful if you would check my source code in JavaScript and suggest the best possible way for me to tackle this problem.
The code for the main game engine and the game itself may be found in my Github repository.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
ActionScript 和 JavaScript 的核心非常相似。在某些方面，您可以将 ActionScript 视为位于 ECMAScript 之上的强大库。有一些差异（即 ActionScript 喜欢将自己视为基于类的 oop，而 JavaScript 是基于原型的），但如果您对其中一个感到满意，那么您应该对另一个感到非常放心。
ActionScript 具有基于类的继承系统并支持接口（但如果您愿意，您仍然可以执行一些原型魔法，但不建议这样做）。它还支持强类型对象。
这会将
object变量强类型化为MovieClip类的实例。如果您的游戏是 3D 密集型游戏，那么您将需要了解新的 Flash 11 Stage3D 和 Context3D 类。这些公开了低级 GPU 加速 API，这在 Flash 11 之前是不可能的。您可以使用 Flash 10 制作有趣的 3D 内容，但您通常使用 drawTriangles()，未进行硬件加速。 Flash 11 目前处于测试阶段，但应该很快就会推出。 Flex SDK 的 Beta 版本应该可以让您针对 Flash 11 播放器进行编译。
还有相当多的 3D 库是构建在这些低级 API 之上的。如果你仔细寻找它们，很容易找到它们。但我建议在深入研究 3D 库之前先充分了解 ActionScript 的工作原理。
无论您使用 Flash 11 还是 Flash 10，Flash 中的 HUD 内容都很简单。对于“经典”Flash，您需要熟悉 显示树 他们在 Flash 中使用的概念。只需确保显示顺序正确，您的 HUD
DisplayObject将始终位于渲染DisplayObject的“顶部”（对于 Flash 11、
StageVideo 和Stage3D对象位于舞台正上方，但位于附加到舞台的所有普通 FlashDisplayObjects后面。因此，在这种情况下，我会让Stage3Dapi 处理所有繁重的渲染工作，并为 HUD 元素使用传统的显示堆栈。您可能还想通过 Flash CS5.5 获取 Flash Builder。如果您是一名程序员（我假设您是一名程序员，因为您在这里发帖），那么尝试编码不会让您流血。 FB是基于eclipse的，它相当不错，但并不完美。但是，如果您获取免费的 Flex SDK，并且不介意使用命令行，则可以非常快速且廉价（又名免费）开始编译 swf。
另外，请查看 FlashDevelop。自从切换到 FB 的内置分析器以来，我已经有一段时间没有使用它了，但它可能对你有用。
导入图像和音频非常简单使用 Flex SDK。
然后实例化该类：
然后在您想要的任何地方使用它。
只是关于 Flex 的注释。 Flex 是一组构建在普通 Flash API 之上的 UI 库，Flex SDK 包括用于编译 MXML 和 ActionScript 代码文件的库和工具。因此，尽管听起来您应该使用 Flex SDK 来编译 Flex 应用程序，但您也可以使用它来编译直接的 ActionScript 代码。
有 Vector3D 的内置类和 Matrix3D。
至于教程或参考资料，我确实没有任何可提供的。我发现互联网上有关 ActionScript 编程的大部分信息都是时好时坏（当您可以找到不是由图形设计师编写的内容时）。我会在此处进行挖掘，看看是否能找到任何东西这对你来说很有意义。
显然，关于这个问题我还有很多东西可以讨论，但希望这能推动你朝着正确的方向前进。
ActionScript and JavaScript are very similar at their core. In some ways you can think of ActionScript as more like a robust library layered on top of ECMAScript. There are a few differences (namely ActionScript likes to think of itself as a class-based oop, where as JavaScript is prototype-based), but if you are comfortable with one, then you should be pretty at ease with the other.
ActionScript has a class based inheritance system and supports interfaces (but you can still do some prototypical magic if you want, but its not recommended). It also supports strongly-typed objects.
This will strongly type the
objectvariable as a instance of theMovieClipclass.If your game is very 3D intensive, then you'll want to look into the new Flash 11 Stage3D and Context3D classes. These expose a low level GPU accelerated API that before Flash 11 wasn't possible. You can do interesting 3D stuff with Flash 10, but you are usually using drawTriangles(), which was not hardware accelerated. Flash 11 is currently in beta, but it should be out very soon. There are beta versions of the Flex SDK that should let you compile targeting the Flash 11 player.
There are also quite a few 3D libraries that are built on-top of these low-level api. If you goggle around for them, they are easy to find. But I would recommend getting a solid understanding of how ActionScript works before diving into the 3D libraries.
The HUD stuff in flash is simple whether you go with Flash 11 or Flash 10. For "classic" flash, you'll want to get familiar with the display tree concept they use in flash. Just make sure the display order is correct, and your HUD
DisplayObjectwill always be "on-top" of your renderingDisplayObjectFor Flash 11,
StageVideoandStage3Dobjects sit directly above the stage, but behind all normal flashDisplayObjectsthat are attached to the stage. So in that case, I would let theStage3Dapi take care of all of your heavy rendering lifting, and use the traditional display stack for your HUD elements.You'll probably also want to grab yourself Flash Builder over Flash CS5.5. If you are a programmer (which I am assuming you are since you are posting here), it wont make your eyes bleed trying to code. FB is based off eclipse, and its pretty decent but not perfect. But if you grab yourself the free Flex SDK, and don't mind using the command line, you can get started compiling swfs pretty quick and cheap (aka free).
Also, look into FlashDevelop. I haven't used it in a while, since switching to FB for its built in profiler, but it might be of use to you.
Importing images and audio is pretty straight-forward with the Flex SDK.
and then later instantiate the class:
And then use it where ever you want to.
Just a note about the Flex. Flex is a set of UI libraries built on top of the normal Flash API, the Flex SDK includes the libraries and tools to compile MXML and ActionScript code files. So, despite it sounding like you should use the Flex SDK to compile Flex apps, you can use it to compile straight ActionScript code as well.
There are built in classes for Vector3D and Matrix3D.
As far as tutorials or references, I don't have any to offer really. I've found that most of the information on the internet about ActionScript programming is pretty hit or miss (when you can find something thats not written by a graphic designer). I'd dig around in here and see if you can find anything that makes sense to you.
There is obviously a lot more I could go into about this stuff, but hopefully this will give you a push in the right direction.
欢迎使用 AS3 :)
@32bitkit 比我先找到了 IDE 信息，但我绝对推荐 Flash Builder。如果您要进行任何真正的 AS3 工作，它是一个真正的工具并且物有所值。
就实际教程而言，Senulous 因编写一些最好的内容而闻名。他在此处提供了许多很棒的教程，但以下两个是特别优秀的 AS3 入门教程:
如第二个教程所示，基于 AS3 的项目将从
flash.display.Sprite类继承。您可以查看该文档 此处。也许这听起来很愚蠢，但是通过浏览 AS3 参考文档。 Adobe 在这些方面做得很好。在 AS3 中需要注意的另一件事是事件的处理方式。 本教程解释了 EventDispatcher 类如何作为事件管理的基础。您可以使用内置事件或调度您自己的事件。
哈！
Welcome to AS3 :)
@32bitkit beat me to the IDE info, but I'd absolutely recommend Flash Builder. It's a real tool and worth the money if you're going to be doing any real AS3 work.
As far as actual tutorials, Senocular is known for writing some of the best content out there. He has a number of great tutorials here, but the following two are especially excellent introductory tutorials for AS3:
As shown in that second tutorial, an AS3-based project will inherit from the
flash.display.Spriteclass. You can view the docs for that here. Perhaps it sounds silly, but you'll honestly learn quite a lot about AS3 by just browsing the AS3 Reference docs. Adobe has done a good job with those.Another thing to be aware of in AS3 is how events are handled. This tutorial explains how the EventDispatcher class functions as the base of the event management. You can use the built-in events or dispatch your own.
HTH!