プログラミング工房
TOP
Flex基本
開発環境 JavaScript連携 PHP連携1 PHP連携2(AMFPHP) ウィンドウ ボタンスキン 矩形スキン ローカルファイル(テキスト) F5等の対策 ローカルファイル(イメージ) ダウンロード、アップロード 1枚の画像のカラーを変更 時間のかかる計算処理 外部SWFの読込み
Flexで3D
Flexだけで3D Papervision3Dを使ってみる 3Dオブジェクト カメラ、前後判定の工夫しました 自由な形状を作成
Flexでクラス
Class1(白黒ゲームの盤) Class2(白黒ゲームのプレイヤー) Class3(プレイヤーを外部SWF)
PHP
共通関数1
Flexの作品
お問合せの説明 サンプルのソース表示の説明 分子構造の表示(PDBファイル) マンデルブロ集合の画像作成 swf参加型白黒ゲーム(Reversi) ストップウォッチ WEB素材
AIR
AIRを使ってみる ソースファイルのHTML変換を作る
etc.
マンデルブロ集合のギャラリー ジュリア集合のギャラリー wonderflを使ってみました お問合せ

wonderflを使ってみました

■2011.04.14:作成

wonderflを使ってみました

前から気になっていた「wonderfl」を使ってみました。

まずhttp://wonderfl.net/ を開いてみて、上にある「signin」をクリックしました。
IDは「Google」が利用できるのでそれを利用しました。
右上に「+コードを書きはじめる」があったのでクリックすると、ソースの入力画面になります。
 ここまで確認できたので編集しないで「戻るボタン」で終えたのですが、初期状態で入っているコードが セーブされてしまい、あわててその登録を削除しました。
どうやら「+コードを書きはじめる」を行うだけっで作成されるようだ。

分子構造の表示(PDBファイル)を登録してみることにした。
「wonderfl」では登録できるソースコードは1個だけなので画面(*.mxml)とプログラム本体(*.as)を 分ける様なことは出来なみたい?。今回は「*.as」の形で登録してみる。
画面で必要なのは回転用スライダーなので自動で回転する様に変更しスライダーを削除、 またサーバ上の「PDBファイル」も読めそうに無いのでデータをソースに直接記述し、 ローカルのPDBファイル読み込みを外してみた。

こんな形でソースが出来たのであとは画像(原子の画像)をアップロードを行う。
画像ファイルのアップは以下の様な方法でこのなえる。
(1)タイトル等の編集「edit」をクリックする。
(2)「more」をクリックすると「upload」が表示される。
(3)「upload」でファイルダイアログを開く、画像をアップする。
(4)一度セーブして開く直す。(画像のパスが変わるようです?、ここで戸惑う)
(5)マウス右ボタンで「画像のURLをコピー」
(実際は「http://assets.wonderfl.net/images/related_images/a/ac/acdd/acddXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX」 の形です。)
wonderflで画像の登録
画像の読み込み方法も変わるので、読み込んでいる部分のソースをのせます。
       private static var filePath:String = 
                 "http://assets.wonderfl.net/images/・・・・";
             :
       loader = new Loader();
       loader.contentLoaderInfo.addEventListener(Event.COMPLETE, complete,
                   false, 0, true);
       loader.load(new URLRequest(filePath), new LoaderContext(true));
   }
   private function complete(evt:Event):void {
       loader.contentLoaderInfo.removeEventListener(Event.COMPLETE, complete);
       bmAtom = Bitmap(loader.content);

実際の登録結果は以下の様になります。

C60分子構造の表示 - wonderfl build flash online


原子の絵に問題があり、実際はPNGで丸の外側は透明(透過色)ですが、うまくいかないようです?

wonderfl(hi.kurosawa) ここが登録場所です。これ以外にいくつか登録しました。

プログラミング工房