<!DOCTYPE HTML> <html> <head> <meta name="viewport" content="initial-scale = 1, user-scalable=no"> <meta charset="utf-8"> <title>RPG sample on Monaca</title> <script type="text/javascript" src="enchant.js"></script> <script type="text/javascript" src="ui.enchant.js"></script> <script type="text/javascript" src="game.js"></script> <style type="text/css"> body { margin: 0; } </style> <script type="t
※ phiary に引っ越しました. 毎日プログラミングやWebに関する情報を発信しています! RSS 登録してたまに覗いたり, tweet やハテブして拡散してもらえると幸いです. enchant.js 怒涛の 100 tips!! ローカル整理してたら昔勉強がてら作った enchant.js のサンプルが大量に出てきたので, 整理するついでに公開しようと思います. 最終的に 100超えちゃったけどw(全部で102個あります) 逆引きてきな感じでまとめてます. 参考になれば幸いです. 全て jsdo.it に移植したので Web上で実行できます!! fork なりダウンロードなりして遊んでくださいな♪♪ Tips Base(基本) 基礎です. enchant.js のテンプレートを用意しよう Entity(エンティティ) 表示物系の基底クラスです. 内部で DOM を持っているので表示は
こんな感じのボタンを表示させる方法 index.htmlのcss部分に数行コードを入れる必要があります index.html .button{ text-align:center; border-radius:10px; -webkit-border-radius:10px; -moz-border-radius:10px; } そいで以下が表示させるコード game.js var buttonStart = new Label(); buttonStart._element.setAttribute('class','button'); buttonStart.width = 130; buttonStart.text = 'スタート'; buttonStart.backgroundColor = 'red'; buttonStart.font = '2em"Ariar"'; butto
圧縮後のファイルサイズはenchant.jsのほうが3kbほど少ないですね。 どちらもjs上に継承などを行う擬似クラスを作るためのClass要素があったり、スマートフォン/PC両方で使えるようにtouch系イベントとmouseDown/Move系イベントを判定したり、fps(フレーム数)を設定してフレーム毎のイベントを設定するなどしています。 後発だけあって、Arctic.jsのほうはenchant.jsの機能をパクったenchant.jsにある機能はだいたいあるような感じですね。 オブジェクトの描画についてですが、Canvasでの描画の方が性能的に有利かもしれませんが、enchant.jsは divタグ毎にオブジェクトに持っていることで利便性をあげています。既存のアニメーション効果をdivタグ単位で 適応することにより、今までのエフェクトを使いまわすことができるのです。 ench
canvas2dをネイティブでゴリゴリ書いちゃうので今までenchant.js使う機会なかったのだけど、gl.enchant.jsは便利そうだったのでenchant.jsにも慣れようと思い使ってみた。 参考にしたのはgl.enchant.js 入門 – ざっくりと作る流れをまとめてみました!! | TM Life だけど、とりあえずキー入力を受けて移動するプレイヤーオブジェクトと、それに追従する三人称カメラまで作った。 見てて難易度が高くみえるけど、何をいじれば何が変化するかを目視で印象つかめば学習が早い。(最近TDDで頑張ってたけど、こういうのは目視しないと全体の印象が掴めない) 基本的にコード中に回転行列とか、オブジェクトのレイヤーを示すであろう謎のバイナリ列がでてきて気持ち悪くみえるのだが、そこは頑張ってスルーして必要になったときに読めばいいのであろう。 三人称カメラ、いまんとこプレ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く