守望者--AIR技术交流

 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,访问微社区

搜索
热搜: ANE FlasCC 炼金术
查看: 1040|回复: 0

[技术资料] 学习编写Haxe的HelloWorld

[复制链接]
  • TA的每日心情
    擦汗
    2018-4-10 15:18
  • 签到天数: 447 天

    [LV.9]以坛为家II

    1742

    主题

    2094

    帖子

    13万

    积分

    超级版主

    Rank: 18Rank: 18Rank: 18Rank: 18Rank: 18

    威望
    562
    贡献
    29
    金币
    51788
    钢镚
    1422

    开源英雄守望者

    发表于 2015-1-15 14:02:37 | 显示全部楼层 |阅读模式

    简单做个记录,如何编写一个简单的Haxe程序:(编写flash的swf程序)(编写于2014年8月)



    1、到官网下载Haxe安装程序(http://haxe.org/download ),安装。



    2、编写代码类:并保存为Test.hx


    1. <font color="#333333"><font face="Arial">package;  
    2. import flash.text.TextField;  
    3.   
    4. class Test {  
    5.     static function main() {  
    6.         var mc:flash.display.MovieClip = flash.Lib.current;  
    7.         mc.graphics.beginFill(0xFF0000);  
    8.         mc.graphics.moveTo(50,50);  
    9.         mc.graphics.lineTo(100,50);  
    10.         mc.graphics.lineTo(100,100);  
    11.         mc.graphics.lineTo(50,100);  
    12.         mc.graphics.endFill();  
    13.     }      
    14. }  </font></font>
    复制代码
    3、在cmd命令中执行

    1. <font color="#333333"><font face="Arial">-swf test.swf
    2. -main Test</font></font>
    复制代码
    即可生成test.swf。也可把这些命令代码保存为hxml扩展名文件,放入类文件所在的文件夹,然后双击运行效果一样。
    注意haxe的代码规范和flash as基本类似,类库也是用的flash中过的,只是有些api无法使用。

    --------------------------------------------华丽的分割线,以下文件为转账--------------------------------------
    Haxe学习笔记(一) Haxe:一次编码全平台编译的神话
    一 Haxe是什么?
    Haxe是开源的,它作为一门语言,基础语法和ActionScript3基本一致。所以任何做过Flash开发的人都可以很快的上手。Haxe最独特的地方在于他的编译器,Haxe的编译器能自动将Haxe代码编译成任何支持的目标语言,并自动输出最终结果。这个过程非常方便,仅需一行参数不多的命令行。
    Haxe这个支持列表非常丰富,C++,JavaScript,Falsh,PHP,C#,Java。加上NME模块的支持的话,还支持iOS,Android,WindowsMobile,WebOS。编译到不同的平台上统统都只需要一句命令行,非常方便。
    我的重点不在介绍,需要了解更多的按顺序阅读以下文章:
    haxe:号称比java还跨平台的语言
    haxe 移动设备跨平台开发
    上帝的玩偶:haXe语言
    如果以上文章不能满足你,请看官网:http://haxe.org

    二缺点Haxe真要用到开发中,我接触的不多没有经验,可以看下wyyayy兄的文章:
    haxe,想说爱你不容易

    三环境搭建Haxe的环境搭建非常简单,仅需一步就可以搭建好Haxe的环境。
    1 下载安装程序
    http://haxe.org/download (官网)
    PS:在Linux下可以直接apt-get安装
    2 选择代码编辑工具
    官方强烈推荐FlashDevlop,这个IDE也是和Haxe结合的最好的,原生支持Haxe,但是只有Window版本。所以我选了一个自己喜欢的文本编辑器。
    参考:http://haxe.org/com/ide(官网)
    3 测试
    打开命令行/终端,打入haxe测试一下。



    到这里为止,Haxe就原生支持的这些目标语言了。

    四使用下Haxe官网上有非常多的入门指引,我这里只拿C++,Flash,Java做测试。文字也会更简单一些,需要详细的介绍可以点下面的连接去看官网教程(英文):
    C++ | Flash | Java
    0 测试代码

    我照着官网的例子制作了一个HelloWorld,并保存做了Test.hx。(注意文件名需要和类名相同)


    1. class Test {  
    2.     static function main() {  
    3.         trace("Hello World !");  
    4.     }  
    复制代码
    1 C++

    编译C++需要用到一个叫做hxcpp的模块,如何安装模块呢?非常方便的有haxelib这个指令,在命令行下执行:
    1. haxelib install hxcpp  
    复制代码
    haxelib命令会自动去haxe的仓库中将hxcpp下载到本机的haxe模块的仓库内,非常方便。
    PS:某些平台上(比如mac),在安装模块之前需要先设置haxe模块的仓库路径:
    1. haxelib setup  
    复制代码
    安装好hxcpp后就可以编译成C++的程序了
    1. haxe -cpp cpp -debug -mian Test  
    复制代码
    解释一下:
    -cpp cpp 指定输出类型为C++,输出到一个叫做cpp的目录下
    -debug 可以让我们看到trace的输出
    -main Test 指定程序的入口,是类名
    执行后可以在cpp目录下找到Test-debug这个输出的二进制文件,执行它:


    第一个平台大功告成了,其他的平台编译过程也是类似的过程。

    2 Flash
    输出为swf是haxe最早支持的功能,它不需要任何其他模块。
    1. haxe -swf test.swf -main Test  
    复制代码
    解释一下:
    -swf test.swf 指定输出类型为flash,输出成一个test.swf文件
    -main Test 指定程序的入口
    找到test.swf用FlashPlayer或者浏览器打开,当然写一个html的模板(官网教程中有),再用浏览器打开。下面是效果:



    需要说明的是Haxe可以支持输出成多个Flash的版本,需要在编译命令中加其他参数。请参考官网教程。

    3 Java
    Java平台没啥特别的,和C++差不多,不过你得自己先安装好JDK。


    1. haxe -java java -main Test
    复制代码

    -java java 指定输出类型为java,输出到一个叫做java的目录下
    -main Test 指定程序的入口
    编译输出结果为java目录下的java.jar,执行指令为:

    1. java -jar java.jar  
    复制代码


    结果:




    看完了3个例子,是不是觉得Haxe非常的方便易用?
    四 NME介绍
    NME是Haxe在互联网进入移动互联网之后的产物,它本身是Haxe的一个模块。随着移动互联网兴起,它的发展速度很快,已经成为了Haxe的重头戏。以至于Haxe也给他创建了一个独立的页面:http://www.haxenme.org
    NME虽然是一个模块,但是它的作用非常之大。NME将Haxe的代码先编译为C++代码,然后将C++代码编译成为目标平台的二进制文件。
    NME另外一个伟大之处在于它给Haxe语言中添加了名叫nme的包(Package),这个包内部包含了非常多的Flash中的同名库。换句话说,熟悉Flash开发的朋友们几乎可以马上开始开发工作。到底NME的库和Flash有多少的相似度?我没有具体使用过,但是这里有API手册(http://www.haxenme.org/api/),真的非常相像。

    五 NME安装
    NME模块有独立的安装包,可以直接下载安装;当然你也可以手动在之前安装的Haxe中安装NME模块。在这篇文章里面我将同时介绍两种方式。另外,windows版本的NME独立安装包内包含了Haxe,为保持系统简洁,可以先把之前的Haxe环境删除。Mac的版本没这个问题。

    1 安装NME
    A 独立安装包(推荐)
    独立的安装包在这里:http://www.haxenme.org/download/ (官网)
    下载适合自己系统的安装包,然后运行安装,过程非常简单。

    B 在之前的Haxe环境下安装
    命令行:

    1. haxelib install nme  
    复制代码
    因为NME的系统还依赖其他一些haxe包,所以也在这里安装以下的包:
    1. haxelib install hxcpp  
    2. haxelib install actuate  
    3. haxelib install swf  
    4. haxelib install svg  
    复制代码
    2 安装配置目标平台

    NME自己并不是全能的编译器,所以它依靠各个不同开发平台下的C++编译器,将自动生成的C++代码编译为目标平台上的执行文件。我们只需要告诉NME我们要将代码编译到哪里去,NME就会自动设置好一切。


    依旧是命令行,编译成Windows程序:


    1. nme setup window  
    复制代码
    编译成Android程序:

    1. nme setup android  
    复制代码
    编译成ios程序:

    1. nme setup iOS  
    复制代码

    等等......各位感觉到Haxe的强大和方便了吧? 不过还是有一些细节需要注意:如果目标平台为Windows,那么会自动找到Visual Studio的编译器。如果你没有安装任何的Visual Studio,那么NME会自动为你下载一个免费的Visual Studio C++ Express。它足够你用了。如果目标平台是ios或者mac,那么会跳到XCode的下载页面(即使你已经安装了XCode)。你很幸运,你可以跳过到下一步了。如果目标平台是android,这就有点麻烦了,你需要安装AndroidSDK,AndroidNDK,Ant,JDK,(Mac系统自带Ant和JDK)。运行nme setup android后,会自动开始下载AndroidSDK,下载完成后自动打开Android SDK Manager工具。这个时候需要手动选择:平台工具,Android2.2(API 8),Extras。
    下载完Android SDK后,会自动下载Android NDK。因为我是Mac系统,跳过了Ant和JDK。如果你已经安装了Android的环境,你可以选择跳过下载后手工输入你的Android SDK和NDK的目录。到这里为止,所有的安装和配置都已经完成了。如果要想看其他平台和更多细节,请详细阅读这个页面:http://www.haxenme.org/documentation/setup/ 如果已经完成了安装,可以了解下NME对硬件的支持和各种特性的支持:http://www.haxenme.org/documentation/devices/http://www.haxenme.org/documentation/features/ 六  编译测试还是那我们的Test.hx来做编译测试吧,我们现在需要一个.NMML文件来配置我们的编译参数。

    1. <?xml version="1.0" encoding="utf-8"?>  
    2. <project>  
    3.   
    4.   <app title="Test App Title" main="Test" package="org.haxenme.tutorial.testapptitle" version="1.0.0" company="NME" />  
    5.    
    6.   <window width="640" height="480" fps="30" orientation="portrait" resizable="true" />  
    7.    
    8.   <set name="BUILD_DIR" value="Export" />  
    9.   <classpath name="." />  
    10.   
    11.   <haxelib name="nme" />  
    12.   
    13.   <!--
    14.   <assets path="Assets" rename="assets" include="*" exclude="nme.svg" />
    15.   -->  
    16.   <ndll name="std" />  
    17.   <ndll name="regexp" />  
    18.   <ndll name="zlib" />  
    19.   <ndll name="nme" haxelib="nme" />  
    20.   <!--
    21.   <icon name="Assets/nme.svg" />
    22.   -->  
    23. </project>  
    复制代码
    因为我没有icon文件,所以只能先注释掉相关的两行,然后就可以编译了:
    iOS模拟器:



    1. nme test sample.nmml ios -simulator  
    复制代码

    经过了漫长的编译等待(仅第一次),如果你成功了,你可以看到iOS模拟器自动打开并运行了输出的程序。(我看到了白屏,当我退出iOS模拟器的时候看到了熟悉的“Test.hx:3: Hello World !”)


    Android:
    1. nme test sample.nmml android  
    复制代码

    经过了漫长的编译等待(仅第一次,比iOS要慢很多),如果你成功了,并且你的手机连接到电脑上,你可以看到你的手机自动打开并运行了输出的程序。(我看到了白屏,同时在终端中看到了熟悉的“Test.hx:3: Hello World !”

    结束语
    在我学习Haxe的过程中,一直为开发者感到惊讶,从头到尾我只用了不到10haxe的指令就完成了搭建环境到可以开发的过程。它的引导功能,自动查找外部工具的功能,都帮助学习者大大缩短学习的过程。它的官网简洁,文字精简突出重点,指引资料很完整。
    这是一个伟大的开源程序!向Haxe的作者们和社区致敬。
    >html5/haXe开发偶感
    1. 使用haXe开发web app可以提高开发效率。
    haXe是一种OO语言,可以使用命名空间、封装、继承、事件等熟悉的技巧来辅助开发,haXe会把它翻译成 javascripthaXe支持强类型,熟悉haXe之后,开发速度会很快。强烈推荐各位试用haXehaXe的简介可以参见我之前的博文:《html5 canvas 版 hello world! 暨haXe简介》和《拥抱haXe之javascript 也玩mvc》。GoogleDart要做的事情,大部分功能,haXe在几年前就已经搞定了。
    整个项目:
    ·所写的javascript代码数量为 70+ 行。
    下面以 Book 为例子,看看haXe会把它翻译成什么样子:

    haXe 代码:

    1. package core;

    2. class Book
    3. {
    4.      public var pages:Array<Page>;
    5.      public var hotlinks:Array<HotLink>;
    6.      public var pageWidth:Float;
    7.      public var pageHeight:Float;
    8.      public var logoUrl:String;
    9.      public var logoHref:String;
    10.      public var bookId:String;
    11.      public var bookTitle:String;

    12.      public function new()
    13.      {
    14.          pages = new Array<Page>();
    15.          hotlinks = new Array<HotLink>();
    16.          bookId = "";
    17.          bookTitle = "";
    18.      }
    19.      
    20.      public function preloadPages(num:Int):Void
    21.      {
    22.          if (num == null) num = 0;
    23.          
    24.          if (num < 0 || num >pages.length -1) return;
    25.          var p:Array<Int> = [];
    26.          p.push(num);
    27.          p.push(num + 1);
    28.          p.push(num - 1);
    29.          p.push(num + 2);
    30.          p.push(num - 2);
    31.          p.push(num + 3);
    32.          p.push(num - 3);
    33.          p.push(num + 4);
    34.          p.push(num + 5);
    35.          for (i in 0 ... p.length)
    36.          {
    37.              var index:Int = p[i];
    38.              if (index >= 0 && index < pages.length)
    39.              {
    40.                  var page:Page = this.pages[index];
    41.                  page.getImagePage();
    42.              }
    43.          }
    44.      }   
    45. }
    复制代码
    Js 代码:

    1. core.Book = function(p) { if( p === $_ ) return; {
    2.      this.pages = new Array();
    3.      this.hotlinks = new Array();
    4.      this.bookId = "";
    5.      this.bookTitle = "";
    6. }}
    7. core.Book.__name__ = ["core","Book"];
    8. core.Book.prototype.pages = null;
    9. core.Book.prototype.hotlinks = null;
    10. core.Book.prototype.pageWidth = null;
    11. core.Book.prototype.pageHeight = null;
    12. core.Book.prototype.logoUrl = null;
    13. core.Book.prototype.logoHref = null;
    14. core.Book.prototype.bookId = null;
    15. core.Book.prototype.bookTitle = null;
    16. core.Book.prototype.preloadPages = function(num) {
    17.      if(num == null) num = 0;
    18.      if(num < 0 || num > this.pages.length - 1) return;
    19.      var p = [];
    20.      p.push(num);
    21.      p.push(num + 1);
    22.      p.push(num - 1);
    23.      p.push(num + 2);
    24.      p.push(num - 2);
    25.      p.push(num + 3);
    26.      p.push(num - 3);
    27.      p.push(num + 4);
    28.      p.push(num + 5);
    29.      {
    30.          var _g1 = 0, _g = p.length;
    31.          while(_g1 < _g) {
    32.              var i = _g1++;
    33.              var index = p[i];
    34.              if(index >= 0 && index < this.pages.length) {
    35.                  var page = this.pages[index];
    36.                  page.getImagePage();
    37.              }
    38.          }
    39.      }
    40. }
    41. core.Book.prototype.__class__ = core.Book;
    复制代码
    js prototype我是一窍不通,但这并不影响用haXejs程序,这个项目过程中,不熟悉js并没有给我带来任何的困难和阻扰。所有的困难和阻扰都来自对html5ioshaXe的不熟悉。下面总结一下使用haXe的好处(haXe的缺点和不足将在后文详述):1)旧有知识可以全部利用上:类、命名空间、继承、重载、默认参数、事件、回调函数、泛型、动态类等都有。此外,还有:宏、内联……;2)由于支持强类型,IDE的提示很不错;同时由于类型检查机制的存在,可以避免大量的错误;3)有时候,所想要的类型没有定义,如果不想定义,可以直接使用动态类,动态类的存在,让和htmljs打交道非常爽;4)强悍的 typedef 机制。碰见哪个类型不支持或者定义不完全,typedef一下就够了2. Canvas APICanvas API,使用中,发现了它的一些坑爹之处。1)兼容性问题。某些操作,可能在桌面的 safari上可以顺利运行,但在ipad上就无法运行。2)性能。Canvas API的性能是惨不忍睹,据说只有IE9中的Canvas是硬件加速的,因此,如果想以传统的帧动画的模式来开发应用,性能表现会非常差。1000×1000像素左右的图,如果用到缩放,在ipad上,目测也就是5-10fps左右。我最开始用的jeash,是一款在Canvas API基础上的Flash模拟,结果只能到1-2fps对于复杂点的应用来说,必须精细的处理Draw API和绘制状态。为了在平板电脑上得到流畅的结果,我自己设计了这样一套绘制机制:绘制的单元是页。每页为一张图像。用 DrawParams 类来描述绘制参数:
    1. class DrawParams
    2. {
    3.      public var sx:Float;
    4.      public var sy:Float;
    5.      public var sw:Float;
    6.      public var sh:Float;
    7.      public var dx:Float;
    8.      public var dy:Float;
    9.      public var dw:Float;
    10.      public var dh:Float;
    11. }
    复制代码
    sx,sy,sw,sh代表在图像中的待绘制区(x,y,width,height)dx,dy,dw,dh代表在Canvas上的绘制区。这个参数就代表把待绘制区的内容绘制到绘制区。每页有图像和该页的绘制参数。BookContext类管理需要绘制的Page和它的绘制参数。当需要绘制时(初始加载,翻页动画……),更新BookContext的内容,更新绘制参数,进行绘制。3. localStorage 非常有用localStorage 对于保持页面间的状态非常有用。比如,当横屏转为竖屏时,当缩放页面时,将先前的状态存入 localStorage ,新页面读取localStorage,更正自己的状态,再把 localStorage 清空。4. 吐槽ipad1)没有双击事件,没办法,用touchstart来模拟,当两次touchstart间隔在300毫秒内,认为是一次双击;2)不能通过jsfocus某个输入框,无解。5. 吐槽haXe1)没有protected2Float,Int是对象,默认值是null!如果不让它是null,必须在构造函数里赋值;3)闭包比较弱,只认局部变量。4)缺乏好的IDE。目前最好用的haXe IDE算是FlashDevelop
    本文来自:http://blog.csdn.net/linguifa/article/details/41115863

    本帖子中包含更多资源

    您需要 登录 才可以下载或查看,没有帐号?立即注册

    x
    守望者AIR技术交流社区(www.airmyth.com)
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    本版积分规则

    
    关闭

    站长推荐上一条 /4 下一条

    QQ|手机版|Archiver|网站地图|小黑屋|守望者 ( 京ICP备14061876号

    GMT+8, 2019-11-18 17:40 , Processed in 0.050976 second(s), 34 queries .

    守望者AIR

    守望者AIR技术交流社区

    本站成立于 2014年12月31日

    快速回复 返回顶部 返回列表