ActionScript

2009年11月 6日 (金)

Pixel3Dの座標⇒普通のxy座標


Pixel3Dの持つ3D座標を、通常の2次元座標に変換しています。

参考にしたのは、Papervision3Dのソースコードの1つである、「RenderPixels.as」というファイル。

このファイルで、Pixel3DをBitmapDataにプロットしていたので、その部分の計算を拝借。

割と簡単に出来ました。

マウスでクリックした座標とPixel3Dの座標を照らし合わせてPixel3Dにクリックイベントをつけたりすると面白いかもしれないですね。



| | コメント (0) | トラックバック (0)

2009年10月18日 (日)

BetweenAS3使ってみる。 フィルタ系の話。

P




















BetweenAS3にやっと手を出してみました。

Tweenerと勝手が違って最初は微妙な感じでしたが、最近やっと慣れてきました。

で、使ってみて驚いたのはConvolutionFilterとかのTweenもできるってこと。

とりあえずやってみました。

エッジ検出→セピア→エンボスの流れでフィルターをやってみました。




たとえば、ConvolutionFIlter使ってエッジ検出する場合とかは以下みたいに書く。

// bmpはBitmap型

// convolutionFilterを使う場合は最初にこれをセットしておく

bmp.filters = [new ConvolutionFilter(3,3,[0,0,0,0,1,0,0,0,0])];

// tween
BetweenAS3.tween(bmp,
           {_convolutionFilter:{
                matrixX:3,
                matrixY:3,
                matrix:[-1, -1, -1, -1, 8, -1, -1, -1, -1]}
            },
            null,
            2.0,
            Cubic.easeOut).play();

気づいたのは、colorMatrixFIlterとかは何も考えずにトゥイーン出来たんだけど、convolutionFilterのときは「bmp.filters = [new ConvolutionFilter(3,3,[0,0,0,0,1,0,0,0,0])];」みたいに最初にフィルターをセットしてあげないと動かなかった。

ここんとこはそういうものなのかな。

もう少し慣れるまで遊んでみます。

| | コメント (0) | トラックバック (0)

2009年10月 2日 (金)

キラキラPixel3D!

きらきら~。

超久々にAS3でプログラミングしました。

やっぱ楽しい。

PV3Dはこれからどうなっていくのかなー。

| | コメント (2) | トラックバック (0)

2009年8月23日 (日)

SiONを使ってみる。 その6(音にエフェクトをかける)

Q




















大絶賛SiONで遊ばせてもらってます。

今回は、エフェクトを使ってみます。

SiONには、「SiEffect○○○」みたいな名前でたくさんの音用のエフェクトが用意されています。

今回は、前回のやつに「SiEffectStereoReverb」というエフェクトをかけてみました。

とりあえず、サンプル(注:音出ます! ソースは右クリック)。

前回までかけてたフェードインアウトは外してあります。

響いたような感じでカッコよくなったと思います。





エフェクトの簡単な使い方。

// エフェクトの用意
var effect:SiEffectStereoReverb=new SiEffectStereoReverb();

// エフェクトの初期化
effect.initialize();

// ドライバのエフェクタの初期化
driver.effector.initialize();

// エフェクトを追加
driver.effector.connect(0, effect);

// 再生開始
driver.play(mainMelody, false);

これだけ。

手探りで作ってみたけど、エフェクトの使い方これであってんのかな。

| | コメント (0) | トラックバック (0)

SiONを使ってみる。 その5(カスタムフェードを使ってみる)

P_4




















絶賛SiONで遊ばせてもらってます。

前回、フェードインフェードアウトをやってみたんですが、SiONにはフェードインなどの効果を自分で作れるfaderってのが入っています。

同梱されているサンプルソースにカスタムフェードのサンプルがあったので、参考にしながらやってみました。

とりあえず、サンプル(注:音出ます! ソースは右クリック)。

前回とちょっと音も変えてあります。

基本はサンプルのをほぼ流用させてもらったわけですが・・。




今回は、ローパスフィルターを使ったフェードインアウトをやってます。

ローパスフィルターってのは要は低周波(低音)を通すフィルタです。

これを使って低音から徐々に音を通すようにすると、普通のフェードよりかっこいいのが出来ると。

カスタムフェードの使い方は、

// ローパスフィルターの用意
var lpf:SiCtrlFilterLowPass=new SiCtrlFilterLowPass();
// 初期化
lpf.initialize();

って、使いたいフィルタを初期化して(今回はサンプルと同じローパスフィルタを使ってます)、

// ドライバのエフェクタの初期化
driver.effector.initialize();
// 0番目のスロットに、フィルタを追加
driver.effector.connect(0, lpf);

ドライバにセットして、

// フェードの実行
// フェーダー中に実行する関数、フェードする範囲と、時間を設定。
// 「n * 44100 / 2048 」でn秒らしい(サンプルより)
fader.setFade(fadeLPF, 0, 1, 8 * 44100 / 2048);


// フェーダーから呼ばれる関数
private function fadeLPF(v:Number):void
{
   // フィルタの範囲を設定
   lpf.control(v, 0.5);
}

みたいにfaderを実行して終わり。

注意点としては、再生するときは「driver.play(mainMelody, false);」みたいに第2引数を設定してあげないといけない。

なんという簡単仕様。すごいなSiON。

ローパスフィルタのフェードアウトがすごくかっこよくてお気に入りです。

| | コメント (0) | トラックバック (0)

SiONを使ってみる。 その4(フェードインとフェードアウト)

P_4





















絶賛SiONで遊ばせてもらってます。

今回は、音のフェードインとフェードアウトを行います。

前回のを改造。

とりあえず、サンプル(注:音出ます! ソースは右クリック)。




方法は非常に簡単。

フェードインをしたい場合は、

// 7秒かけて、フェードイン
driver.fadeIn(7);

みたいに書くだけ。



フェードアウトは、フェードアウトしたいタイミングで、

// フェードアウトを実行する関数(7秒かけてフェードアウト)
private function onFadeOut():void
{
   if (!driver.fader.isActive) driver.fadeOut(7);
}

みたいな関数を実行すればいいだけ。

非常に簡単に出来てしまいます。

ただ、フェードアウトの時にちょっと注意。

フェードアウト終了時に音の再生を終了したい場合は、

// フェードアウトにあわせて音を止める
driver.autoStop=true;

として、autoStopプロパティを設定しておかないといけない。

これをしないとフェードアウト終了時にもとの音量に戻ってしまう。

これだけ気をつけないといけないかな。




ちなみに、今回は使ってないですが、「SiONEvent.FADE_PROGRESS」、「SiONEvent.FADE_IN_COMPLETE」、「SiONEvent.FADE_OUT_COMPLETE」のようにフェードインフェードアウトに合わせたイベントも用意されてました。

どんだけ至れり尽くせりなライブラリなんですか、SiONさん。


| | コメント (0) | トラックバック (0)

2009年8月22日 (土)

SiONを使ってみる。 その3(音色を変えてみる別バージョン)

P_2_2




















絶賛SiONで遊ばせてもらってます。

前回、音色の変更をやってみたんですが、別な方法を見つけました。

というか、多分こっちの方が正規な方法の気がする。




方法としては、

// 音色を変更
var presetVoice:SiONPresetVoice=new SiONPresetVoice();
var voice:SiONVoice=presetVoice["valsound.piano3"];
driver.setVoice(0, voice);

みたいに、setVoiceで音色をセットする。

そのあとMMLのコマンドで、

var str:String="";
str+="%t0,1,1 t100 %6@0cdefedcr %6@0efgagfer %6@0crcrcrcr l8 %6@0ccddeeff l4 %6@0edc;";

みたいに、音を変更したい部分に「%6@0」を追加する。

@0の0が、setVoiceで指定した番号。だから、番号変えて色々な音をセットできる。

%6ってのはモジュール番号らしい。この部分だけよく分かっていない。後で調べる。

あとは、普通にplay()してあげれば音色の変わった音が出る。

sequenceOnメソッド使わなくても音色変更出来た。




一応サンプル(注:音出ます! ソースは右クリック)。

前回のより何かテンポが遅くなった。

やっぱMMLをある程度理解しないといけないっぽいなぁ。



---------------------------------------------------------------------
(追記)

setVoiceの場所ですが、driverに対して行うのではなく、driver.compileメソッドから受け取ったSiONData型の変数に対して行った方がいいみたいです。

今回のサンプルでいうと、

「driver.setVoice(0, voice);」  →     「mainMelody.setVoice(0, voice);」

にした方がいいかもってこと。

このほうが各SiONData型の変数に対して音色の設定ができるのかな。

| | コメント (0) | トラックバック (0)

SiONを使ってみる。 その2(音色を変えてみる)

P_2




















絶賛SiONで遊ばせてもらってます。

今回は音色を変更してみました。

前回作ったやつの音をピアノに変更してみました。

こんな感じ(注:音出ます! ソースは右クリック)。





SiONには、プリセットで色々な音色が入ってます。

音色の変更方法としては、

// compile() メソッドであらかじめ SiONData を作っておく
mainMelody=driver.compile(str);

// 音色を変更
var presetVoice:SiONPresetVoice = new SiONPresetVoice();
var voice:SiONVoice = presetVoice["valsound.piano3"];

// 再生開始
driver.play();
driver.sequenceOn(mainMelody, voice, 0,0,0);

みたいにプリセットの音を指定して、再生。

本来sequenceOnメソッドは、別に再生してあるMMLと連携しながら再生するためのものなんで、使いどころ間違ってるかもしれないけど。

とりあえず、ちゃんと音は変わってくれた。

プリセットはいろいろあって、この辺は検索すれば色々出てきそう。

| | コメント (0) | トラックバック (0)

SiONを使ってみる。

P




















先日知った、SiONというライブラリを使ってみることにしました。

いわゆる、音を扱うライブラリで、MMLを利用した音楽再生などが出来ます。

ちなみに、自分はMMLというのも初めて知りました。

MMLとは、「Music Macro Language」の略で、コマンドの様に書いていってそれで音を作成します。

今回はとりあえず、MMLで「かえるの歌」でもやってみました。

こんな感じ(注:音出ます! ソースは右クリック)。




基本的には、

var str:String="";
str+="%t0,1,1 t100 cdefedcr efgagfer crcrcrcr l8 ccddeeff l4 edc;";
str+="%t0,1,1 t100 rrrrrrrr cdefedcr efgagfer crcrcrcr l8 ccddeeff l4 edc;";
str+="%t0,1,1 t100 rrrrrrrr rrrrrrrr cdefedcr efgagfer crcrcrcr l8 ccddeeff l4 edc;";

みたいな感じでMMLのコマンドを文字列で書いていって、

// ドライバ
var driver:SiONDriver=new SiONDriver();

// MMLデータを保持
var mainMelody:SiONData;

// データをコンパイル
mainMelody=driver.compile(str);

// 再生
driver.play(mainMelody);

みたいな感じで再生する。

あっさり。

苦手だった音のプログラミングがあっさり出来てしまった。

しかも音との連携もあっさり出来る(noteOnが音のなり始め、noteOffが音のなり終わり。多分だけど。)。

SiON・・・恐るべし!



まだMMLのこととがよく分からないし、もうちょっと遊んでみよう。



------------------------------------------

(追記)

noteOnなどのイベントに関して、詳しい記事を見つけたので。

こちらの方がすごく詳しくかいてあって参考になります。

SiONをやってみよう・・・基本編2:イベント・トリガー - logicalyzeblog

| | コメント (0) | トラックバック (0)

2009年8月21日 (金)

外部のswfを読み込んでうんらた 2

P3























外部swfローディングをまた。

ちょっくら基本の復習です。

とりあえず、こんな感じ(右クリックでソース)。



前作ったやつとの違いは、swfのローディング方法。

ProgressEventで指定した関数の中でローディングバーを書くんじゃなくて、ローディングバーでロード状況、フレームイベントでローディングバー描写みたいに分けてます。

