enchant.js + jQuery でエフェクトをつける

javascriptのゲーム用ライブラリenchant.jsがステキすぎてハマりそうな感じではあるのだけれど、フェードイン/フェードアウトとか移動とかそういったエフェクトが見当たらず、フレームごとの処理が必要になりそうなのが面倒だった。

jQueryのEffectsが使えたらフェードインしたりスライドさせたり何かと楽でいいんじゃないかと思ったので、連携方法を模索。コード見ていたらdiv要素を持っているクラスは_elementという変数で保持しているようなので、その変数を返す関数をprototypeで拡張してみた。

続きを読む enchant.js + jQuery でエフェクトをつける

enchant.js リンク集

参考にしたWebページ

github
https://github.com/wise9/enchant.js/wiki

公式サイト
http://enchantjs.com/

公式サイト内のサンプル
http://enchantjs.com/ja/sample.html
これを見ればだいたいどうやれば動くかすぐ分かる

公式ドキュメント
http://wise9.github.com/enchant.js/doc/

開発者によるスライド
http://enchant.heroku.com/
class hierarchyが載ってるのが大変ありがたい

公式が充実しているので大抵のことがまかなえる。ドキュメントをよく見て分からないところは、enchant.js(enchant.min.jsじゃない方)のソースコードを読めば日本語のコメントがついていて大変分かりやすい。

enchant.jsでHTML要素を追加する

Javascriptでゲームをつくるためのライブラリ enchant.js を使っていた。enchant.jsではSpriteやLabelといった表示内容はHTMLのdiv要素で構成される。

このdiv要素に対してHTMLのタグを追加してゲームっぽくない要素を追加したい時どうすればいいんだろうと、enchant.jsのソースを読んでいたら、そもそもenchant.Labelのtext属性はLabelを構成するdivのinnerHTMLを設定するものだった。そのため、以下のように書けば簡単に画面内にHTMLで構成した要素を登場させられる。

var scene = new Scene();
var myhtml = new Label(300,120);
myhtml.text = '<div style="width:100%; height:120px;">これはテストです。</div>';
scene.addChild(myhtml);
game.pushScene(scene);

僕がプログラミングを始めたきっかけ

大学の同期がブログでプログラミングの使用経験を語っていていいなぁと思ったのでブログに書いてみる。

本当はプログラミングをどのような順序で覚えたかを書いて、誰かの参考になればいいかな、と思っていたが途中で力つきたので今度書く。

以下、言語の列挙。

続きを読む 僕がプログラミングを始めたきっかけ