内容へ移動
ユーザ用ツール
サイト用ツール
検索
ツール
文書の表示
以前のリビジョン
バックリンク
最近の変更
メディアマネージャー
サイトマップ
ログイン
>
現在位置:
home
»
wiki
»
enchant.js
»
Tips
»
014 Surfaceを使ってCanvas描画を行う
トレース:
wiki:enchant.js:tips:014
この文書は読取専用です。文書のソースを閲覧することは可能ですが、変更はできません。もし変更したい場合は管理者に連絡してください。
====== 014 Surfaceを使ってCanvas描画を行う ====== {{:wiki:enchant.js:tips:enchantjs_014_000.png?200|}} ===== 概要 ===== Surfaceは、html5のcanvas 機能をラップしたクラスです。ここではSpriteにSurfaceを画像として割り当て表示してみます。 ==== ソースコード ==== <code javascript> main.js // 初期化。 function init() { game.scale = 1; game.fps = 30; // スプライト生成. var sprite = new Sprite( SPRITE_WIDTH, SPRITE_HEIGHT ); // サーフェス生成. var surface = new Surface( SPRITE_WIDTH, SPRITE_HEIGHT ); // 塗りつぶし。 surface.context.fillStyle = "white"; surface.context.fillRect( 0, 0, 100, 100 ); surface.context.fillStyle = "blue"; surface.context.fillRect( 10, 10, 80, 80 ); sprite.image = surface; // サーフェスをセット. scene = new Scene(); scene.backgroundColor = "#ccc"; scene.addChild(sprite); game.pushScene(scene); main(); } </code> surface に描画する内容を設定しています。設定したものをSpriteに張り付け、Sceneに追加すれば完成です。 ==== ダウンロード ==== {{:wiki:enchant.js:tips:enchantjs_surfacedraw.zip|}}
Permalink
wiki/enchant.js/tips/014.txt
· 最終更新: 2014/11/07 23:58 (外部編集)
ページ用ツール
ログイン
文書の表示
文書の先頭へ
印刷
以前のリビジョン
バックリンク
最近の変更
メディアマネージャー
サイトマップ
oeffentlich