前回のやつだと軽いファイルをロードする場合ローディングバーがほとんど見えなんですが、今回のだと軽いのでもちゃんとローディングバーを見せてくれます。




軽いファイルをロードするときに、ローディングバーが一瞬で消えちゃうのがなんかいやだったんで、ちょっと作り直してみました。

もっとスマートな方法を知りたい。

| | コメント (0) | トラックバック (0)

Externalinterfaceの練習 その2

「Externalinterface」の練習中。

JavaScriptからActionScriptを呼び出す場合、「ExternalInterface.addCallback」を利用します。




まず、ActionScriptでJavaScritから呼び出す関数を用意します。

public function setText(str:String="null"):void
{
   var t:TextField=new TextField();
   t.autoSize=TextFieldAutoSize.LEFT;
   t.defaultTextFormat=new TextFormat(null, 20, 0xffffff);
   t.text=str;
   addChild(t);
   t.y=40;
}

そして、これをJavaScriptで呼び出せるように登録します。

// JavaScriptから、setFuncという名前で呼び出せるようになる。
ExternalInterface.addCallback("sefFunc", setText);






JavaScript側からは、以下のようにして呼び出します。

<script type="text/javascript">
// SWFObjectでswf埋め込み
swfobject.embedSWF("test.swf", "myContent", "100%", "100%", "9.0.0", "swfobject/expressInstall.swf",{},{bgcolor:"#000000"});

// 埋め込まれたムービーを取ってくる関数
function getMovieName(movieName)
{
    if (navigator.appName.indexOf("Microsoft") != -1) {
       return window[movieName];
    }
    else {
        return document[movieName];
    }
}

// 呼び出したい場所に以下を記述する。引数も渡せる。
getMovieName("myContent").sefFunc("call from JS !");
</script>

これで、JavaScriptからActionScriptの関数を呼び出せるようになります。





超簡単なサンプはこちら

サンプルの流れとしては、ASからJSの関数を呼び出し→その関数の中でJSからASの関数を呼び出し って感じ。

HTMLとasファイルのまとめたのはこちら

| | コメント (0) | トラックバック (0)

Externalinterfaceの練習

「Externalinterface」とは、ActionScriptとJavaScript間で連携を行う際に利用します。

ActionScript側から、JavaScriptに記述してある関数を呼び出すには、「Externalinterface.call」を利用します。




まず、JavaScript側で関数を作成する。今回はブラウザ判定の関数を作りました。

<script type="text/javascript">
function getBrowserType()
{
    var isBrowser;
    if(navigator.userAgent.indexOf("MSIE") != -1) isBrowser = "IE";
    else if(navigator.userAgent.indexOf("Firefox") != -1) isBrowser = "FireFox"
    else isBrowser = "What is this browser !?";

    return isBrowser;
}
</script>

あとは、ActionScript側で呼び出して終わり。

//  関数名を指定して呼び出し
var type:String=ExternalInterface.call("getBrowserType");

呼び出しが失敗した場合はnullが帰ってきます。




ちなみに、引数を持って行くこともできます。

JavaScript側で引数を持って行く関数を作って。

<script type="text/javascript">
function calcSum(n1, n2, n3)
{
     return (n1 + n2 + n3);
}
</script>

ActionScript側で呼び出す場合に引数を渡します。複数渡したい場合は引数を複数書けばOK。

// 引数に1,2,3を指定。帰り値は6が帰ってくる。
var sum:int=ExternalInterface.call("calcSum", 1, 2, 3);




割と簡単に出来てしまった。

一応動作サンプル

HTMLとasファイルをまとめたのはこっち(SWFObjectは同梱してません)。

| | コメント (0) | トラックバック (0)

SWFObjectで全画面表示swfの復習。

有名なSWFObjectの復習です。

いつもFlexBuilderでリリースしたものを使っているので、SWFObjectをしっかり使ったことがなかったもんで。





サイトからzipをDLして解凍すると、中には複数のファイルが入っています。

「expressInstall.swf」、「swfobject.js」の2つのファイルを使います。

同梱してある2つのhtmlファイル、「index.html」、「index_dynamic.html」ともSWFObjectの使い方のサンプルファイルで、2つのHTMLでそれぞれ別の記述方法で書いてあります。

自分は今回は、「index_dynamic.html」に記述してある方法を利用しました。

<script type="text/javascript">
  swfobject.embedSWF("test.swf", "myContent", "100%", "100%", "9.0.0", "swfobject/expressInstall.swf",{},{bgcolor:"#000000"});
</script>

サンプルの方法に、背景色の指定を加えました。

また、幅と高さを100%で全画面表示に。





ただ、このままだとIEではうまくいったのですが、FireFoxやOperaで正しく表示されませんでした。

解決方法は以下のサイトにありました。

nondelion.com - swfobject で flash を Window 内に全画面表示


ここにあった通り、以下のCSSを記述。

<style type="text/css">
<!--
     body
  {
         position: absolute;
         width: 100%;
         height: 100%;
         margin: 0;
         padding: 0;
     }

     html, body {
         overflow: hidden;
     }
-->
</style>

一応、これでIE、FireFox、Operaでうまくいきました。



ちなみに、以下の記事を参考に、swfのキャッシュも防いでいます。

SWF ファイルのキャッシュを防ぐ方法




一応、動いているサンプル

ちゃんと動作していると思います。




ちなみに、ローカルで動かない場合や、セキュリティサンドボックス侵害とかが出る場合は、SWFObjectに渡すパラメータをいじってやるとうまくそうな。

「allowScriptAccess」を「always」にするとローカルでうまくいくとかね。

パラメータの指定場所は、以下のサイトが詳しく書いてあります。

SwfObject - SWFObject(swfobject.js) 2.1についてメモ

| | コメント (0) | トラックバック (0)

2009年8月 7日 (金)

メニューのサンプル

P





















ランダムテキストを利用して簡単なメニューのサンプルです。

こんな感じ(右クリックでソース表示)。

何か作りたくなって作ってしまった。

本当にメニューだけ。

コンテンツないからクリックしても音がなるだけです。

ロールオーバーの動きには以下を参考にさせてもらいました。



trick7 - ロールオーバー効果へのこだわり



ランダムテキストは結構好き。

自分用のクラスを作って色々流用してます。





ランダムテキストのサンプルは以前にwonderflにも投稿しました。

久々に見てみたらフォークされてて今日作ったやつとだいたい同じ感じになってた。

こっちを先に見りゃよかった・・。

| | コメント (0) | トラックバック (0)

2009年8月 6日 (木)

wonderflに投稿してみました15 3Dでアトラクタっぽいの



久々にwonderfl。

前からアトラクタやってみたかったんで、PV3Dと組み合わせて3Dアトラクタって感じのやつを。

クリックで再描写です。

見やすくて綺麗な時もあれば、見づらい時もあります。

いやーアトラクタっていいですよね。




ちなみに、パーティクルの管理は配列ではなくていテレータでやってます。

パーティクル祭りの復習もかねてます。

| | コメント (0) | トラックバック (0)

2009年8月 4日 (火)

パーティクル祭りをいまさら復習しています。

P




















Wonderflでちょっと前にあったパーティクル祭り。

今さら感がありまくりですが、勉強させてもらってます。

特に勉強させてもらったのはこの2つのコードです。


forked from 10万個ぱーてぃくる - 軽く高速化 wonderfl build flash online


swirl (10000 particles) wonderfl build flash online


配列ではなくて、イテレータでパーティクルを操作した方が高速になるんですか。

勉強になった。

一応、ソース見ながら自分でも作ってみました。

こんな感じ

いやー、wonderflは本当に勉強になります。






ほとんどパクリなんでソース公開は自粛しとく・・・。




| | コメント (0) | トラックバック (0)

2009年7月26日 (日)

FLARToolkitで遊んでみる その5

P



















絶賛FLARToolkitで遊ばせてもらってます。

遊んでいるうちに、なんかへんなの召喚してしまった。







BitmapFireEffect使いたくなっただけです。はい。

ソースとか画像をまとめたものはこちら

マーカー等は、スタートガイドのものを使わせてもらってます。

| | コメント (0) | トラックバック (0)

2009年7月22日 (水)

FLARToolkitで遊んでみる その4

P




















絶賛FLARToolkitで遊ばせてもらってます。

久々にサウンドスペクトラムをやってみまいた。

MP3はこちらのものを使わせて頂いています。










綺麗なような微妙なような・・。




以下、ソースです。

マーカー等は、スタートガイドのものを使わせてもらってます。

続きを読む "FLARToolkitで遊んでみる その4"

| | コメント (0) | トラックバック (0)

2009年7月21日 (火)

FLARToolkitで遊んでみる その3

P




















絶賛FLARToolkitで遊ばせてもらってます。

今回は、オリジナルのマーカーを作ってみました。

オリジナルのマーカー作成に関しては、下の記事を参考にさせてもらいました。



簡単! FLARToolKitをはじめよう! デベロッパーセンター



とりあえず、適当ですがオリジナルのマーカーを作成。


Marker






















参考記事に、マーカーを作るためのルールが書いてあります。

それに準ずれば基本的に大丈夫なようです。

作成したマーカーの画像からpatデータに変換するのは、太郎氏が制作されたARToolKit Marker Generator Onlineというのを利用します。

これで簡単にpatデータが作成できます。

あとはプログラムで読み込んで、はいおしまい的な感じです。

この前作ったやつを、オリジナルのマーカー使ってやりなおしてみました。





ちゃんと認識されてます。

よしよし。

| | コメント (0) | トラックバック (0)

2009年7月20日 (月)

FLARToolkitで遊んでみる その2

E





















FLARToolKitで遊び中です。

以前saqoosha先生がやってた、Papervision3D で穴の中身だけレンダリングするってのをやってみたくて作ってみました。

それと、FLARToolKitを使ったAR系Flashの作り方も参考にさせていただきました。

とりあえず、動作例は下みたいな感じ。




今回は、FLARBaseNodeにaddChildせずに、sceneにすべてaddChildして計算をしています。




以下、ソースです。

マーカー等は、スタートガイドのものを使わせてもらってます。

続きを読む "FLARToolkitで遊んでみる その2"

| | コメント (0) | トラックバック (0)

FLARToolkitで遊んでみる

A




















ふとやりたくなったので、FLARToolkitをやってみることに。

スタートガイドにサンプルがあったので、それを見ながらいじっていく。

サンプルではソースコードが3つのクラスに分けてあったので、自分の理解のためにと、1つにまとめてみました。

で、サンプルではキューブだったので、今回はPixel3Dを表示してみました。

動作例は下みたいな感じに。






おお。

すっごい簡単に出来てしまった。

これはおもしろい。







以下、ソースです。

とは言ってもスタートガイドとほとんど同じ感じだけど・・・。

マーカー等は、スタートガイドのものを使わせてもらってます。

続きを読む "FLARToolkitで遊んでみる"

| | コメント (0) | トラックバック (0)

2009年6月21日 (日)

そうめんをさわってみた その6

P





















そうめん練習中。

今回は、FlickrAPIとPV3Dを使って以前作った作品をそうめんVerとして書きなおしてみました。

サンプルはこちらです(右クリックでソースが見れます)。




スレッドの流れは、

プログレスバー作成して、それのリサイズイベント用スレッド実行

APIにアクセスして、XMLをロード

XMLを解析して、画像をロード

画像からPV3DのPlaneを作成。リサイズイベント用スレッドは割り込みで停止。

Planeを出現

Planeコントロール用スレッド実行

って感じです。






以前そうめんを使わずに作った時は、イベント系の処理がすごくめんどかった。

なので、そうめんを使ったことでaddEventListenerから解放されたのですごくいい感じにプログラムが組めました。

順序立てて考えができるので、デバッグとかもやりやすかたったし。

ただ、なんとなくソースコードが異様に長くなってしまうような感じがします。

