

P2Pについて色々と調べている中で、UnityとFlashについて一旦テストで実験までしてみたので、忘れても良いようにメモを残しておきます。

なお、「P2P通信すること」だけが目的だったため、Unityのゲームエンジンとしてのオブジェクトの同期処理等は調べていないためその辺りの説明は省いています。


## 目次

- [Unity（UnityScript）でのP2P](#unity-head)
- [Flash（AIR for iOS/Android）でのP2P](#flash-head)


## <a name="unity-head">Unity（UnityScript）でのP2P</a>

NetWorkViewsというコンポーネントが提供されているので、そちらを利用すると容易に実装する事が可能です。

詳しくドキュメントは読んでいませんが、実行した端末の内1台をホストとして用い、他の端末をホスト端末のIP/ポートに接続することで実現するようです。

### ホストとして接続

まずはネットワーク内の1台をホストとして接続させます。

```javascript
var port:int = 65535;
Network.InitializeServer( 10, port, false );
```

### ホストに接続

他の端末はホストに接続しているIPとポートに接続します。

```javascript
var ip:String = '192.168.***.***';
var port:int  = 65535;
Network.Connect( ip, port );
```

### コールバック

接続完了、切断など、それぞれの処理時のコールバック関数が用意されています。

```javascript
private function OnDisconnectedFromServer()
{
    // サーバから切断
}

private function OnPlayerDisconnected( pl: NetworkPlayer )
{
    // 他のプレイヤーが切断
}

private function OnServerInitialized()
{
    // サーバ初期化完了
    // Network.InitializeServer完了
}

private function OnConnectedToServer()
{
    // サーバに接続
    // Network.Connect完了
}

private function OnFailedToConnect()
{
    // 接続失敗
}
```

### データ通信

端末同士で通信をする際は、RPCを用いて別端末のメソッドに引数を渡してコールすることで実現します。  
 また、RPCで実行する関数には、「**@RPC**」（C#だと「**[RPC]**」）とラベリングする必要があります。

```javascript
private var nView: NetworkView;

// データ送信
public function sendMessage( msg: String )
{
    nView.RPC( 'fugaFunctions', RPCMode.ALL, msg );
}

// データ受信
@RPC
private function fugaFunctions( msg ) {
    Debug.Log( msg );
}
```

また、RPCに渡せる引数の型は、「int, float, string, NetworkPlayer, NetworkViewID, Vector3, Quaternion」の内のいずれかで、一度に渡せるデータ量は4KB以内であること、という制限があります。


## <a name="flash-head">Flash（AIR for iOS/Android）でのP2P</a>

Flashには、Adobe社が開発しているRTMFPを活用したP2P通信が可能となっています。Unityとは異なりホストを用意する必要がなく、ネットワーク自体に名前を付け、「同じ名前のネットワークに接続している端末」にデータを通信することが可能です。

また、以降のサンプルコードにはimportの表記を抜いていますので、ご利用の際は必要な内容を追記下さい。

### Adobe Cirrusに接続する

この辺り詳しくは調べていないのですが、Adobe Cirrus（以前はAdobe Stratus？）にピア同士を接続する仲介を頑張ってもらいます。  
 その際に開発者キーが必要となりますので、[Adobeのサイトから取得](https://www.rtmfp.net/cgi-bin/cirrusdevkey)します。（Adobe IDが必要となります）

```javascript
private const SERVER:String = 'rtmfp://p2p.rtmfp.net';
private const DEVKEY:String = '開発者キー';
    
var _connect:NetConnection;

// Cirrusに接続開始
private function doConnect():void
{
    _connect = new NetConnection();
    _connect.addEventListener( NetStatusEvent.NET_STATUS, _netStatusHandler );
    _connect.connect( SERVER, DEVKEY );
}

private function _netStatusHandler( e:NetStatusEvent ):void
{
    switch( e.info.code ) {
    	case 'NetConnection.Connect.Success':
    	    trace( '接続成功' );
    	    break;
    }
}
```

connectの第一引数にnullや「rtmfp:」だけを入力する場合もあるそうですが、違いについては詳しく調べていません。また調査してみます。

### ネットワークに接続する

Cirrusに接続ができたらネットワークに接続します。  
 この時にネットワークに名前を付けることで、ローカルネットワーク全体が対象、という訳ではなく特定の端末と接続出来るようになります。（com.example.application というようなドメイン+アプリケーション名で付けるのが分かりやすく、一般的らしい）

その他、GroupSpecifierクラスの属性がネットワークの仕様となり、一度ネットワークに接続すると途中で変更することが出来ないのでご注意下さい。（[それぞれの属性についてはコチラを参照ください](http://help.adobe.com/ja_JP/FlashPlatform/reference/actionscript/3/flash/net/GroupSpecifier.html)）  
 今回はメッセージのやり取りを行えるように「**postingEnabled**」と「<string>serverChannelEnabled</string>」をtrueにしておきます。

```javascript
// _netStatusHandler以外の前述の例
    
var _groups:NetGroup,
    _groupspec:GroupSpecifier;

// ネットワークに接続開始
private function onConnect():void
{
    _groupspec = new GroupSpecifier( 'ネットワーク名' );
    _groupspec.postingEnabled = true;
    _groupspec.serverChannelEnabled = true;
    
    // NetGroupには、Cirrusに接続したNetConnectionとGroupSpecifierの文字列化したデータを渡す
    _groups = new NetGroup( _connect, _groupspec.toString() );
    _groups.addEventListener( NetStatusEvent.NET_STATUS, _netStatusHandler );
}

// 前述の例に追記してます
private function _netStatusHandler( e:NetStatusEvent ):void
{
    switch( e.info.code ) {
    	case 'NetConnection.Connect.Success':
    	    trace( '接続成功' );
    	    onConnect();
    	    break;
    	case 'NetGroup.Connect.Success':
            trace( 'ネットワークに接続成功' );
            break;
        case 'NetGroup.Neighbor.Connect':
            trace( '同じネットワークに別の端末が接続' );
            break;
    }
}
```

### データ通信

データの送信はNetGroupのpostメソッドを呼ぶだけですが、前述のとおりpostingEnabledがtrueになっていないと利用することは出来ません。

受け手側はNetStatusEvent.NET_STATUSが呼ばれるので、「NetGroup.Posting.Notify」というコードで判別して処理します。  
 また、同じデータをpostしようとすると送信する前に自動的に破棄してしまうので、シーケンス番号を付与しておいた方が良いようです。

```javascript
// _netStatusHandler以外の前述の例

// シーケンス番号
private var _ID:int = 0;

// データ送信
private function sendMessage( msg: String ):void
{
    var message = new Object();
    message.ID  = _ID ++;
    message.msg = msg;
    message.sender = _connect.nearID;
    
    _groups.post( message );
}

// データ受信
private function onGetMessage( message: Object ):void
{
    trace( message.msg );
}

// 前述の例にさらに追記してます
private function _netStatusHandler( e:NetStatusEvent ):void
{
    switch( e.info.code ) {
    	case 'NetConnection.Connect.Success':
    	    trace( '接続成功' );
    	    onConnect();
    	    break;
    	case 'NetGroup.Connect.Success':
            trace( 'ネットワークに接続成功' );
            break;
        case 'NetGroup.Neighbor.Connect':
            trace( '同じネットワークに別の端末が接続' );
            break;
        case 'NetGroup.Posting.Notify':
            onGetMessage( e.info.message );
            break;
    }
}
```

また、Flashの場合も送信できる型に制限があり、「Object,int,Number,String」のいずれかである必要があります。（制限サイズは分かりませんが結構大きなデータも一気に送信できていました）


## 雑感

まだ接続してメッセージ送る程度の内容なので、もっと便利な仕組みがあるはずですが、それぞれに一長一短がありそうですね。  
 実際にAndroidまでは同期しているコトを確認出来て、面白そうな事が出来そうで楽しく実験できました。  
 もうちょっと試してみて今回必要な仕組みに最適なモノを活用していきたいと思います。


## 参考

### Unity

- [Unity NetworkViewでシンプルChatを作ってみる : ブリブサー開発戦線　〜僕らはあの戦いを忘れない〜](http://blog.livedoor.jp/bribser_dev/archives/3628336.html)
- [Unity – マニュアル: ネットワーク リファレンス ガイド](http://docs.unity3d.com/ja/current/Manual/NetworkReferenceGuide.html)

### Flash

- [RTMFP 上の 1 対 1 ストリーミング （NetConnection 編） – akihiro kamijo](http://cuaoar.jp/2010/03/rtmfp-1-1.html)
- [RTMFP 上の 1 対 1 ストリーミング （NetStream 編） – akihiro kamijo](http://cuaoar.jp/2010/03/rtmfp-1-1-netstream.html)
- [RTMFP ストリームのアクセス制御 – akihiro kamijo](http://cuaoar.jp/2010/03/rtmfp.html)
- [NetConnection – Adobe ActionScript® 3（AS3 ）API リファレンス](http://help.adobe.com/ja_JP/FlashPlatform/reference/actionscript/3/flash/net/NetConnection.html)

Unity（UnityScript）とFlash（AIR for iOS/Android）のP2Pについて調べたのでメモ



とある案件でFlash Lite 1.1を触っていまして、少しでもややこしい動きをさせようとすると「そんなこと出来ませんよ」って言われながら、色々と試行錯誤をしていました。

その中で、容量を減らすために通常のFlashでは非同期的に素材を読み込んだりすると思うんですが「そんなこと出来ませんよ」と言われたので、PHPでswf内の変数や画像を書き換える事が出来る、と以前聞いたことがあったを思い出しながら挑戦してみました。


## swfをPHPで操作するライブラリ

swfをPHPで操作するライブラリは「[swfmill](http://swfmill.org/)」「[SWFEditor](http://sourceforge.jp/projects/swfed/)」「[Ming](http://php.net/manual/ja/ref.ming.php)」という様なライブラリがあるそうなのですが、今回実装したかったのは、「変数の挿入・置換」「特定の画像の差し替え」の2つだけだったので、[参考サイト](http://tech.kayac.com/archive/generate_flashlite_var1.html)で紹介されていた「[Media_SWF](https://github.com/ken39arg/Media_SWF)」を利用することにしました。


## Media_SWFをいじる

<dl>
<dt>変数挿入メソッド追加</dt>
<dd>Media_SWFを見てみると、「変数の値を置換する」処理は存在していたのですが、「変数を挿入する」処理はありませんでした。
本来的には置換だけで良いかと思うんですが、<del>変数定義し忘れて後から挿入するものぐさな事が出来なかったので</del>念のために追加しました。</dd>
<dt>入力補助クラスの追加（簡略化）</dt>
<dd>同じswfを触るのに新しいクラス定義したりする処理が個人的に過ぎじゃなかったのと、複雑な処理をするつもりはなかったので、簡単な変数を与えるだけで処理するクラスを用意してみました。
やれることが少ない分、簡単に利用できるようになっていると思います。</dd>
<dt>その他諸々</dt>
<dd>その他、「[FlashForward](http://ken39arg.github.io/FlashForward/)」というFlashLite 1.1をSVGアニメーションに変換させるライブラリがMedia_SWFを色々と最適化させているようだったので、サクッと気づいた部分だけ踏襲させて頂きました。</dd>
</dl>

### ダウンロード

[GitHubに公開しています](https://github.com/sushat4692/Media_SWF)


## 使い方

### はじめに

読み込むファイルは一つのみです。その他のファイルはそこから読み込みます。
使っていないファイルも読み込んでしまうので、パフォーマンス的にはイマイチかもしれませんが…。

```php
require_once( 'path/to/SwfWrapHelper.php' );
```

まず、書き換えたいswfを入力補助クラスに渡します。

```php
$swf = new SwfWrapHelper( 'path/to/movie.swf' );
```

単純にswfを書き換えたデータを取得したいだけの場合は、

```php
$content = $swf->build();
```

そのまま表示まで行う場合は、

```php
$swf->view();
```

のように書きます。
「view」の場合は、「build」も一緒に実行しますので、「build」->「view」のように実行する必要はありません。

### 変数を挿入する

読み込んだswfの「1フレーム目の先頭」に変数を挿入するメソッドです。もし、既に1フレーム目に同名の変数が存在する場合は値を書き換えます、たぶん。（試してませんが）

```php
$swf->set_master_var( 'key', 'var' );
```

変数名「key」に「var」という値が入ります。

また、一気に値を追加したい場合は、

```php
$vars = array(
	'hoge' => 'fuga',
	'foo' => 'bar'
);
$swf->set_master_var_array( $vars );
```

というメソッドも用意してあります。

### 画像を差し替える

swf内で利用されている画像を差し替える際に、利用している各画像のIDを渡します。ですが、このIDを何処で調べることが出来るのか良く分かっていません。
 タイムライン上に出現する順番にIDが割り振られているんじゃないかと思うんですが…。調べる方法を見つけたら追記します。

実際の書き方はこんな感じです。

```php
// $id = swf内の画像ID
$swf->replace_image( $id, 'path/to/image.jpg' );
```

画像形式はJPG、PNG、GIFに対応していて、拡張子で判別しています。
逆に言うと拡張子でしか判別していないので、動的に画像データを渡す際は気をつける必要があります。

### 一連の記述例

```php
<?php
require_once( 'path/to/SwfWrapHelper.php' );

// swfファイルの読み込み
$swf = new SwfWrapHelper( 'path/to/movie.swf' );

// 変数の挿入/置換
$swf->set_master_var( 'key', 'val' );
$vars = array(
	'hoge' => 'fuga',
	'foo' => 'bar'
);
$swf->set_master_var_array( $vars );

// 画像の差し替え
$swf->replace_image( $id, 'path/to/image.jpg' );

// 書き換え後のswfの出力
$swf->view();
```


## 雑感

あんまり今回の件とは関係ありませんが…HTML5やCSS3やらSVGやらCanvasやらなにやら騒がれていますが、適材適所でFlashもしっかりと取り入れていく頭は残しておかないといけないように感じます。

モダンブラウザの浸透率を考えるとクロスブラウザを考えなくていいのは結構大きな強みなんじゃないかと思っていますし、Flashから変換する技術も高くなってきているんじゃないかと思っています。

簡単なアニメーションを作れる所も優秀なツールですよね。HTML5でもEdge Animateとか出てきましたがどうなんでしょう？色々試してみないと…。


## 参考サイト

- [FlashLite 動的生成の全てを教えます(その1?) | tech.kayac.com – KAYAC engineers' blog](http://tech.kayac.com/archive/generate_flashlite_var1.html)
- [FlashForward @ GitHub](http://ken39arg.github.io/FlashForward/)

PHPでFlash Liteを動的生成するライブラリMedia_SWFを色々といじって自分向けにしてみた


とある案件で円グラフを表示する必要があったので、今の流行からするとHTML5かもしれませんが、Flashで作ることにしました。

と、思ったのですが、矩形や直線・曲線、円は描画したことあったんですが、扇形は経験がなかったのと、計算する手間も惜しかったので調べてみました。


## 早速実装

調べてみると正に求めているクラスが公開されていたのでそちらを利用させていただきました。  
[参考サイト：扇形を描く](http://www.d-project.com/flex/001_DrawPie/)

ただ、参考サイトのデモでは単純な扇形の書き方が無かったので、逆にそれを残しておきます。

```actionscript
var x:uint = 100; var y:uint = 100; var r:uint = 100;
var shape = new Shape();
var g:Graphics = shape.graphics;
g.moveTo(x, y);
g.beginFill(0xff0000, 1);
// GraphicsLib.drawPie(Graphics,X座標,Y座標,半径,開始(rad),終了(rad),中心から描画の有無)
GraphicsLib.drawPie(g, x, y, r, 0, Math.PI, true);
g.endFill();
```

上記のコードで、(100, 100)を中心に半径100pxで下弦の半円が出来るはずです。

適宜、ShapeはSpriteやMovieClipに変更していただき、stage等にaddChildをしてください。

ActionScript3で扇形を描画してみた


AS3のaddEventListenerでマウスのクリック時や、オーバー時にイベント割り当てた時に変数を渡したいと思うことがあったので、方法は無いかと探したところ、以下のような方法で実現が可能であることが分かりました。

参考：[ActionScript3.0(AS3.0) – addEventListenerで関数へ引数を渡す | maxar quartz](http://quartz.maxar.jp/blog/flash/1438.html)

方法としては、「Function」の返り値を持つ関数をaddEventListenerで指定します。

```actionscript
hoge.addEventListener( MouseEvent.CLICK, fuga(1, 2) );

function fuga( foo:Number, bar:Number ):Function {
	return function( e:MouseEvent ):void {
		trace( foo+bar );
	}
}
```

上記のプログラムで、ムービークリップ「hoge」をクリックした時に、変数として与えた、二つの値の合計をtraceします。

ただ注意点として、この方法でイベントを割り当てた場合、「fuga」をremoveEventListenerをしても解除されませんので、参考にさせていただいたページに書いてあるように、arguments.calleeを利用して外す必要があります。

```actionscript
hoge.removeEventListener( MouseEvent.CLICK, arguments.callee );
```

複数のムービークリップに、同じアクションで少しだけ違う処理をさせたい時などに使えそうです。

AS3でaddEventListenerに変数を渡してみた


FlashからHTMLへのアクションを起こしたり、その逆を実現するために、間にJavaScriptをかませる方法を取っています。

しかし、何回かやってみても毎回調べなおしをしている気がするので、ここに書いておくことで、また調べる時には簡単に見直すことが出来るようにしたいと思います。


## FlashからJavaScriptを実行

Flashのボタンをクリックした時にJavaScriptを実行するなど、Flash側からJavaScriptを実行させるためには、Flashから実行されるJavaScriptの関数の用意と、ActionScriptに用意したJavaScriptの関数を呼び出す記述を行います。

まずはJavaScriptに関数を用意します。ここでの注意点は特にありません。

```javascript
function hoge() {
	alert("done");
}
```

次に用意したJavaScriptの関数を呼び出すActionScriptを記述します。

```actionscript
button_mc.addEventListener(MouseEvent.CLICK, buttonClickHandler);
function buttonClickHandler(e:MouseEvent):void {
	ExternalInterface.call("hoge");
```


これで「button_mc」というムービークリップをクリックしたときに、ダイアラグボックスで「done」と表示されます。

また、FlashからJavaScriptを呼び出す際、関数名の後に続けて値を入れることで、JavaScriptに値を渡すことが可能です。

```actionscript
ExternalInterface.call("huga", variable);
```


## JavaScriptからFlashを実行

手順はまったく逆で、Flash側に呼び出される関数を用意し、JavaScriptにFlashの関数を呼び出す記述をおこなうのですが、FlashからJavaScriptに比べて少し大変です。

まずFlash側にActionScriptで呼び出される関数を用意します。

```actionscript
ExternalInterface.addCallback("callFlash", hoge);
function hoge():void {
	trace("done");
```

また、ここで作成したFlashをHTMLに貼る時に少し注意が必要です。

objectとembedにidかnameを指定し、allowScriptAccessに”always”を指定しないといけません。

```html
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
	codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0"
	width="550" height="400" id="swf_obj" align="middle">
	<param name="allowScriptAccess" value="always" />
	<param name="movie" value="hoge.swf" />
	<param name="quality" value="high" />
	<param name="bgcolor" value="#ffffff" />
	<embed src="hoge.swf"
		quality="high" bgcolor="#ffffff" width="550" height="400"
		id="swf_embed" align="middle" allowScriptAccess="always"
		type="application/x-shockwave-flash"
		pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
```

次に、JavaScriptにFlash側の関数を呼び出す記述を行います。

```javascript
var fuga = document.getElementById("fuga");
fuga.onclick = function() {
	var tgt;
	if (navigator.appName.indexOf("Microsoft") != -1)
		tgt = document.getElementById("swf_embed");
	else
		tgt = document.getElementById("swf_obj");
	tgt.callFlash();
}
```

これでidに「fuga」と付いている要素をクリックすることで（表示できませんが）traceで「done」と表示されるはずです。

FlashとJavaScriptを連動させてみる


Flashでロールオーバー時に色の変化をさせたいことがあったので、Tweenerを利用して実現しました。

BetweenAS3でも色の変化をアニメーションさせることが可能なのですが、ColorMatrixFilterの使い方がイマイチ分からなかったのでもう少し勉強してからにします。

まずはTweenerの本体と、Tweenerのcolorプロパティを利用できるように、事前準備を行います。

```actionscript
import caurina.transitions.Tweener;
import caurina.transitions.properties.ColorShortcuts;
ColorShortcuts.init();
```

準備が終わったら、ほぼ通常のトゥイーンを生成するように設定し、変化させたい色を「_color」の値に代入します。

```actionscript
Tweener.addTween(hoge, {_color:0xFF0000,time:2,transition:"linear"});
```

上記の記述だと、hogeというムービークリップを等速で2秒間かけて、「0xFF0000」→赤色に変化させます。

Tweenerを利用した色を変化させるアニメーション


Flashでアニメーションやら、プログラムやら作っている時に、副産物的に出来たり、参考サイトから引用させていただいた便利な関数が色々出来たので、忘れないように残していきます。


## 指定の要素を削除

ムービークリップを削除したい時にremoveChildを利用しますが、削除したい要素とその親のムービークリップを指定する必要があります。

削除したい要素の親をイチイチ覚えて居なかったりするので、削除したい要素を指定するだけで、削除できる関数を用意しました。

```actionscript
function deleteElement(target) {
	if( MovieClip(target.parent) is MovieClip){
		MovieClip(target.parent).removeChild(target);
	}
}
```


## 指定のムービークリップの子ムービークリップを全て削除

メモリーフローが起きる原因として、削除したはずのムービークリップが残ってしまっていることがあります。

そこで、指定の子供を削除する[こちらの関数](http://ameblo.jp/linking/entry-10152208935.html)を参考にさせていいただき、指定したムービークリップの子供を全て走査して削除する関数を用意しました。  
 こちらを利用することで、ムー日クリップの削除し忘れが軽減できると思います。

```actionscript
function allRemoveChild(parenMC:MovieClip):void {
	var deleteNum:uint = parenMC.numChildren;
	for(var i:uint=0; i<deleteNum; i++){
		if( parenMC.getChildAt(i) is MovieClip){
			var lTgt:MovieClip = parenMC.getChildAt(i) as MovieClip;
			allRemoveChild( lTgt );
		}
	}
	for (var k:uint = 0; k<deleteNum; k++) {
		var child:* = parenMC.getChildAt(0);
		parenMC.removeChild(child);
	}
}
```
 
###透明度を操作したロールオーバー

簡易的にロールオーバーを作成するには、透明度を操作するのが一番手っ取り早いので、なるべく簡単に設定できる関数を用意しました。

```actionscript
function setAlphaRollOver(targetMC:MovieClip, sfrom:Number, sto:Number, stime:Number = 0 ) {
	targetMC.mfrom = sfrom;
	targetMC.mto = sto;
	targetMC.mtime = stime;
	targetMC.addEventListener( MouseEvent.ROLL_OVER, rovHandler );
	targetMC.addEventListener( MouseEvent.ROLL_OUT, rotHandler );
}
```


ここからは使っているトゥイーンライブラリによって少し記述を変えます。

Tweener使用Ver.

```actionscript
function rovHandler( e:MouseEvent ) {
	var tgt:MovieClip = e.currentTarget as MovieClip;
	Tweener.addTween( tgt, { alpha:tgt.mto, time:tgt.mtime. transition:"easeOutCubic" } );
}
function rotHandler( e:MouseEvent ) {
	var tgt:MovieClip = e.currentTarget as MovieClip;
	Tweener.addTween( tgt, { alpha:tgt.mfrom, time:tgt.mtime. transition:"easeOutCubic" } );
}
```

BetweenAS3使用Ver.

```actionscript
function rovHandler( e:MouseEvent ) {
	var tgt:MovieClip = e.currentTarget as MovieClip;
	if( tgt.tw != null ) {
		tgt.tw.stop();
	}
	tgt.tw = BetweenAS3.tween( tgt, { alpha:tgt.mto }, null, tgt.mtime, Cubic.easeOut );
	tgt.tw.play();
}
function rotHandler( e:MouseEvent ) {
	var tgt:MovieClip = e.currentTarget as MovieClip;
	if( tgt.tw != null ) {
		tgt.tw.stop();
	}
	tgt.tw = BetweenAS3.tween( tgt, { alpha:tgt.mfrom }, null, tgt.mtime, Cubic.easeOut );
	tgt.tw.play();
}
```

Flashの便利関数色々



前回：[フォトギャラリーの経過報告](http://www.sus-happy.net/blog/2009/11/29/000013.html)

フォトギャラリーを細々と作っていますが、中々進んでいません。ちなみに[製作途中のフォトギャラリーはこんな感じ](http://www.sus-happy.net/photo/)。

とりあえずローディングイメージを作って、拡大画像を表示したときに閉じるボタンを作りましたが、配置が微妙です。もうちょっと完成予想図を固めようかなぁ。

そもそもまだProgressionに慣れているとは言えないのもあり、牛歩の如く進めています。




フォトギャラリーの経過報告 Vol.2



Flashで作ると言っていたフォトギャラリーですが、少しずつ形になってきているので経過報告をします。ちなみに[製作途中のフォトギャラリーはこんな感じ](http://www.sus-happy.net/photo/)、何だかクリックできそうですが、何も起きません。

目標はMT+Flash。MTで投稿した内容をFlashで表示、カテゴリー、タグ、フリーワードの検索もMTを利用できるように…。ちなみに現状では投稿した画像のサムネイルを表示する事は成功してます。

製作する際にFlashはFlashでもProgressionを利用し、さらに最近Progression4のPublic Betaが発表されたので、Progression4を使ってますが、まだまだ使っている人が少なくて、つまづいた時に検索しても出てこない出てこない。確かに普通にAS3か何かで作るよりも簡単に出来ますが、まだまだ仕様の把握に悪戦苦闘中です。

== 追記 ==

クリックすると拡大画像が表示されるようになりましたが、縮尺の調整を全くしてないので、一部分しか見えない状態です。


