2019年6月11日火曜日

【注目】phina.jsというゲーム用JSライブラリがかなりすごそう!【ゲーム開発】

勉強の為に転載しました。


この記事は私がまとめました
snowman8765さん 
■phina.jsとは
phina.js(フィナ ドット ジェイ・エス) は, JavaScript で作られた国産のゲームライブラリです.
プログラミング初心者でも始めやすく, それでいて上級者のハイレベルな要求にも 応えられる, 柔軟な設計と豊富な機能を備えています.
ゲームプログラミングをする上で, 「ゲームの作り方」の大まかな枠組みも提供しています.
初心者でもカンタンに扱えて, 上級者であれば自分好みにカスタマイズできる, そんな幅広いニーズに応えるべく開発が続けられているゲームライブラリ. それが phina.jsです!!
- アイディアを即座に形にできるゲームライブラリです
- 初心者でも手軽にゲームを開発できます
- 様々な Web コンテンツ, アプリで多数の採用実績があります
- 大学や専門学校といった教育機関で利用されています
- 国産かつオープンソースでTwitter 駆動開発なので気軽にコントリビューターになれます
Author ... phi
作った方ですね。
ファイさんというみたいです。
■機能について
基本機能
コア機能拡張によるリッチな開発環境
シンプルに使えるクラス定義, 継承や大規模開発を想定したネームスペース管理
HTML5 Canvas をラップした便利描画クラス
ゲーム開発
解像度を維持して自動で画面にフィット(PC, スマホ同時対応)
親子構造(Node)
画像やラベル, 図形といった要素のサポート
ボタンやダイアログ, ゲージといった便利クラス
衝突判定処理
トゥイーンアニメーション
行列やベクトル計算できるクラスを内包
サウンドの再生(WebAudio wrapper)
入力系(キーボード, タッチ, アクセラレーション, ゲームパッドなど)のサポート
マルチタッチのサポート
Three.js とのお手軽連携
などなど
■phina.js の使い方
<!doctype html>

<html>
<head>
<meta charset='utf-8' />
<meta name="viewport" content="width=device-width, user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />

<title>Getting started | phina.js</title>
<!-- phina.js を読み込む -->
<script src='http://cdn.rawgit.com/phi-jp/phina.js/v0.1.1/build/phina.js'></script>

<!-- メイン処理 -->
<script src='main.js'></script>
</head>
<body>

</body>
</html>
index.htmlのサンプル。
CDNから直接読みこむだけ。簡単!
phina.globalize();

phina.define('MainScene', {
superClass: 'CanvasScene',
init: function() {
this.superInit();
this.backgroundColor = '#444';
this.label = Label('Hello, phina.js!').addChildTo(this);
this.label.x = this.gridX.center();
this.label.y = this.gridY.center();
this.label.fill = 'white';
},
});

phina.main(function() {
var app = GameApp({
startLabel: 'main',
});
app.run();
});
「Hello, phina.js!」を表示するだけの簡単なサンプルですね。
ここでの文字制限のため、日本語で説明していた文を削除しました。
■試そう
■実際に出来たゲーム
■備考
phina.js は, この tmlib.js の正式な後継ライブラリに当たります.
tmlib.jsも結構便利なライブラリでしたが、その後継ライブラリでしたか。
phina.jsは, みんなで意見や要望を交わし合って成長してきた
~みんなで作る, みんなのためのライブラリ~
なのです!!
コミュニティに参加すれば、誰でも一緒に開発に参加できるということですね。
■リンク集

0 コメント:

コメントを投稿