こればっかりはうまく書いていくしかないっすかね。



| | コメント (0) | トラックバック (0)

2009年6月19日 (金)

そうめんをさわってみた その5

A























久々のそうめん。

今日はeventの練習です。

とりあえず、サンプルはこんな感じです(右クリックでソースが見れます)。

そうめんでは、MouseEvent.CLICKなどのイベントはaddEventListenerで受け取りません。

「event(target, "イベント名", function)」みたいに書くそうです。

これで、利用後のremoveEventListenerまでやってくれるとか。

便利です。




今回のサンプルは、「円を作成→円を回す。その中でMouseEvent.CLICKを監視→クリックされたらそれを真ん中に→またクリックされたら元に戻す」っていう流れをスレッドで作成しています。

個人的にはまだ書き方が分からない感じ。

円を動かす過程で、毎回eventを実行しているんですけど、これって毎フレームaddEventListerしている感じなんですかね。

なんか効率いい感じがしない・・・。

誰か正しい書き方教えてほしいです。




---------------------------------------

(追記)

イベントの話。

イベント監視用のスレッドを別に作ればいいんですよね。

こっちではそんな風に作ってみてます。

| | コメント (0) | トラックバック (0)

2009年6月11日 (木)

wonderflに投稿してみました14 & Papervision3Dをやってみた50


ほしです。

数式を使って簡単プログラム。

課題がうまくいかないから気分転換でやりました。

ああ課題よ早く終われ。





| | コメント (0) | トラックバック (0)

2009年6月 4日 (木)

WonderflでAS3.0の復習 その3 BitmapDataとパーティクル

P_2





















BitmapDataの復習。

下の2つを参考にしました。


HANABI wonderfl build flash online

燃えながら出てくる文字(修正版) wonderfl build flash online


とりあえず、こんなのとか、こんなの作ってみた。

パーティクルをやるときはパーティクルそれぞれをaddChildするのではなくて、BitmapDataにdrawすると速くなる。

Spriteとかを任意の場所にdrawするときは、

// pはSpriteとか。canvasはBitmapData。

var mat:Matrix=new Matrix;
mat.translate(p.x, p.y);
canvas.draw(p, mat, null, BlendMode.ADD);

みたいに、Matrixをつかって位置を調整する。




いやー最近のWonderflはすげーレベル高くて勉強になる。

| | コメント (0) | トラックバック (0)

外部のswfを読み込んでうんらた

P





















外部のswfを読み込む方法の備忘録。

普通にLoaderで読み込む。

ただ、swfの中で定義されている関数とかを実行する場合はちょっとコツがいるらしい。

とりあえずサンプル

右クリックでソースが見れます。

とりあえず、「swfをロード→addChild→swf内の関数で表示」って流れです。

| | コメント (0) | トラックバック (0)

2009年6月 3日 (水)

Flexのポップアップの備忘録

S





















Flexのポップアップの備忘録。

参考にさせていただいたサイトはこちら

とりあえず、



・メインからポップアップへのデータ受け渡し

・ポップアップからメインへのデータ受け渡し



は覚えておきたい。

あと、色とかはsetStyleで設定する。

サンプルはこんな感じ

右クリックでソース見れます。

| | コメント (0) | トラックバック (0)

2009年6月 1日 (月)

wonderflに投稿してみました13 & Papervision3Dをやってみた49




久々にFlash。

AS3.0を打ってるとすごく癒されるこの頃。

Pixel3D使ってみました。

10000個くらい普通に表示できたのは驚きました。

ローテーションの角度を簡単に計算する場合は、「viewport.containerSprite.mouseX 」とかを利用すると簡単に計算できます。

お手軽。



| | コメント (0) | トラックバック (0)

2009年5月19日 (火)

海外への日本Flasher情報発信地 「JActionScripters」

twitterで、「海外向けに、みんなで英語のブログをやらない?」という発言から、わずか数日。

海外向けの日本Flasherブログが発足しました。



JActionScripters



日本の有名なFlasherの皆さんが参加されています。

記事はすべて英語

海外への情報の発信地となる感じです。

さっそく投稿がどんどんされていて、すごく楽しいです。






ちなみに、このブログができる様子がずっとtwitterで行われていて、それを見ていて面白かった。

twitterも貴重な情報源になってきてる気がします。

| | コメント (0) | トラックバック (0)

2009年5月 8日 (金)

そうめんをさわってみた その4

P_4





















絶賛そうめん勉強中です。

そうめんでは、SerialExecutorやParallelExecutorを利用して複数のスレッドをまとめたとき、その進歩状況を獲得することが出来ます。

ロードのプログレスバーを作成する場合などで利用できます。

今回は、まず「画像を複数順々に読み込む→プログレスバーをフェードアウト→画像を順々に表示」ってスレッドを作成して実行します。

そんで、別に進歩状況を見るスレッドを作成して、それでプログレスバーを動かします。

っていうか、サンプルを改造したまんまです。

とりあえず、こんな感じのサンプルを作ってみました。





今日わかったことは、

・複数の進歩状況を見る場合は、MultiProgressってのを利用する。

・IProgressを継承したクラスには、percentっていうプロパティがあって、それで進歩状況を見ることができる。

って感じですか。




以下、ソースです。

画像は、こちらのものを利用しました。


続きを読む "そうめんをさわってみた その4"

| | コメント (0) | トラックバック (0)

そうめんをさわってみた その3

P_3




















絶賛そうめん勉強中。

今回は、TweenerThreadってのを利用してみました。

Tweenerをスレッドとして利用できます。

サンプルとして、「shapeをフェードイン→右へ→左へ→右へ・・・」って流れを作りました。

こんな感じです。

Tweenerのスペシャルプロパティもちゃんと利用できました。





今回学んだことは、

・Tweenerを利用する場合は、TweenerThreadを利用する。

・TweenerThreadはスペシャルプロパティも利用可能。

ってこと。ただ、スペシャルプロパティを利用する場合は、ちゃんとColorShortcuts.init()とかで初期化してあげないといけないです。





以下、ソースです。


続きを読む "そうめんをさわってみた その3"

| | コメント (0) | トラックバック (0)

そうめんをさわってみた その2

P_2






















そうめん練習中。

今回は画像を読み込んでみました。

今回の処理の流れは、「画像のデータが書かれているXMLを読み込む→XMLからデータを取り出して、画像を読み込む準備をする→画像が全部読み終わったら表示させる」 って感じです。

画像やXMLなどの外部ファイルを読み込んだりするスレッドは、URLLoaderThreadを利用します。

「画像を全部読みこむ」って処理は、ParallelExecutorってのを利用します。

これは、「登録された処理を同時開始して、全部終わったら次の処理へ進む」ってが出来ます。

同じようなので、SerialExecutorってのもあります。

これは、「登録された処理を順番に開始して、全部終わったら次の処理へ進む」ってをやります。

読み込み処理をまとめることができるのはすごいうれしいです。





今回覚えたことは、

・joinメソッドで、そのスレッドが終了するまで、その呼び出した側のスレッドを中断させる。

・処理をまとめるのはParallelExecutorとSerialExecutor。

・エラーハンドラはerror()で登録する。





今回はこんな感じ。

以下、ソースです。

画像とか全部まとめたのはこちらです。




続きを読む "そうめんをさわってみた その2"

| | コメント (0) | トラックバック (0)

そうめんをさわってみた その1

P






















後輩と一緒にそうめん勉強中。

サンプルたくさんあったので、それを見ながら勉強中。

ものすごい基本中の基本をやってみました。

こんな感じです。

そうめんってのは、スレッド(処理の流れのこと)を扱うことができる、疑似スレッドライブラリです。

「こうやって、次にああやって、最後にこうする」みたいな、順序立てたプログラミングが簡単にできます。

Javaでスレッドをやったことのある人とかはとっつきやすいかも。

今回は、「円を書く→1秒停止→円の色を変える→1秒停止→円の色を変える→1秒停止→円を消す」ってのをスレッドで操作しています。

こういうのを何も使わずに書くと割りとめんどいのが、そうめん使うと簡単にできます。





今回覚えたこととしては、

・最初にライブラリの初期化を行う。初期化がすでに行われているかどうかは、Thread.isReadyで調べることが出来る。

・Threadクラスを継承したクラスを作成して、runメソッドをオーバーライドする。そんで、startメソッドでスレッド開始。

・nextで次に実行する関数を決定できる。

・次に実行するスレッドが指定されていない場合は、finalizeメソッドが実行される。これは、エラー処理後でも実行される。





とまあこんな感じ。

以下、ソースです。

続きを読む "そうめんをさわってみた その1"

| | コメント (0) | トラックバック (0)

2009年4月 4日 (土)

AIRでのリサイズを禁止する

Adobe AIRで作成したアプリは、右下をマウスでドラッグして自由にリサイズができます。

これのリサイズ許可/禁止を自由に設定したい場合の話。

WindowedApplicationの「resizable」プロパティを利用してリサイズを禁止することができるんですが、これは途中で変更することができず、最初での決め打ちになります。

そこで、

private function init():void
{
    stage.nativeWindow.addEventListener(NativeWindowBoundsEvent.RESIZING, onResizing);
}


private function onResizing(e:NativeWindowBoundsEvent):void
{
    e.preventDefault();
}

って書いて、イベントをキャンセルしちゃいます。

上のinit()関数はapplicationCompleteで実行させます。

Flex/AIRでstageにアクセスできるのは、applicationCompleteからです。

これでリサイズ不可に(マウスのリサイズが出来ないだけで、最大化などは可能です)。

またリサイズをやりたい場合は、removeEventListenerを利用してイベントを外します。





| | コメント (0) | トラックバック (0)

マウスでスクロールするメニュー

P





















マウスの位置を利用して、メニューをスクロールするやつ。

こちらを参考にさせてもらいました。

こんな感じです。

割と簡単に実装できるもんですね。






ソースは右クリックから見れます。


| | コメント (0) | トラックバック (0)

2009年3月 4日 (水)

wonderflに投稿してみました 13

ランダムテキストです。

これ系はカッコよくて好きです。



最近は先輩に教わりながらCentOSでサーバー立ててます。

| | コメント (0) | トラックバック (0)

2009年3月 3日 (火)

wonderflに投稿してみました 13




なんとなく作った。

最近はFlexでHP何個か作ってます。



| | コメント (0) | トラックバック (0)

2009年2月27日 (金)

Progressionに手を出してみる

P2_6




















去年から流行しまくりのProgression

今まではFlexメインでの開発だったんですが、手を出してみることにしました。

本家サイトのドキュメントを丸パクリしながらサンプルを作ってみました。

FlexBuidlerでの開発方法が調べても出てこなかったので完全に自己流。



・新しいプロジェクトを作って、Preloader以外のswfを作って、リリース。

・Preloaderのプロジェクトを別に作って、最初に作ったswfをもってきて、リリースして公開。


みたいな流れ。

超力技です。

作ったサンプルはこんな感じです。

シーンが3つ作ってあって、ボタンで各シーンに移動します。

ソースは、メインシーンはこれで、プリローダーはこちらです。



まあJavaScript関係なにもしてないから当然の如くディープリンクなし。

やっぱCS3 + FDかな。

| | コメント (0) | トラックバック (0)

2009年2月17日 (火)

PV3DとBox2Dでドラッグしたり

P2_5





















暇を見て、PV3DとBox2Dの組み合わせを再び。

ドラッグ機能をつけました。

こんな感じです。




参考にさせてもらったPV3D + Box2Dでのドラッグのサンプルは、こちらのサイトや、先日clockmakerさんが公開したこちらです。

両方に共通しているのは、独自のイベントを作成して利用していることです(Pv3dArrayEvent だっけかな)。

今回は2つのサイトを参考に可能な限り簡単に書こうと思い、独自イベントを用いずに、1つのファイルにまとめて書きました。

全部で300行くらいです。

ソースは右クリックで見れます。

Box2Dのバージョンは2.0.1です。




