// Progression4で、メニューが5個あるwebサイトの簡単なサンプルを作成しました // 参考 // http://wonderfl.net/code/dd0c34e42c13ed26f2252a69809c79e47709980a // http://wonderfl.net/code/7e242b3283f68af7e4b4f7e9b9819fad9733aecf package { import flash.display.*; import jp.progression.config.*; import jp.progression.debug.*; import jp.progression.*; public class Index extends Sprite { public var manager:Progression; public function Index() { Progression.initialize( new BasicAppConfig() ); manager = new Progression( "index", stage, IndexScene ); Debugger.addTarget( manager ); manager.goto( manager.root.sceneId ); } } } import flash.net.*; import flash.system.*; import flash.display.Sprite; import flash.text.*; import jp.progression.casts.*; import jp.progression.casts.buttons.*; import jp.progression.commands.display.*; import jp.progression.commands.lists.*; import jp.progression.commands.net.*; import jp.progression.commands.tweens.*; import jp.progression.commands.managers.Goto; import jp.progression.commands.*; import jp.progression.data.*; import jp.progression.events.*; import jp.progression.scenes.*; import jp.progression.executors.ExecutorObjectState; import flash.display.Bitmap; import flash.display.BitmapData; import flash.events.MouseEvent; import caurina.transitions.Tweener; import caurina.transitions.properties.*; import caurina.transitions.properties.FilterShortcuts; FilterShortcuts.init(); import caurina.transitions.properties.ColorShortcuts; ColorShortcuts.init(); class IndexScene extends SceneObject { private var page1:SceneObject; private var page2:SceneObject; private var page3:SceneObject; private var page4:SceneObject; private var page5:SceneObject; public function IndexScene() { // シーン1を作成 page1 = addScene(new SceneObject("page1")); page1.onSceneInit = function():void { var r:Resource = getResourceById("http://assets.wonderfl.net/images/related_images/0/00/0080/0080cd61d25c2bad87d11c67f3b2e6272be1a9f7"); var photo1:Bitmap = new Bitmap( r.toBitmapData() ); photo1.alpha = 0; photo1.x = -466; photo1.name = "photo1"; Tweener.addTween(photo1, {_Blur_blurX:50, _Blur_blurY:0, time:0}); Tweener.updateTime(); Tweener.addTween(photo1, {_Blur_blurX:0, _Blur_blurY:0, time:2.4}); this.addCommand( new AddChildAt(container, photo1, 0), [ new DoTweener(photo1, { alpha:1, time:2 } ), new DoTweener(photo1, { x:0, time:2 } ) ] ) }; page1.onSceneUnload = function():void { var photo1:Bitmap = Bitmap(container.getChildByName("photo1")); Tweener.addTween(photo1, {x: 466, time:2, delay:0, transition: "liner", onCompleteParams:[this],onComplete: function(obj:*):void{ var com:Command = new RemoveChildByName(container, "photo1"); com.execute(); }}); }; // シーン2を作成 page2 = addScene(new SceneObject("page2")); page2.onSceneInit = function():void { var r:Resource = getResourceById("http://assets.wonderfl.net/images/related_images/c/c1/c1b9/c1b9744d910cc38c08a7fe64b81d6c1dc84a2511"); var photo2:Bitmap = new Bitmap( r.toBitmapData() ); photo2.alpha = 0; photo2.x = -466; photo2.name = "photo2"; Tweener.addTween(photo2, {_Blur_blurX:50, _Blur_blurY:0, _Blur_quality:3, time:0}); Tweener.updateTime(); Tweener.addTween(photo2, {_Blur_blurX:0, _Blur_blurY:0, _Blur_quality:3, time:2.4}); this.addCommand( new AddChildAt(container, photo2, 0), [ new DoTweener(photo2, { alpha:1, time:2 } ), new DoTweener(photo2, { x:0, time:2 } ) ] ) }; page2.onSceneUnload = function():void { var photo2:Bitmap = Bitmap(container.getChildByName("photo2")); Tweener.addTween(photo2, {x: 466, time:2, delay:0, transition: "liner", onCompleteParams:[this],onComplete: function(obj:*):void{ var com:Command = new RemoveChildByName(container, "photo2"); com.execute(); }}); }; // シーン3を作成 page3 = addScene(new SceneObject("page3")); page3.onSceneInit = function():void { var r:Resource = getResourceById("http://assets.wonderfl.net/images/related_images/c/c6/c614/c6140b8a6ad34ce9abaf859e889eae4cb8a4cc74"); var photo3:Bitmap = new Bitmap( r.toBitmapData() ); photo3.alpha = 0; photo3.x = -466; photo3.name = "photo3"; Tweener.addTween(photo3, {_Blur_blurX:50, _Blur_blurY:0, time:0}); Tweener.updateTime(); Tweener.addTween(photo3, {_Blur_blurX:0, _Blur_blurY:0, time:2.4}); this.addCommand( new AddChildAt(container, photo3, 0), [ new DoTweener(photo3, { alpha:1, time:2 } ), new DoTweener(photo3, { x:0, time:2 } ) ] ) }; page3.onSceneUnload = function():void { var photo3:Bitmap = Bitmap(container.getChildByName("photo3")); Tweener.addTween(photo3, {x: 466, time:2, delay:0, transition: "liner", onCompleteParams:[this],onComplete: function(obj:*):void{ var com:Command = new RemoveChildByName(container, "photo3"); com.execute(); }}); }; // シーン4を作成 page4 = addScene(new SceneObject("page4")); page4.onSceneInit = function():void { var r:Resource = getResourceById("http://assets.wonderfl.net/images/related_images/b/b1/b1e5/b1e5ce9134fcb0651277a8198c62ce2a256772a5"); var photo4:Bitmap = new Bitmap( r.toBitmapData() ); photo4.alpha = 0; photo4.x = -466; photo4.name = "photo4"; Tweener.addTween(photo4, {_Blur_blurX:50, _Blur_blurY:0, time:0}); Tweener.updateTime(); Tweener.addTween(photo4, {_Blur_blurX:0, _Blur_blurY:0, time:2.4}); this.addCommand( new AddChildAt(container, photo4, 0), [ new DoTweener(photo4, { alpha:1, time:2 } ), new DoTweener(photo4, { x:0, time:2 } ) ] ) }; page4.onSceneUnload = function():void { var photo4:Bitmap = Bitmap(container.getChildByName("photo4")); Tweener.addTween(photo4, {x: 466, time:2, delay:0, transition: "liner", onCompleteParams:[this],onComplete: function(obj:*):void{ var com:Command = new RemoveChildByName(container, "photo4"); com.execute(); }}); }; // シーン5を作成 page5 = addScene(new SceneObject("page5")); page5.onSceneInit = function():void { var r:Resource = getResourceById("http://assets.wonderfl.net/images/related_images/b/bd/bdfd/bdfdb54754514904bddd9dd4e5079a3bf81511fc"); var photo5:Bitmap = new Bitmap( r.toBitmapData() ); photo5.alpha = 0; photo5.x = -466; photo5.name = "photo5"; Tweener.addTween(photo5, {_Blur_blurX:50, _Blur_blurY:0, time:0}); Tweener.updateTime(); Tweener.addTween(photo5, {_Blur_blurX:0, _Blur_blurY:0, time:2.4}); this.addCommand( new AddChildAt(container, photo5, 0), [ new DoTweener(photo5, { alpha:1, time:2 } ), new DoTweener(photo5, { x:0, time:2 } ) ] ) }; page5.onSceneUnload = function():void { var photo5:Bitmap = Bitmap(container.getChildByName("photo5")); Tweener.addTween(photo5, {x: 466, time:2, delay:0, transition: "liner", onCompleteParams:[this],onComplete: function(obj:*):void{ var com:Command = new RemoveChildByName(container, "photo5"); com.execute(); }}); }; } protected override function atSceneLoad():void { //manager.root.stage.addEventListener(MouseEvent.CLICK, clickHandler); // メニューボタンの作成 var context:LoaderContext = new LoaderContext(true); var sceneChangeButton1:SceneChangeButton = new SceneChangeButton("1", { x:40, y:5 } ); var sceneChangeButton2:SceneChangeButton = new SceneChangeButton("2", { x:120, y:5 } ); var sceneChangeButton3:SceneChangeButton = new SceneChangeButton("3", { x:200, y:5 } ); var sceneChangeButton4:SceneChangeButton = new SceneChangeButton("4", { x:280, y:5 } ); var sceneChangeButton5:SceneChangeButton = new SceneChangeButton("5", { x:360, y:5 } ); // ボタンを押したときの移動先のシーンを設定 sceneChangeButton1.sceneId = page1.sceneId; sceneChangeButton2.sceneId = page2.sceneId; sceneChangeButton3.sceneId = page3.sceneId; sceneChangeButton4.sceneId = page4.sceneId; sceneChangeButton5.sceneId = page5.sceneId; // メニューのボックスを作成 var buttonBox:ButtonBox = new ButtonBox(); // 各シーンで利用する画像を事前に読み込み、ボタンをボックスに配置して、ボックスを表示 addCommand( new LoaderList(null, new LoadBitmapData(new URLRequest("http://assets.wonderfl.net/images/related_images/0/00/0080/0080cd61d25c2bad87d11c67f3b2e6272be1a9f7"), { group:"photos" , cacheAsResource:true, context:context } ), new LoadBitmapData(new URLRequest("http://assets.wonderfl.net/images/related_images/c/c1/c1b9/c1b9744d910cc38c08a7fe64b81d6c1dc84a2511"), { group:"photos", cacheAsResource:true, context:context } ), new LoadBitmapData(new URLRequest("http://assets.wonderfl.net/images/related_images/c/c6/c614/c6140b8a6ad34ce9abaf859e889eae4cb8a4cc74"), { group:"photos" , cacheAsResource:true, context:context } ), new LoadBitmapData(new URLRequest("http://assets.wonderfl.net/images/related_images/b/b1/b1e5/b1e5ce9134fcb0651277a8198c62ce2a256772a5"), { group:"photos", cacheAsResource:true, context:context } ), new LoadBitmapData(new URLRequest("http://assets.wonderfl.net/images/related_images/b/bd/bdfd/bdfdb54754514904bddd9dd4e5079a3bf81511fc"), { group:"photos", cacheAsResource:true, context:context } ), [ new AddChild(buttonBox, sceneChangeButton1), new AddChild(buttonBox, sceneChangeButton2), new AddChild(buttonBox, sceneChangeButton3), new AddChild(buttonBox, sceneChangeButton4), new AddChild(buttonBox, sceneChangeButton5) ], new Prop(buttonBox, { y:400 } ), new AddChildAt(container, buttonBox, 0) )); } // 最初に表示したいシーンに移動 protected override function atSceneInit():void { addCommand( new Goto(getSceneAt(0).sceneId) // new Goto(new SceneId("/index/page1")) ); } } // メニューの背景のボックス class ButtonBox extends CastSprite { public function ButtonBox(initObject:Object = null) { super(initObject); graphics.lineStyle(0, 0x000000); graphics.beginFill(0x000000, 0.3); graphics.drawRect(0, 0, 565, 40); graphics.endFill(); } } // メニューのボタン class SceneChangeButton extends CastButton { public function SceneChangeButton(mes:String = "?",initObject:Object = null) { super(initObject); buttonMode = true; useHandCursor = true; //name = "btn" + mes; // 枠を表示 graphics.lineStyle(1, 0x000000); graphics.beginFill(0xffffff, 0.3); graphics.drawRect(0, 0, 50, 30); graphics.endFill(); // 文字を表示 var tf:TextField = addChild( new TextField() ) as TextField; tf.defaultTextFormat = new TextFormat("Verdana", 18, 0xffffff); tf.text = mes; tf.autoSize = TextFieldAutoSize.LEFT; tf.selectable = false; tf.x = 17; tf.y = 2; // シーンが変わった時にボタンを選択状態にしたいのでイベントを設定 super.addEventListener( CastMouseEvent.CAST_STATE_CHANGE, _castStateChange2, false, 0, true ); // super.addEventListener( CastMouseEvent.CAST_NAVIGATE_BEFORE, _castStateChange2, false, 0, true ); } // シーンが変わった時にボタンの状態を変更 private function _castStateChange2( e:CastMouseEvent ):void { switch ( state ) { case 0 : { this.visible = true; break; } case 1 : { this.visible = false; break; } case 2 : { Tweener.addTween(this, {_tintBrightness :0.8, time:0.2, delay:0, transition: "linear"}); break; } case 3 : case 4 : { Tweener.addTween(this, {_tintBrightness :0, time:0.2, delay:0, transition: "linear"}); break; } default : { } } } // ボタンがロールオーバされた時の表示切り替え protected override function atCastRollOver():void{ Tweener.addTween(this, {_tintBrightness :0.8, time:0.2, delay:0, transition: "linear"}); } // ボタンがロールアウトされた時の表示切り替え protected override function atCastRollOut():void{ // stateが2なら処理をしない if(state != 2) Tweener.addTween(this, {_tintBrightness :0, time:0.2, delay:0, transition: "linear"}); } } Progression4 メニュー5個のサイトの簡単なサンプル