修改launcher/egret_loader.js
1: egret.StageDelegate.getInstance().setDesignSize(document.body.clientWidth, Math.max(document.body.clientHeight,window.innerHeight));
2: context.stage = new egret.Stage();
3: var scaleMode = egret.MainContext.deviceType == egret.MainContext.DEVICE_MOBILE ? egret.StageScaleMode.SHOW_ALL : egret.StageScaleMode.NO_SCALE;
4: context.stage.scaleMode = scaleMode;Egret 可以在專案中結合各式各樣的第三方javascript lib,目前先介紹對該lib有提供TSD的部份
PureMVC 算是Flash Developer都還蠻熟悉的一個MVC Framework
官方文件也有做了一個教學,如何使用第三方javascript lib,基於按照官方的教學,讓我摸索了一段時間,我這邊做個步驟整理以便以後若遇到問題時,可再次按圖操作
這個記錄我使用EgretVS新建出來的GUI專案來說明
新增專案完成後,在專案目前增加如下檔案
puremvc的TSD及JS檔案請至 github 下載
puremvc.json這個檔案,請自行增加,內容如下,source節點請依個人喜好填入
1: {2: "name": "puremvc",
3: "source":"src/puremvc/",
4: "file_list": [
5: "puremvc-typescript-standard-1.0.js",
6: "puremvc-typescript-standard-1.0.d.ts"
7: ] 8: }接著要修改egretProperties.json,把puremvc這個新增的module加入
完成後執行一下build engine
build完後,在libs目錄下即會出現 puremvc的參照
在src下新增一個Facade
程式如下:
1: module leon456 { 2: export class ApplicationFacade extends puremvc.Facade implements puremvc.IFacade { 3: public constructor() {4: super();
5: console.log('ApplicationFacade');
6: } 7: 8: 9: public static getInstance(): ApplicationFacade {10: if (this.instance == null) this.instance = new ApplicationFacade();
11: return <ApplicationFacade><any> (this.instance);
12: } 13: } 14: } 並在 Main.ts最下方增一行,叫一下Facade初始化(singleton)
再執行一下build engine,及build
執行一下程式 Ctrl+F5
若未發現任何報錯,即己加載PureMVC至Egret專案成功
其它關於PureMVC該如何拼湊結構,可參考 github上 2048Egret 這個專案來學習,接下來只記錄在使用PureMVC時在typescript會發生的一些注意事項及跟使用actionscript3版本時不太一樣的地方
1: module live { 2: export class BettingAreaMediator extends puremvc.Mediator implements puremvc.IMediator{3: public static NAME: string = "BettingAreaMediator";
4: public constructor(viewComponent: any) {
5: super(BettingAreaMediator.NAME, viewComponent);
6: console.log("BettingAreaMediator", "constructor");
7: 8: console.log("BettingAreaMediator", "bankerBetButton = ", this.view);
9: 10: 11: this.view.bankerBetButton.addEventListener(egret.TouchEvent.TOUCH_TAP, this.addBet, this.view);
12: this.view.playerBetButton.addEventListener(egret.TouchEvent.TOUCH_TAP, this.addBet, this.view);
13: }
14: 15: 16: public listNotificationInterests(): Array<;any> {
17: return [];
18: }
19: 20: public handleNotification(notification: puremvc.INotification): void { 21: } 22: 23: public get view(): live.BettingArea { //前面要加 get 關鍵字24: return <live.BettingArea><any> (this.viewComponent);
25: } 26: 27: private addBet(e: egret.TouchEvent): void {28: console.log("BettingAreaMediator","addBet");
29: }
30: 31: 32: private clearBet(e: egret.TouchEvent): void { 33: } 34: 35: private confirmBet(e: egret.TouchEvent): void { 36: } 37: } 38: }
目前先這樣,後續有發現需要注意處,請做增加
Two model as below
group.rb
1: class Group < ActiveRecord::Base
2: has_many :posts3: validates :title,:presence => true
4: endpost.rb
1: class Post < ActiveRecord::Base
2: belongs_to :group 3: endIn view/group/index.json.jbuilder
1: json.groups (@groups) do |group|
2: json.extract! group, :id, :title, :description3: json.posts (group.posts) do |post|
4: json.extract! post, :id,:comtent 5: end 6: endSo input url on browser,we will get
1: {2: "groups":[
3: {4: "id":1,
5: "title":"First",
6: "description":"Testtest",
7: "posts":[
8: {9: "id":1,
10: "comtent":"good"
11: }, 12: {13: "id":2,
14: "comtent":"test2"
15: }, 16: {17: "id":3,
18: "comtent":"test4"
19: } 20: ] 21: } 22: ] 23: }