本当はReflectionViewを利用したかったんですが、

ブラウザをリサイズするたびに鏡面が上下にずれまくって使い物にならなかったんでやめた。

私の利用方法が悪いんでしょうかね。

ここはちょっと調べる。







(追記)

ReflectionViewで鏡面がずれる結果が一応わかりました。

リサイズイベントでstageにアクセスしてるのが原因っぽい。

そこをコメントアウトしたらずれない様になった。

なんでこうなるのかは不明。

同じようなエラーのプログラムも見当たらないし。

あー何でだ。

| | コメント (0) | トラックバック (0)

2009年2月15日 (日)

大画面FLV + ドットパターン

P2_4





















詳しくはこちらで解説されています。




たまに見かける全画面にflv動画が流れているフルフラッシュのサイトをみかけます。

普通、flvを拡大すると画像が荒くて見てられないものですが、その上にドットのパターンを乗せると不思議とかっこよく見えてしまいます。

やり方は参考サイトのものをそのまま使わせてもらいます。

ドットのパターンを作成して、それを利用してbeginBitmapFillで塗ったものを上に乗せるだけ。

サンプルとして、こんなの作ってみました。

ボタンでドットの有無を選択。

ドットがないと見れるもんじゃない。

今回は、Spriteにパターンを描写してVideoDipsplayにaddChildしました。




簡単で効果的な手法だと思います。

勉強になった。

| | コメント (0) | トラックバック (0)

wonderflに投稿してみました 12



エフェクトをいじる。

マウスの場所によって色が変わるけど計算は適当だからあんまきれいじゃない。

ちょっと残念。


| | コメント (0) | トラックバック (0)

2009年2月13日 (金)

AVM2にAVM1のSWFをロード

タイトルの通りです。

後輩が、FlashCS3使ってswf読み込みたいんだけどエラー起こるから何とかしてってことで。

読み込もうとすると、「flash.display::AVM1Movieをflash.display.MovieClipに変換できない」ってエラーが起きます。

無理矢理読み込むには、ByteArrayで読み込んでヘッダを書き換えてやらないといけない。

めんどくさいので、Beinteractiveさんが公開しているForcibleLoaderってのを利用。

これを使うと簡単に読み込めます。

これで解決。




卒論発表終わりました。

何とかなったと思う。

| | コメント (0) | トラックバック (0)

2009年2月 9日 (月)

wonderflに投稿してみました 11




BitmapDataでのエフェクトの練習。

卒論も何とかなりそうだし、基本をやり直そうと思いまして。

理想としては、カラフルなもやみたいな、雲みたいなのを作りたいんです。

カーブを描く動きは、Tweenerのスペシャルプロパティを利用しています。





| | コメント (0) | トラックバック (0)

2009年2月 8日 (日)

wonderflに投稿してみました 10




PV3DのCubeに、Flexコンポーネントを無理矢理貼り付けました。

コンポーネント自体は、黒いCanvasで隠してあります。

もっとスマートな隠し方ないですかね。



| | コメント (0) | トラックバック (0)

wonderflに投稿してみました 9




球体配置。

前、FP10で作ったのをPV3Dで作り直し。


| | コメント (0) | トラックバック (0)

2009年2月 5日 (木)

wonderflに投稿してみました 8



前作ったのをPV3Dで作り直す。

PV3Dは、カメラを動かすのが簡単。

| | コメント (0) | トラックバック (0)

2009年2月 3日 (火)

wonderflに投稿してみました 7



また投稿。

Vectorvision3DがPV3Dに統合された感じですか。

ただ、

・Word3D → Text3D

・VectorShapeMaterial → Letter3DMaterial 

という風に、多少名前が変わってるので注意。

そこ以外は同じです。


| | コメント (0) | トラックバック (0)

wonderflに投稿してみました 7

Papervision3Dが利用可能になったみたいなので。

とりあえず以前作ったのを投稿。





待ちに待ったPV3Dの利用可能のニュース。

面白い作品がどんどん投稿されるでしょう。

楽しみです。



| | コメント (0) | トラックバック (0)

2009年1月23日 (金)

wonderflに投稿してみました 6





2つ投稿。

論文とりあえず形になりました。

wonderflに逃げまくってたから結構焦ってたんですけど、何とかなった。

いやーよかったー。


| | コメント (0) | トラックバック (0)

2009年1月20日 (火)

wonderflに投稿してみました 6




以前、Papervision3Dでこいうのを作ったが、それをFP10の3Dを使って作りなおし。

最近はZソートの方法がいろいろ出てきているから、単純な3D表現なら簡単にできていいです。

これでCubeとかプリミティブが普通に実装されたら楽なんですけどね。

たぶんないと思いますけど。


| | コメント (0) | トラックバック (0)

2009年1月19日 (月)

wonderflに投稿してみました 5




メビウスの輪。

前Papervision3Dで作ったやつをFP10の3D機能を利用して作成。

あー論文実験やり直しー。



| | コメント (0) | トラックバック (0)

wonderflに投稿してみました 4




またまた投稿。

今度は渦巻きです。


| | コメント (0) | トラックバック (0)

2009年1月18日 (日)

wonderflに投稿してみました 3



またwonderflに投稿してみました。

前作ったやつをFlickrと連動するようにしただけ。

画像を取ってきてkuwaharaっていう手法で画像処理を。

スペックによっては重いかも。




全国の卒論に追われている学生のみなさん。

一緒に頑張りましょう。

締め切りまであと少しです。


| | コメント (0) | トラックバック (0)

wonderflに投稿してみました 2



調子にのってもう1本。

以前再帰の復習で作ったフラクタルです。

論文かけないです。

wonderflで現実逃避。

| | コメント (0) | トラックバック (0)

wonderflに投稿してみました。

論文書くのに飽きたんで、ちょっとコードを書きました。

で、そのまま投稿してみた。

wonderflはとても勉強になります。

もっと勉強しよう。

| | コメント (0) | トラックバック (0)

2009年1月 8日 (木)

3D表現

P_32



















Papervision3DやFlashPlayer10の機能を使わないでの3D表現。

一応は3Dっぽく見えると思うんですが。

こんな感じです。

もっと勉強せんといかん。

ライブラリを利用せずにこういった表現が自由に出来るようになるといいよね。






以下、ソースです。

続きを読む "3D表現"

| | コメント (0) | トラックバック (0)

2009年1月 6日 (火)

WonderflでAS3.0の勉強 その2

P_31





















FlashPlayer10の、3Dの話です。

ちょっと前に、Zソートのライブラリを試しましたが、ライブラリを使わず、配列のソートを利用してZソートをしているのを見つけました。

こちらです。

参考に、自分もプログラムを組んでみました。

こんな感じ(要FlashPlayer10)にちゃんとソートできます。

というか簡単にZソートが出来てしまった。

いやー参考になった。

あと、FlashPlayer10の3Dは、消失点をしっかり定義してあげないと自分の思ったとおりに表示されないみたいです。

デフォルトだと左上が設定されているっぽいです多分。

ちゃんと設定したほうがいいですね。







以下、ソースです。

続きを読む "WonderflでAS3.0の勉強 その2"

| | コメント (0) | トラックバック (0)

2008年12月30日 (火)

FlexとBox2DFlashAS3 その3

P_30























ちょっと前の記事の更新。

以前は、「Flexではstageにアクセスしてはいけない」と訳のわからない思い込みをしていました。

なんじゃそりゃ。

Flexでは、stageはcreationCompleteの時点ではまだnullの状態で、ApplicationCompleteの段階でアクセスできるようになります。

これさえ守れば、FlexでもstageアクセスOK!。

こんな感じに、Box2DのInputも動きます。

ちょっと前は、これに気づかず焦りまくってました。







ソースは、右クリックからソースの表示でお願いします。

バージョンは2.0.1を利用しています。

| | コメント (0) | トラックバック (0)

2008年12月26日 (金)

WonderflでAS3.0の勉強

P_29




















wonderflが大流行ですね。

ソースを見ることが出来るのがとても助かります。

ビジュアル面で強いプログラムが多いので、ソースを参考にしながらいろいろ勉強していこうと思います。

今回は、こちらのプログラムがとても綺麗だったので、参考にさせてもらいました。

こんな感じです。





以下、ソースです。

自分もアカウント作って、何か投稿してみるか。

続きを読む "WonderflでAS3.0の勉強"

| | コメント (0) | トラックバック (0)

2008年12月25日 (木)

マウスに連動して動かす 2

P_28





















この間の記事をイージングっぽくしてみました。

こんな感じです。

こっちのほうがいいよね。

前回の記事の、フレームイベントの中身を、

rotate += (-viewport.containerSprite.mouseX/15 - rotate)*0.1;


って書き換えればイージングの完成。

rotateは外部変数で定義してください。

お手軽アニメーション。

| | コメント (0) | トラックバック (0)

2008年12月16日 (火)

マウスに連動して動かす

P_27






















久々にPapervision3DでのFlashプログラム。

論文はなんとか今年中に終わりそうです。

さて、マウスに連動して円状に動くメニューみたいなやつ。

要はこんなやつです。

PV3Dの場合、最初に円状に配置してしまえば、フレームイベントでいちいち座標を再計算をすることなく、マウスに連動して回転させることができます。

iewport.containerSprite.mouseXでマウスの座標が原点を中心にして取ってこれるので、それを利用するだけです。

詳しくはソースのフレームイベントの部分を見てください。

ああ久々にFlash書いた。

Alchemyやりたい。







以下、ソースです。

続きを読む "マウスに連動して動かす"

| | コメント (0) | トラックバック (0)

2008年12月10日 (水)

ランダムテキスト その2

P_26





















ランダムテキストの続編。

今度は横から1文字ずつ変わっていきます。

マトリッックスっぽい感じを出したかったので。

こんな感じです。






以下、ソースです。

続きを読む "ランダムテキスト その2"

| | コメント (0) | トラックバック (0)

2008年12月 9日 (火)

ランダムテキスト

P_25























テキスト系のアクセントに何か欲しかったので。

ランダムテキストってやつです。

こんな感じです。

割ときれいに出来たと思います。







以下、ソースです。

RandomTextってクラスを作って、それを利用するようにしています。

続きを読む "ランダムテキスト"

| | コメント (0) | トラックバック (0)

2008年12月 8日 (月)

FlexにSpriteを追加

久々にプログラム。

後輩に聞かれたので。

自分が知っているFlexにSpriteを追加する方法は4通りあります。

// 方法1:SWFLoaderを利用する
var sp1:Sprite = new Sprite;
var loader:SWFLoader = new SWFLoader;
loader.source = sp1;
addChild(loader);


// 方法2:rawChildrenにaddChildする
var sp2:Sprite = new Sprite;
rawChildren.addChild(sp2);


// 方法3:Imageを利用する
<mx:Image id="myImage"/>
var sp3:Sprite = new Sprite;
myImage.addChild(sp3);


// 方法4:UIComponentを利用する
var sp4:Sprite = new Sprite;
drawCircle(sp4.graphics,0xffff00);
var ui:UIComponent = new UIComponent;
ui.addChild(sp4);
addChild(ui);


こんな感じですか。

他にどんな方法があるんでしょうか。




| | コメント (0) | トラックバック (0)

2008年11月18日 (火)

パーティクルの練習

P_24





















こちらのサイトに、パーティクルのサンプルのソースコードがたくさんあったので。

ここにあるソースコードを全部読めば、パーティクルの基本的なものは一通りできるようになると思う。

自分も、いくつかサンプルをまねてみました。

こんなのとか、こんなのとか、こんなのとか。

パーティクルは、自由に使えるようになると楽しいですね。

自分のソースをまとめたものはこれ


| | コメント (0) | トラックバック (0)

2008年11月16日 (日)

エッジ保存平均化

P_23






















Kuwaharaというもので、こちらを参考にさせてもらいました。

元の画像はこんな感じ。


Img















