标签：
下了Flixel都有大半年了，也是时候写点东西了。
这是Flixel的ActionScript3.0版本。作为一个光荣的墙国子民，能找到的资料也太少了。还是英文版，多少有点不高兴。还是自己写写吧。
还有一件事，现在才开始研究，是不是有点晚了？个人感觉ActionScript或者说Flash的衰落已经是一个事实了。
一开始要做什么呢？当然是显示一下文字啦。
看到Flixel里有一个FlxText类，构造函数里还是有Test:String的参数的，果断就是它了。
1 var text:FlxText = new FlxText(30, 30, 100, "Hello Flixel."); 2 this.addChild(text);
然后，就是呵呵了。问题居然是出在addChild上，一看FlxText的代码，它居然不是显示对象。。。还是老老实实地看别人的示例吧。
使用Flixel，第一步就是要建立FlxGame的示例。说白了，FlxGame相当于Flixel的文档类。当然，要构建FlxGame的实例就要有一个FlxState的子类作为它的构造函数的参数，不过其实直接放FlxState也是可以的。
当然，不要改别人的代码吧。我参照着别人的示例，写一个MenuState类继承FlxState类，作为参数传入FlxGame的构造函数里。看看FlxState的代码，就是一个空的函数，create():void。你可以在FlxG里面发现一个switchState(State:FlxState):void，然并卵，代码埋得太深，不知所云。不过看名字就知道，以后要变换状态就是它了。
文档类：
1 package 2 { 3 import flash.display.Sprite; 4 import flash.events.Event; 5 6 import org.flixel.FlxGame; 7 import org.MenuState; 8 9 /** 10 * ... 11 * @author QuanJP quanjp1996@gmail.com 12 */ 13 public class Main extends Sprite 14 { 15 16 public var gameMain:FlxGame; 17 18 public function Main() 19 { 20 if (stage) init(); 21 else addEventListener(Event.ADDED_TO_STAGE, init); 22 } 23 24 private function init(e:Event = null):void 25 { 26 removeEventListener(Event.ADDED_TO_STAGE, init); 27 // entry point 28 29 gameMain = new FlxGame(800, 600,MenuState); 30 this.addChild(gameMain); 31 32 } 33 34 } 35 36 }
然后是放在org文件夹下的MenuState类：
1 package org 2 { 3 import org.flixel.FlxState; 4 import org.flixel.FlxText; 5 6 /** 7 * ... 8 * @author QuanJP quanjp1996@gmail.com 9 */ 10 public class MenuState extends FlxState 11 { 12 13 public function MenuState() 14 { 15 16 } 17 18 override public function create():void 19 { 20 super.create(); 21 var txt:FlxText = new FlxText(100, 200, 100, "Hello Flixel."); 22 this.add(txt); 23 } 24 25 } 26 27 }
好了，终于显示出来了。随便提醒一句，那些抄袭的，记得把FlashDevelop自动帮我加的注释删掉啊，么么哒。
然后就是尝试使用FlxButton类，这个类也是代码比较好看懂的。在此之前，先参照前面MenuState创建一个GameState。名字？随便取的啦。真的不知道叫什么好啦。完全复制MenuState的代码，再改改显示的内容，比如改成"Hi Flixel."。然后，回到MenuState，改改代码。
1 override public function create():void 2 { 3 super.create(); 4 var txt:FlxText = new FlxText(100, 200, 100, "Hello Flixel."); 5 this.add(txt); 6 7 var btn:FlxButton = new FlxButton(200,200,"Say Hi.",sayHi); 8 this.add(btn); 9 } 10 11 public function sayHi():Boolean { 12 FlxG.switchState(new GameState()); 13 return true; 14 }
让鼠标出来吧。在Main.as中，把FlxGame的构造函数最后一项测试设为true：
1 private function init(e:Event = null):void 2 { 3 removeEventListener(Event.ADDED_TO_STAGE, init); 4 // entry point 5 6 gameMain = new FlxGame(800, 600,MenuState,1,60,30,true); 7 this.addChild(gameMain); 8 9 }
好了，可以实现状态之间的跳转了，不过在GameState后就没有状态变换了？唉，再次拷贝MenuState的代码吧。
然后，实现中文。理论上是直接可以的，可是，Flixel的FlxTest默认是使用内置字体的，见其构造函数最后一个参数。虽然我不主张改Flixel的代码，可这个地方真的不能忍啊，也是改了，还有改掉字体大小，这样比较适合显示中文。
1 public function FlxText(X:Number, Y:Number, Width:uint, Text:String=null, EmbeddedFont:Boolean=false) 2 { 3 super(X,Y); 4 makeGraphic(Width,1,0); 5 6 if(Text == null) 7 Text = ""; 8 _textField = new TextField(); 9 _textField.width = Width; 10 _textField.embedFonts = EmbeddedFont; 11 _textField.selectable = false; 12 _textField.sharpness = 100; 13 _textField.multiline = true; 14 _textField.wordWrap = true; 15 _textField.text = Text; 16 var format:TextFormat = new TextFormat("system",22,0xffffff); 17 _textField.defaultTextFormat = format; 18 _textField.setTextFormat(format); 19 if(Text.length <= 0) 20 _textField.height = 1; 21 else 22 _textField.height = 10; 23 24 _regen = true; 25 _shadow = 0; 26 allowCollisions = NONE; 27 calcFrame(); 28 }
改了黄色部分，终于可以看得入眼了。如果你喜欢，可以改一下在org\flixel\data文件夹下的button.png，我以后再改吧。
最终的代码可以看看https://github.com/quanjp/LearningFlixel/tree/master/001helloFlixel，里面没有Flixel本身的代码，Flixel的版本应该是2.55。
标签：
原文地址：http://www.cnblogs.com/quanjp/p/5551244.html