これにフィルタをかけると、こんな感じになります。

けっこうきれいにできたんでよかった。

でもちょっと重いです。





以下、ソースです。

続きを読む "エッジ保存平均化"

| | コメント (0) | トラックバック (0)

2008年11月10日 (月)

FlexのCamera

P_22





















急にカメラを使いたくなったんで。

少しやってみました。

こんな感じです。

本当は、絵画風のフィルターとかいろいろやってみたんですけど、毎フレームでの適用には重い。

残念。




こちらのサイトを参考にさせてもらいました。

磨りガラスを表現する - NORISUKE WORKS

Visual C++で画像処理ソフトを作ってみる

Visual C++ 2005 Express Editionを用いた易しい画像処理(7)―― 画像の絵画調化(油絵化の場合)――

2008-11-09 - flashrod AS3で画像処理入門(その4)

| | コメント (0) | トラックバック (0)

2008年11月 7日 (金)

FlashPlayer10でZソート

P_19





















FlashPlayerの3D表現は、Zソートがありません。

そういうガチの3D表現は他のライブラリで補おうという考えらしいですが。

Zソートのクラスを作った人がいます。

さっそく利用させてもらいました。

とりあえずサンプル(要FlashPlayer10)。

きれいにソートされています。

これはうれしい。

| | コメント (0) | トラックバック (0)

2008年11月 5日 (水)

Flexでカスタムプリローダー

P_18





















Flexでプリローダーをカスタマイズする手段の一つに、PreloaderDsiplayインターフェイスを利用する方法があります。

詳しくはこちらのサイトを。


ひこにゃんが Flex アプリケーションにカスタム プリローダーをお勧めする3つの理由 - 親方、空から覚え書きが!


プログレスイベントを使ったことのある人ならば、簡単にオリジナルのプログレスバーが作成できます。

こんな感じです。

うん。いい感じ。

| | コメント (0) | トラックバック (0)

2008年10月28日 (火)

FlashPlayer10で音を作る

P_17





















「ドレミファソラシド」を作ってます。

こちらを参考にしました。

画面をクリックすると音が変わります。

こんな感じになりました。

もう少し勉強が必要。




| | コメント (0) | トラックバック (0)

2008年10月27日 (月)

FlashPlayer10で音をいじる

P_16





















FlashPlayer10では、音の動的生成ができます。

で、とりあえずいじってみようと。

こちらを参考にいろいろやってみました。

こんな感じです。

ローカルのMP3を取り込んで、そのピッチを変更しています。




--------------------------------------------------------
2007/10/30 ソース改造

ちょっと改造しました。
--------------------------------------------------------

| | コメント (0) | トラックバック (0)

2008年10月26日 (日)

FlashPlayer10で画像読み込みと保存

P_15






















ローカルの画像を読み込んで、フィルタをかけて、保存。

こんな感じになりました(要FlashPlayer10)。

あんまり大きい画像を読み込まないようにしてください。

重いと固まるかも・・・。

フィルタは全部コンボリューションとカラーマトリックスで。

お手軽画像処理。

ローカルを通しての読み込みや保存が簡単に行えるのはうれしいです。



-----------------------------------------------------------
10/27  更新

ちょっと改造。大きな写真はリサイズして利用するようにしました。
-----------------------------------------------------------


| | コメント (0) | トラックバック (0)

2008年10月25日 (土)

FlashPlayer10でFileReference

P_14





















そろそろFlashPlayer10も触ってみようと思う。

とりあえず1作目。

ローカルのMP3を読み込んでスペクトラム。

こんな感じになりました(要FlashPlayer10)。

ByteArrayからサウンドに変換するには、こちらを利用しています。

SoundクラスはByteArrayを読めないので、こんなのがあると便利です。






ソースは、右クリックの「ソースの表示」でお願いします。

| | コメント (0) | トラックバック (0)

2008年10月15日 (水)

FlexでHPみたいなの

P_11





















Flexでなんか作ってみようと思いまして。

HPみたいなのを作ってみようと思い、その思いのままに作ってみる。

とりあえず最初の演出みたいなのを。

とりあえずvectorvisionを利用。

こちらや、こちらのサイトがカッコよすぎなんで、まんまパクリ。

友人に味気ないと言われたんで、Box2Dで周りに何かを散らしてる。

結果、ごちゃごちゃして見づらくなったような・・・。

こんな感じになりました。

メニュー画面に移行したあとは、まだ何も考えていないのでとりあえずな感じ。

このHPうまくいったら何かに使おう。







ソースはごちゃごちゃしてるんで、あとで公開します。

Box2Dのバージョンは2.0.1です。






------------------------------------------------------------------
2008/10/19  追記


かなり適当ですが、形にしたんでソースを公開します。

右クリックからソースの表示でお願いします。

適当に1つのファイルにまとめて書いたんで、かなり見にくいですが・・・。
------------------------------------------------------------------

| | コメント (0) | トラックバック (0)

2008年10月 5日 (日)

Papervision3Dをやってみた48

P_10





















vectorvisionでちょっと気になること。

イベント追加の話。

まずはマテリアルのinteractiveをtrueにします。

Word3D自体にイベントを追加しても何も起こらなかったので、lettersプロパティの中にあるDisplayObject3Dに対してイベントを追加する。

これなら動いた。

Tweenerで色もトゥイーンしたかったけどそれはできなかった。

残念。

とりあえず、こんな感じ

文字をクリックすると、動きます。






以下、ソースです。

続きを読む "Papervision3Dをやってみた48"

| | コメント (4) | トラックバック (0)

2008年10月 4日 (土)

FlexでDisplayShelf

P_9






















これも有名だと思います。

DisplayShelfです。

こんなのが、簡単に作れてしまう。

すごい。

すごいの一言です。

SeletedIndexで選択された画像もとってこれるので、いろいろできそう。

| | コメント (2) | トラックバック (0)

FlexでFlexBook

P_8




















割と有名だと思う、FlexBookを使ってみました。

基本的な使い方としては、こんな感じで、タグの中に表示したいものを書き込む簡単な方法や、こんな感じで、itemRendererとXMLListで制御する方法があります(右クリックからソースを見てみてください)。

かなり苦手な感じだったけど、やってみたら割と簡単だった。

ただ、プロパティの意味や、イベント関係がまだよくわかっていない。

サンプルソースがしっかりしているので、それを見ながらもう少し遊んでみます。

| | コメント (0) | トラックバック (0)

2008年9月29日 (月)

Tweenerで色をトゥイーン

P_7




















Tweenerのスペシャルプロパティを利用して、色や明度を変更することができます。

こんな感じです。

緑 → 赤 → 黄色 → 元の色 → 明度変更 → 明度元に戻す        の順に変化します。

かなり便利。





Tweenerはいろいろなプロパティがあって、うまく使えばかなり便利。

参考になるサイトもいろいろあります。


Tweener のさらなる進化

Tweener拡張で、MovieClipをMatrixで超変形をできるようにした

Tweenerで色を変更する(_color)

Tweenerを使って画像の色を変化させるTips


うまく使いこなせるようになりたいもんです。






以下、ソースです。

続きを読む "Tweenerで色をトゥイーン"

| | コメント (0) | トラックバック (0)

FlexでGradientCanvas

P_6






















GradientCanvasというものを見つけました。

こんな感じに簡単にグラデーションのついたパネルを作成できます。

ソースコードも見れるので、いろいろ参考になります。

前からこんなのが欲しかったので、見つけることができてよかったです。

| | コメント (0) | トラックバック (0)

2008年9月28日 (日)

FlexとBox2DFlashAS3 その2

P_5






















久しぶりにBox2Dをいじる。

とりあえず、Flexと組み合わせて使えるようにする。


・ マウスでドラッグアンドドロップ

・ 壁は、画面と一緒にリサイズする

・ 円をクリックするとなんかイベント

・ 円が画面外に出ると作り直す


この4つを出来るようにしたい。

とりあえず、こんな感じになりました。





一番大変だったのはInputクラスの利用。

stageにアクセスするとエラーが起きてしまいました。

困っていたところ、きれいに拡張して利用しているサイトを発見。


Box2Dでサンプルアプリを作ってみました。(PHP,MySQL,Flexな日々+イラストとか )


まんま利用させてもらってます。

前々から困っていた部分だったので、解決してよかったです。




ソースは、右クリックの「ソースの表示」でお願いします。

バージョンは2.0.1です。




---------------------------------------------------------------

2009/1/3 追記

Flexでもちゃんとstage使えました。

こんな感じです。

---------------------------------------------------------------

| | コメント (0) | トラックバック (0)

2008年9月27日 (土)

Papervision3Dをやってみた47

P_4





















球体配置の続き。

まだ挙動がかなりおかしいし、エラー処理もしてませんけど。

一応こんな感じかな。

画像はFlickrから取ってきてます。

あと、クリックすると、画像がピクセル等倍で表示されるはず。

カメラを動かすか画像を動かすか悩んだけど、画像のほうが楽です。

こんな感じです。








以下、ソースです。

(2009/3  ソース直しました。)

続きを読む "Papervision3Dをやってみた47"

| | コメント (0) | トラックバック (0)

2008年9月26日 (金)

Papervision3Dをやってみた46

P_3






















前回の記事を改造。

結局、普通にサインコサインを利用して計算することにしました。

というわけで、サンプルはこちらです。

やっぱこっちのほうが好き。









以下、ソースです。

(2009/3  ソース直しました。)

続きを読む "Papervision3Dをやってみた46"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた45

Photo























球体配置を少しいじる。

Tweenerでカメラを動かしてみた。

Planeをクリックしてみてください。

こんな感じになります。

rotationを計算してないからただ視点とカメラの位置がターゲットに寄るだけ。






ちなみに、planeの位置を獲得する場合は、シーン上の位置が欲しいのでsceneXプロパティなどを利用する。

あと、カメラの視点をTweenerで利用する場合は、targetプロパティのxyzを動かす。

ここらへんは覚えておくと便利です。






以下、ソースです。

(2009/3  ソース直しました。)

続きを読む "Papervision3Dをやってみた45"

| | コメント (0) | トラックバック (0)

2008年9月25日 (木)

Papervision3Dをやってみた44

P_2





















ViewportLayerを利用すれば、フィルターを利用できます。

下のように利用できます。

var  p:Plane = new Plane(mat, 100, 100);
var vpl:ViewportLayer = p.createViewportLayer(viewport, true);
vpl.filters = [ new BlurFilter(4,4,1) ];

useOwnContainerを利用する方法もありますが、これだとイベントが使えなくなる(何故)。

var  p:Plane = new Plane(mat, 100, 100);
p.useOwnContainer = true;
p.filters = [ new BlurFilter(4,4,1) ];

手軽にフィルターが利用できるのは便利です。

こんな感じに。ViewportLayerを利用しています。









以下、ソースです。

続きを読む "Papervision3Dをやってみた44"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた43

P





















円配置。

各Planeに動いてほしかった。

これを作りたかったもんで。

こんな感じになりました。

簡易版って感じ。

もう少しいじりたい。







以下、ソースです。

(2009/3  ソース直しました。)

続きを読む "Papervision3Dをやってみた43"

| | コメント (0) | トラックバック (0)

2008年9月19日 (金)

アルファマスク

Photo_7





















自分用の備忘録で。

マスクにBlurFilterやアルファ値の変更を適用したい場合。

マスクを適用する側と、マスクになる側の両方のcacheAsBitmapをtrueにしないといけない。

そうしないと全く適用されない。

設定をするとこんな感じできれいになる。

忘れてて焦った。





一応ソース。

続きを読む "アルファマスク"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた42

Photo_6





















FogMaterialってのがあります。

全体に霧がかかったようなかんじになります。

まだ使い方がよくわかりませんが、簡単に霧が表現できます。

こんな感じになります。








以下、ソースです。

続きを読む "Papervision3Dをやってみた42"

| | コメント (0) | トラックバック (0)

2008年9月14日 (日)

sketchbookを使ってみる。

Photo_5




















sketchbookを使ってみました。

色々な図形が簡単に書けます。

星とか扇型とかサクサク。

こんな感じです。

HSVとRGBの変換関数なども用意されていて、便利。

Spriteがぐっと簡単に扱えていいです。







以下、ソースです。

続きを読む "sketchbookを使ってみる。"

| | コメント (0) | トラックバック (0)

2008年9月11日 (木)

Papervision3Dをやってみた41

Photo_4






















vectorvisionってのがあるそうで。

ちょっくら使ってみました。

文字とか奇麗に利用できるのはうれしい。

svgファイルも使えるみたいだし。

同梱されているサンプルファイルがものすごくわかりやすい。

とりあえず、こんなの作ってみました。

サンプルをちょっとだけいじっただけです。

エフェクトを追加したのはこっち。

いや、いいですよこれ。







以下、ソースです。

続きを読む "Papervision3Dをやってみた41"

| | コメント (2) | トラックバック (0)

2008年8月29日 (金)

Papervision3Dをやってみた40

Photo_3






















エフェクトとスペクトラムの組み合わせ。

思ったより重くない。

こんな感じです。

横に長いのを作っちゃったので、うまく表示されない場合は、最大表示にしてからリロードしてみてください。






以下、ソースです。

(2009/3 ソース直しました。)

続きを読む "Papervision3Dをやってみた40"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた39

Photo_2





















久しぶりにエフェクト。

BlendModeをADDにしたから、色の混ざったところが白くなってきれい。

こんな感じです。

しかし、最近エフェクトがすごく軽くなって、実用的になってきた。

エフェクトでなにか作ってみようか。






以下、ソースです。

続きを読む "Papervision3Dをやってみた39"

| | コメント (0) | トラックバック (0)

2008年8月28日 (木)

FlexでLive reflection

Photo





















Live reflection component ってのを使ってみました。

鏡面反射が簡単にできます。

こんな感じ

もう簡単すぎる。






ソースは、右クリックから「ソースの表示」でお願いします。

広告だらけで見づらいですが、ご勘弁を。

| | コメント (0) | トラックバック (0)

FlexでDistortionEffects

P_27





















DistortionEffectsってのを使ってみました。

以前、先輩が使ってて面白そうだったんで。

いろんなエフェクトが入ってて面白い。

こんなのを作ってみました。

viewをクリックしてみてください。

うわ、簡単ですごいわこれ。







ソースは、右クリックから「ソースの表示」でお願いします。

広告だらけで見づらいですが、ご勘弁を。

| | コメント (0) | トラックバック (0)

FlexでFire

P_26





















有名どころ、flexlibを使ってみました。

いろいろ入ってますが、Fireがお気に入り。

サンプルにもあるように、設定次第でいろいろ表現できる。

とりあえず、こんなの作ってみました。

本当に数行でできてしまう。すごいわ。







ソースは、右クリックから「ソースの表示」でお願いします。

広告だらけで見づらいですが、ご勘弁を。

| | コメント (0) | トラックバック (0)

FlexでPrimitive

P1_2





















Flexって、いろいろ外部ライブラリとかあるんです。

そんで、それらを少しずつ使ってみようと思いまして。

とりあえず、有名なPrimitive Explorerから。

ソースコードが公開されています。

とりあえず、こんな感じ。

ただ図形を描いただけ。

星とか、扇形とかが簡単に書けるのはうれしいです。






ソースは、右クリックから「ソースの表示」でお願いします。

広告だらけで見づらいですが、ご勘弁を。

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた38

P_25






















collada形式のファイルを読み込む。

テクスチャとかいろいろあって、正直よくわからない。

まあ表示されているし大丈夫なのかな。

モデルのデータに関してはSketchupを利用。3Dギャラリーから探してきました。

kmzファイルで書き出して、「.kmz」を「.zip」にリネーム。

解凍すると、中に.daeファイルがあるんで、それを読み込みます。

とりあえず、こんな感じに。

本当にとりあえずな感じです。





テクスチャの画像は、MaterialListにして渡すので、Embedなりして読みこまなければいけません。

画像が大量にあってもです。

ああめんどい。

そう思っていたら、Embed Generatorなるものを発見。

おおこりゃ便利。

これで、大量のコードも簡単に書き出せます。

今回は画像が少なかったから手打ちだったけど、大量の画像を扱う場合は重宝しそうです。







以下、ソースです。

続きを読む "Papervision3Dをやってみた38"

| | コメント (0) | トラックバック (0)

2008年8月26日 (火)

扇形を書く

P_24






















最近はめっきりFlashに触れられなかったので。

本当に久しぶりにActionScriptを。

扇形を書きたくなったので、挑戦。

まさに理想のソースがこちらにあったので、参考にさせてもらいました。

とゆーか、ほとんど流用させてもらいました。

よって今回はソースはなし。

サンプルはこちら

ランダムな色で扇形を書くだけ。




扇形の書き方は、参考にさせていただいたこちらのサイトをご覧になったほうがよいかと。

非常に丁寧に説明されています。

いや、素晴らしい。

| | コメント (0) | トラックバック (0)

2008年8月15日 (金)

Papervision3Dをやってみた37

P_23





















大量のsphere。

Flash CS3が利用できたので、円をswfで作成して、planeに貼り付けて、おしまい。

とりあえず1500個。

こんな感じです。

画像よりswfの方が軽くなるってどっかで聞いたことがあるようなないような。





以下、ソースです。

続きを読む "Papervision3Dをやってみた37"

| | コメント (0) | トラックバック (0)

2008年8月14日 (木)

Papervision3Dをやってみた36

P_22























遊びで、鏡面反射のメニューを。

こんな感じです。

鏡面反射で悩むのももうすぐ終わりそう。

ReflectionViewクラス登場です。








以下、ソースです。

続きを読む "Papervision3Dをやってみた36"

| | コメント (0) | トラックバック (0)

2008年8月10日 (日)

Papervision3Dをやってみた35

P_21






















ReflectionViewってのが実装されたみたいですね。

こちらを参考にさせたもらいました。

サンプルはこちら

Papervision3Dで手軽に鏡面反射ができるようになりそうです。






以下、ソースです。

続きを読む "Papervision3Dをやってみた35"

| | コメント (0) | トラックバック (0)

2008年8月 2日 (土)

Papervision3Dをやってみた34

P_2






















バージョンアップにともなって、多少エフェクトの書き方が変わったみたいなので。

以前作成したものを書き直し。

こんな感じです。

以前作ったエフェクト関係も全部書き直しました。









以下、ソースです。

続きを読む "Papervision3Dをやってみた34"

| | コメント (0) | トラックバック (2)

Papervision3Dをやってみた33

P_20





















カメラとの距離によってぼやけたり。

こんな感じです。

参考にさせてもらったサイトはこちら








以下、ソースです。

続きを読む "Papervision3Dをやってみた33"

| | コメント (0) | トラックバック (0)

2008年7月31日 (木)

Papervision3Dをやってみた32

P_19





















鏡面反射とスペクトラムです。

この間の鏡面反射クラスをいじりました。

こんな感じです。

スペクトラムが再描写されると、ちゃんと鏡面も更新されてます。








以下、ソースです。

(2009/3 ソース直しました。)

続きを読む "Papervision3Dをやってみた32"

| | コメント (0) | トラックバック (0)

2008年7月29日 (火)

Papervision3Dをやってみた31

P_18






















3Dでの鏡面反射の練習。

Planeなら簡単にできた。

結果はこんな感じ

視点によって鏡面に見えたり見えなかったり・・・・。

微妙な感じがします。







以下、ソースです。

ReflectionPlaneってのが鏡面反射の付いたPlaneクラスです。

とは言っても、Planeを拡張したわけではなく、Plane2枚をDisplayObject3Dに入れただけです。

続きを読む "Papervision3Dをやってみた31"

| | コメント (0) | トラックバック (0)

2008年7月24日 (木)

FlexでHPを作る 2

P_17






















前回の記事を手直し。

こんな感じです。

変更点は、

・FadeエフェクトをAnimatePropertyに変更(こっちのほうがいい感じに動いたから)。

・Galleryに、前作成したやつをのっける。

・各viewでのエフェクトを作成。

画像は相変わらずパワポ。

デザインの勉強したい。

とゆーかしよう。








ソースは、右クリックから「ソースの表示」でお願いします。

Papervision3DとTweenerが必要です。

| | コメント (0) | トラックバック (0)

FlexでHPを作る 1

P_16






















FlexとかAS初めて少したったし。

FlexでHPを作ろうと思いまして。

こんな感じになりました。

初めてこういうの作りました。

画像はパワポで作ってます。

友達にヘボすぎるって言われました。

しかし晒す!






ソースは、右クリックから「ソースの表示」でお願いします。

| | コメント (0) | トラックバック (0)

2008年7月20日 (日)

BitmapDataで何か 2

P_15





















直接BitmapDataの表示はしていませんが。

TextFieldをBitmapDataにdraw  →  BitmapDataから色を取ってきて、文字部分なら円を追加  みたいな感じです。

こんな感じです。

drawはなんでも描写できておもしろいです。







以下、ソースです。

続きを読む "BitmapDataで何か 2"

| | コメント (0) | トラックバック (1)

Papervision3Dをやってみた30

P_14




















試験の面接も終わったんで、久々のプログラム。

鏡面反射をやりました。

今までやってた鏡面反射の手法だと、どうしても平面が必要になる。

3Dっぽく鏡面反射できないかなーって考えて。

こんな感じに。

BitmapDataを利用。

正直、全然鏡面に見えない・・。







以下、ソースです。

続きを読む "Papervision3Dをやってみた30"

| | コメント (0) | トラックバック (0)

2008年7月 9日 (水)

スライドショー 2

P_13





















スライドショーその2です。

Flickrから画像を取ってきて表示してます。

検索タグは今回は「cat」で固定です。

最初のローディングアニメのswfの作成方法はこの前の記事で。

こんな感じになりました。





以下、ソースです。

--------------------------------------
2008/7/10  一部修正
--------------------------------------

気分で作っていったんで、いつも以上にソースが見づらい・・・。

画像とか、全部まとめたのはこちら

続きを読む "スライドショー 2"

| | コメント (0) | トラックバック (1)

2008年7月 8日 (火)

スライドショー

P_12





















Tweenerで、アルファ値を変えています。

こんな感じです。






以下、ソースです。

続きを読む "スライドショー"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた29

P_11




















パノラマです。

Flickrで写真を探してきました。

大きく写したかったので、でかい写真を選んだら重くなりました・・・。



シリンダーに画像を張り付けて、中にFreeCameraを置いて、おしまい。

こんな感じです。







以下、ソースです。

(注:最新のPapervision3DではFreeCamera3Dがありません。カメラの設定を変えて使ってください。)

続きを読む "Papervision3Dをやってみた29"

| | コメント (0) | トラックバック (0)

2008年7月 7日 (月)

Box2DFlashAS3をやってみた 8

P_10






















ジョイントでつないだだけです。

何かに使えないかなーって思って。

画像のBlendModeはBlendMode.LIGHTENで。

こんな感じです。




以下、ソースです。

バージョンは2.0.0です。

続きを読む "Box2DFlashAS3をやってみた 8"

| | コメント (0) | トラックバック (1)

2008年7月 6日 (日)

BitmapDataで何か

P_9





















RGBで分けてゆっくりと重ねる。

こんな感じになりました。

BlendMode.SCREENで重ねてください。






以下、ソースです。

続きを読む "BitmapDataで何か"

| | コメント (0) | トラックバック (1)

2008年7月 5日 (土)

今まで作ったのをいろいろ組み合わせてみる

P_8























今まで結構いろいろ作ってきたんで、組み合わせてなにかできないかと考えたもんで。

こんなの作ってみました。

やっぱり、Tweenerは便利です。アニメーションみたいな動きが簡単に出来るし。

最初の文字の動きはBox2D。

あとはPv3DとTweenerで動かしています。









以下、ソースです。

Box2Dのバージョンは2.0.0です。

Tweener、PV3D、Box2Dを利用して、がりがり書いていったんで、やたら長いですが・・・。

あと、ソースと使用した画像のセットはこちら

(2008/12 なんか急に文字が全部現れる前に落ちるようになってしまった・・・。)

続きを読む "今まで作ったのをいろいろ組み合わせてみる"

| | コメント (0) | トラックバック (0)

2008年7月 4日 (金)

Box2DFlashAS3をやってみた 7

P_7





















文字を落としてばらばらにします。

こんな感じです。

文字部分をSpriteで作成したので大変でした。

ソースもほとんどが文字部分の作成になってます。

もっとスマートなやり方があると思うんですが・・・。







以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3  ソース直しました。)

続きを読む "Box2DFlashAS3をやってみた 7"

| | コメント (0) | トラックバック (4)

2008年7月 3日 (木)

三角形の自由変形

P_6






















三角形の自由変形です。

こんな感じです。

こちらのサイトがすごく参考になりました。

特に行列の作成の方法。すごいです。





以下、ソースです。

続きを読む "三角形の自由変形"

| | コメント (0) | トラックバック (0)

2008年7月 2日 (水)

FlexとPV3D その4 を手直し

P_5


















この前作ったプログラムを手直しです。

みなさん情報提供ありがとうございました。

とりあえず、as3flickrlibは使うのをやめて、自分でXMLを解析していく方向に。

なんかこっちのほうが簡単だったかも・・・。

こんな感じになりました。

日本語は対応していないので注意してください。

あと、写真が球体を作成するのに足りない場合は、アラートが出ます。

たぶんうまく動くと思うんですが・・・。






ソースは右クリックから見れます。

(2009/3 ソース直しました)

| | コメント (0) | トラックバック (0)

2008年6月30日 (月)

平行四辺形の練習

P





















Matrixを利用すると、色々と変形ができます。

今回は平行四辺形の練習。

こんな感じです。

ドラッグがうまくいってないのは気のせいです。





以下、ソースです。

続きを読む "平行四辺形の練習"

| | コメント (0) | トラックバック (0)

2008年6月26日 (木)

Papervision3Dをやってみた28

P_4






















数式を利用して図形を作成。

色々作ってみました。

こんなのとか、こんなのとか、あと、こんなの

全部数式を利用して書きます。





今回は数式だけ。プログラムに利用してみてください。

forループでまわして、x、y、z座標を計算していきます。

最初のは、

var a:int=100;

for(var i:Number = 0 ; i<= 2*Math.PI ; i += 0.1){
     for(var j:Number=-0.4 ; j<=0.4 ; j+=0.1){
              x = a*(Math.cos(i) + j*Math.cos(i/2)*Math.cos(i));
              y = a*(Math.sin(i) + j*Math.cos(i/2)*Math.sin(i));
              z = a*j*Math.sin(i/2);
          }
   }

次のは、

var p:int=3;
var q:int=7;

for(var i:Number=-50*Math.PI ; i<= 50*Math.PI ; i += 0.1){
             x = Math.cos(i)*70;
             y = i;
             z = Math.sin(i)*70;

}

最後のは、

var p:int=3;
var q:int=7;
var a:int=50;

for(var i:Number=0 ; i<= 6*Math.PI ; i += 0.04){
             x = (2+Math.cos(q/p*i))*Math.cos(i)*a;
             y = Math.sin(q/p*i)*a;
             z = (2+Math.cos(q/p*i))*Math.sin(i)*a;
}

数式って、便利です。

| | コメント (0) | トラックバック (0)

2008年6月24日 (火)

FlexとPV3D その4

P1




















as3flickrlibってのを使って、Flickrから画像を取ってきて、球体に並べる。





こんな感じになります。


P2


































なぜかネットにあげるとうまく動かないので、今回はサンプルはなし。

ちゃんとローカルでは動くのに。

おかしい・・・。










以下、ソースです。

続きを読む "FlexとPV3D その4"

| | コメント (4) | トラックバック (0)

2008年6月23日 (月)

Papervision3Dをやってみた27

P_2






















前回の記事を改造。

こんな感じです。

直した部分は、座標を決めるところを

xxx = a*i*Math.sin(m*i)*Math.cos(n*i);
yyy = a*i*Math.sin(m*i)*Math.sin(n*i);
zzz = a*i*Math.cos(m*i);

と直して、あとで線が消えていく部分を追加。

dtime = dtime / 4;
for(var i:Number = 0 ; i<= 12*Math.PI ; i += 0.03){
    var ll:Lines3D = rootNode.getChildByName("line"+i.toString()) as Lines3D;
    Tweener.addTween(ll, {scale:0, time:2, delay:dtime, onComplete: function():void
                    {
                       rootNode.removeChild(ll);
                    }});
    dtime += 0.04;
}

| | コメント (0) | トラックバック (0)

2008年6月22日 (日)

Papervision3Dをやってみた26

P_3






















こちらの記事より。

確かに楽に出来ました。

こんな感じです。

PV3Dは変に座標で悩まなくてもいいのが楽です。








以下、ソースです。

(2009/3 ソース直しました。)

続きを読む "Papervision3Dをやってみた26"

| | コメント (0) | トラックバック (0)

今日気になった記事 2

3D系の記事。やっぱり疑似3Dで行かないと、sphere4000個とかは厳しそう・・・。

ActionScriptによるWebの3Dグラフィックス再入門

AS3.0 で 3D プログラミングを1から勉強する (1)

【CG教科書】

2D感覚で3D処理するActionScriptクラスライブラリ (FIVe3D)






3Dの素材。PV3Dで利用できそうなのがちらほら。

メタセコ素材!

3D MATERIAL

| | コメント (0) | トラックバック (0)

花火みたいなやつ

P_14





















この記事のプログラムが個人的にものすごくツボにはまったので、ソースを見ながら何をしているのかを頑張って考える。

なんとか出来ました。

こんな感じになりました。

さくーしゃさん凄い。





このプログラムのポイントは、Bitmapのブレンドです。

何もしていない画像と、4分の1をにした画像を拡大してぼやかした画像をBlendMode.ADDで重ねることで各点が絶妙に綺麗に輝く感じになります。

拡大しただけだとぼやけすぎて汚いし、最初から大きいサイズで描写すると輝くわけもなくただの粒になります。

2つの画像を重ね、BlendMode.ADDに設定することで、綺麗に輝くわけです。

これには本当に感動しました。

画素の動きはパーティクルと同じ。

文字に降り積もるのは、黒地に白い文字を書いた画像を別に用意して、その画像を読み取り、白か黒かで落ちる速度を計算しているわけです。

まあ詳しくはソースを見てください。







以下、ソースです。

続きを読む "花火みたいなやつ"

| | コメント (0) | トラックバック (0)

今日気になった記事

Creating A Downloader For YouTube with Flex/Air

   YouTubeのダウンローダー。



[ActionScript3.0] Sprite/MovieClipとかをランダムに動かす(徘徊させる)

  ランダムに動かす。



扇型を描く

 最後のサンプルがいい。



Transition Types (Tweener Documentation)

  Tweenerのtransitionのいろいろ。



FuseKitのCustomEasingToolをTweenerで使う (Saqoosha.net)

  自由なアニメーションを。





これからはこんな感じで、気になった記事を忘れないようにブログに載せていくことにします。

決してプログラムを組むのがめんどくさくなったわけではないので。



| | コメント (0) | トラックバック (0)

2008年6月21日 (土)

フラクタル

P_13





















フラクタルです。

再帰を利用して描写するあれです。

こんな感じです。

おお綺麗だ。







以下、ソースです。

続きを読む "フラクタル"

| | コメント (0) | トラックバック (0)

2008年6月20日 (金)

Box2DとPV3Dを合わせる

P_12






















タイトル通りです。

こんな感じです。

Box2Dのワールドを作成して、その座標をPV3Dに反映させているだけ。

PV3Dは、オブジェクトがぴったり合わさるとレンダリングがうまくいかない気がします。







以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

続きを読む "Box2DとPV3Dを合わせる"

| | コメント (0) | トラックバック (1)

2008年6月19日 (木)

FlexとPV3D その3

P_11






















また遊びです。

ロボットアームです。

こんな感じです。

関節の計算とかめんどくさかったので、関節の曲がりには制限をかけました。

だからあまり曲がりません。






ソースは右クリックから見れます。

(2009/3 ソース書き直しました。)

| | コメント (0) | トラックバック (0)

2008年6月18日 (水)

Papervision3Dをやってみた25

今回は、プログラムはないです。

自分用の備忘録です。

分かり辛いかもしれませんが勘弁。






Planeの頂点制御を前にやったんですが、Cubeでも頂点制御できるだろうと思い、試してみました。

頂点のアクセスには、下のようにfor-each文でアクセスしていきます。

for each(var obj:Vertex3D in myCube.geometry.vertices)
   { 

   }





Cubeは6つの面を持ちますが、for-each文で回すと、front、back、left、right、top, bottomの順にアクセスしていきます。

各面とも、前回と同様に左下からアクセスして右上まで回ります。

しかも、各面で頂点の数が違います

たとえば、各面の分割数を4-4-4にしたとします。下の様に定義したってこと。

var cube:myCube = new Cube(matlist, 100, 100, 100, 4, 4, 4);

// matlistは自分で定義したMaterialsList



まず、frontにアクセス。

ここは普通に5×5の25個の頂点があります。

backも同じ。

次にleftとrightにアクセス。

ここで注意。leftとrightは両端の2列がfront, backとかぶっています

この2列はfront, backのものとして定義され、left, rightの頂点にはなりません。

よって、left, rightは真ん中の3列が頂点となり、頂点の数は5×3で15個。

最後に、topとbottom。

これは周りの辺にある頂点がすべて他の面とかぶっているんで、他の面のものとして定義されます。

よって、topとbottomの頂点は3×3の9個となります。




要は、かぶっている頂点は先にアクセスする面のものってこと。

rightとfrontでかぶっている頂点があったら、その頂点はfrontのものってことです。




で、これを使って何をするか。

・・・・・何をしましょうかね。

| | コメント (0) | トラックバック (0)

パーティクル

P_10






















以前挑戦して挫折したので、再挑戦。

こんな感じになりました。マウスを動かしてみてください。

本を読みながらなんとか完成。








以下、ソースです。

今回は、メインのクラスとパーティクルを生成するクラスに分けています。

続きを読む "パーティクル"

| | コメント (0) | トラックバック (0)

2008年6月16日 (月)

Papervision3Dをやってみた24

P_9






















前に作成した階段を昇るCubeを改造。

らせん階段を上ります。

こんな感じです。

この前同様、参考にしたサイトはこちら。

Cubeの動きと階段の配置を合わせるのが大変でした。

最初のほうはまだ計算ミスっているっぽい。

なんか重なってしまいます。

あとで手直しでも。







以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた24"

| | コメント (0) | トラックバック (0)

鏡面反射と波紋

P_7






















鏡面反射と波紋を組み合わせました。

こんな感じです。

鏡面反射は以前作成したものを流用。

波紋の作成はこちらを参考にさせていただきました。








以下、ソースです。

続きを読む "鏡面反射と波紋"

| | コメント (2) | トラックバック (3)

2008年6月15日 (日)

FlexとPV3D その2

P_5





















ちょっとした遊びで作りました。

こんな感じです。

適当にいじってみてください。

こちらのサイトにあった関数を使って色々遊んでみました。

やっぱり数学って大事です。








ソースは右クリックから見れます。

(2009/3 ソース書き直しました。)

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた23

P_4





















頂点制御です。

こんな感じです。





Planeを生成するとき、第4、第5引数の分割数によって、頂点の数が決まります。

注意するのは、分割数と頂点の数は違うということです。

例えば、横の分割数を4、縦の分割数を3にした場合、横に並ぶ頂点の数は5で縦に並ぶ頂点の数は4になります。

下の図のような感じ。




P


















赤が横の頂点。緑が縦の頂点です。






今回は頂点をfor-each文で回していますが、アクセスする順番は、左下から始まって、上までアクセス、終わったら次の行に移動。

こんな感じで最後までアクセスしていきます。






分かりづらい説明ですみません。

何かの参考になればと。

以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた23"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた22

P_3





















Cubeが階段を上ります。

こんな感じです。






プログラムで面白い動きを作成する場合、数学の知識は不可欠です。

そんなことを考えていた矢先、友人がとても面白いものを教えてくれました。

いや、面白い。

たった一つの関数で階段の動きを表せるなんて。

星型の関数なんかも乗っています。

とても参考になるサイトです。

PV3Dではこういった関数を利用するのが簡単だと思うので、色々調べてみようと思います。







以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた22"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた21

P_2






















平面でサインカーブ。

そんだけ。

数学って大事です。

最近それを実感します。






以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた21"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた20

P





















PV3Dで、大量のSphereを生成すると、もの凄く重くなります。

そういう場合、平面に円の画像を貼り付けて、常にカメラの方向を向くように設定します。

これによって、平面がSphereに見えるようになり、大量のSphereが生成できるわけです。



・・・とまあそう考えて実験してみました。

こんな感じです。

カメラが円運動しています。

結果として、Sphereに見えなくもないと思います。

ただ、端のほうが歪んだりしているので、まだ色々設定しなければいけないみたいです。

あと、画像もちゃんと作ったほうがいいみたいです。

とりあえず、これで大量のSphereを利用できそう。








以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた20"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた19

P_33





















またエフェクト。

こんな感じです。

なんかライトみたいにりました。

エフェクトは資料が少ないですが面白いです。

頑張ってBitmapFireEffect使えるようになりたい。







以下、ソースです。

(2009/3 エフェクトの利用方法が変わったので、書きなおしました。)

続きを読む "Papervision3Dをやってみた19"

| | コメント (0) | トラックバック (0)

2008年6月12日 (木)

パーリンノイズとマスクで湯気

P_4





















湯気です。

こちらのサイトが非常に参考になりました。

パーリンノイズは、単体よりも、他のものと組み合わせることで効果が発揮されると思います。

サンプルはこちらです。






以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "パーリンノイズとマスクで湯気"

| | コメント (0) | トラックバック (0)

リリースビルドの書き出し

  今日、先輩に、「お前のプログラムは重い」と指摘され、「ちゃんとリリースビルドを書き出しているのか?」と聞かれました。

リリースビルドの書き出しを行うと、最適化されたプログラムが作成されます。

自分は、これを知らなかったので、今までずっとデバックモードでの書き出しを行っていました。

どうりで重いわけだ。

今までのプログラムは全てリリースビルドで書き出したものに置き換えました。

これでだいぶ軽くなりました。






リリースビルドの書き出し方について。





1.「プロジェクト」→「リリースビルドの書き出し」をクリックする。


P1





















2. 設定。終わったら終了ボタンを押す。

P2






















P3
























3.「bin-release」というフォルダが作成される(最適化された実行ファイルはこのフォルダの中)。



P4





















| | コメント (0) | トラックバック (0)

2008年6月11日 (水)

パーリンノイズとフィルタで水面

P_3




















水面を表現。

パーリンノイズだとよくある手法みたいです。

こんな感じです。

パーリンノイズを生成し、DisplacementMapFilterを利用して水面を表現しています。









以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "パーリンノイズとフィルタで水面"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた18

P_2




















ちょっと前に作った球体をクラスにしてみました。

こんな感じになる。

クラスを作る練習。




こちらです:planeSphere.as

(注意:Papervision3DとTweenerを利用しています)





使い方としては、

var ps:planeSphere = new planeSphere(250, 40, 40);            // 半径、planeの幅と高さ
this.rootNode.addChild(ps);

ってな感じで初期化して、

ps.makeSphere();

みたいに実行すれば球体が生成されます。

「ps.x = 100」 とか、「ps.rotationY = 20」 みたいなのも出来ます。





自分でクラス作れるようなると便利ですよね。

| | コメント (0) | トラックバック (0)

2008年6月 9日 (月)

Papervision3Dをやってみた17

P_32






















エフェクトを利用しています。

ちょっと前に作ったやつです。

こちらのサイトを参考にさせてもらいました。

こんな感じです。マウスの位置によってCubuが回転します。あと色も変わります。







以下、ソースです。

(2009/3 エフェクトの方法が変わったので書き換えました。)

続きを読む "Papervision3Dをやってみた17"

| | コメント (0) | トラックバック (0)

2008年6月 8日 (日)

FlexとBox2DFlashAS3

P_2





















Panelが跳ねるだけです。

こんな感じです

Panelの座標とBox2Dの箱の座標を合わせているだけです。

Panelの回転はRotateを利用しています。






ソースは右クリックから見れます。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

| | コメント (0) | トラックバック (0)

2008年6月 7日 (土)

Box2DFlashAS3をやってみた 6

P_30




















ぼかしています。

こんな感じです。

こちらのサイトを参考にさせてもらいました。

BitmapDataのdraw()を利用して描写して、それにフィルターをかけています。

もうちょっときれいにしたいです。













以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

続きを読む "Box2DFlashAS3をやってみた 6"

| | コメント (0) | トラックバック (0)

2008年6月 6日 (金)

Box2DFlashAS3をやってみた 5

P




















ちょっとしたゲームでも。

こんな感じです。

シーソーは矢印のキーで操作できます。

回転している円は壁とジョイントでつないで回転用のプロパティをtrueにしています。

ゴールの箱と落ちてくる円の衝突を判定してゴールかどうか調べています。

衝突判定に関してはこちらが非常に参考になりました。







以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

続きを読む "Box2DFlashAS3をやってみた 5"

| | コメント (0) | トラックバック (0)

2008年6月 4日 (水)

Box2DFlashAS3をやってみた 4

P






















Jointというものを使ってみました。

オブジェクト同志をつなげたりするためのものです。

今までやっていたマウスでのドラッグも、実際はオブジェクトとカーソルの位置をジョイントしてマウスで引っ張っている感じです。

Jointには色々な種類があります。

今回はb2RevoluteJointというものを使用しました。

こんな感じです。

床をワールドとジョイントしています。





床の動きは見えないオブジェクトで制限しています。

デバッグで表示させるとこんな感じ。


Pp






















緑の四角形が床の動きを制限しています。








以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

続きを読む "Box2DFlashAS3をやってみた 4"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた16

P_28




















久々のオーディオスペクトラムです。

こんな感じになりました。

最初はエフェクトかけていたんですが、重すぎてやめました。








以下、ソースです。

(2009/3 ソース書き直しました。なんか鏡面がずれるようになった。)

続きを読む "Papervision3Dをやってみた16"

| | コメント (0) | トラックバック (0)

2008年6月 3日 (火)

Box2DFlashAS3をやってみた 3

A





















なんとなく作成。

こんな感じになりました。

クリックしてみてください。

のちのちこれに車でも走らせてみようかと思います。







多角形を作成するときの注意。

各頂点は、左下を最初に設定して、時計回りに設定していく。

壁を作ってる最中に、これではまりました。

最初、囲めればいいやと思って適当に頂点を設定していたら、表示されるのに玉が認識しないという事態に。

あせりました。







以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

続きを読む "Box2DFlashAS3をやってみた 3"

| | コメント (0) | トラックバック (0)

2008年6月 2日 (月)

Box2DFlashAS3をやってみた 2

P_27




















前回の記事を書き換えました。

こんな感じです。

画面をクリックしてみてください。

円は、色、大きさ、重さがランダムで決まります。








以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

続きを読む "Box2DFlashAS3をやってみた 2"

| | コメント (0) | トラックバック (0)

2008年5月31日 (土)

Box2DFlashAS3をやってみた

P_26




















Box2DFlashAS3をやってみました。

AS用の物理エンジンです。

付属のサンプルといろいろなサイトを見ながらとりあえずのプログラミング。

memo.at sonicというサイトが非常に参考になりました。

で、サンプル。

とりあえず、こんな感じに。

マウスドラッグなどの関数はサンプルにのっていたので流用(TestBedフォルダの中のソース)。

実際の描写方法が分からず、とても苦労しました。

たまに重なってしまったりと、まだよく分かっていない部分がありますが。

まあ何とかなったと思います。






以下、ソースです。

バージョンは2.0.0を利用しています。

(2009/3 ソース書き直しました。)

続きを読む "Box2DFlashAS3をやってみた"

| | コメント (0) | トラックバック (0)

Papervision3Dをやってみた15

P_25






















鏡面反射です。

前に作成したものとは手法が違います。

参考にさせていただいたサイトはこちら

今回は、ViewportをBitmapDataのdrawメソッドを利用して描写してます。

サンプルはこちら

planeをクリックすると、その位置まで球体が動きます。

注意点としては、planeを両面表示にしない(plane.material.doubleSided = true を書かない)ことです。

両面表示にすると、カメラの前にplaneが壁として現われて、オブジェクトが移りません。

また、何もしないと、縦方向(z軸方向)の動きが逆に表示されるので、matrixを適用して上下を反転させています。

いろいろなサイトを見てまわりましたが、前回の手法より今回の手法のほうが多く使われている気がします。





以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた15"

| | コメント (0) | トラックバック (0)

2008年5月29日 (木)

Papervision3Dをやってみた14

P_24





















以前作った、Planeで球体を作るプログラムをちょっと改良しました。

平面の縦と横の長さと、球体の半径を設定すれば、あとは自動で球体を作成してくれます。

サンプルはこちらです。





以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた14"

| | コメント (0) | トラックバック (0)

2008年5月28日 (水)

Papervision3Dをやってみた13

P_23





















3Dの世界での鏡面反射です。

基本的な考え方としては、「カメラとビューポートをもうひとつ作成して、その画像を平面に表示させる」という方法になります。

こんな感じです。

平面にはフィルタをかけて、少しぼやけた感じに。





以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた13"

| | コメント (0) | トラックバック (0)

2008年5月26日 (月)

Papervision3Dをやってみた12

P_22




















この間作った球体を作り直しました。

こんな感じです。前より細かくなった感じ。

球の半径や、平面の1辺の長さを自由に変更することができます。

それに対応して、球体を作るだけの面が自動で生成されます。

これは作っててかなり楽しかったです。






以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた12"

| | コメント (0) | トラックバック (0)

2008年5月25日 (日)

FlexとPV3D

P_21






















FlexのコンポーネントをPV3Dに配置してます。

こんな感じです。

思ったより簡単に出来ました。





ソースは、右クリックから見れます。

(2009/3 ソース書き直しました。)

| | コメント (0) | トラックバック (0)

ノイズ

P_20





















画像にノイズを混ぜました。

そんだけです。

ちょっとした気分転換。






以下、ソースです。

(2009/3 ソース書き直しました。)

続きを読む "ノイズ"

| | コメント (0) | トラックバック (0)

2008年5月24日 (土)

Papervision3Dをやってみた11

P_19





















Planeを球体に並べています。

サンプルはこちらです。

planeのどれかをクリックしてみてください。

球体に並べる方法ですが、for文で回してやればあっさりできます。

結構簡単でした。




以下がソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた11"

| | コメント (0) | トラックバック (0)

2008年5月22日 (木)

Papervision3Dをやってみた10

P_18




















画像の特定領域をBitmapDataにコピーして、こんなものを作ってみました。

クリックしてみてください。

特定領域のコピーですが、今回はUV座標を利用してみました。





以下ソースです。

(2009/3 ソース書き直しました。)

続きを読む "Papervision3Dをやってみた10"

| | コメント (0) | トラックバック (0)