プログラミングスクール比較

プログラミングに関する情報サイトです。副業,稼ぎ方,学習方法,スクール等

プログラミング 学習

プログラミング 簡単にメモ帳でゲームを作る方法

投稿日:2020年11月15日 更新日:

プログラミングをこれから学習しようと思っている方は
どのような開発環境でプログラミングできるか
わからない方も多くいるのではないでしょうか。

これから本格的にスクールなどで勉強するにも
プログラミングのさわりの部分ぐらいは
知っておきたいものです。

メモ帳だけでも、ゲームが作れるので
その概要をメモしておきます。

 

メモ帳で簡単にプログラミング ゲームを作るには

 

単にwindowsなどのメモ帳でゲームを作るにはenchant js という
ゲーム用エンジンのライブラリーを使うとかなり手軽に作れます。
メモ帳でコードを書いて、それをブラウザで
動かす形をとります。
(javascriptだけでも作れますが
ライブラリを使った方が時間がかかりません)

 

enchant jsとはjavascriptで作られたライブラリー、
簡単に言い換えてみると「部品の集合体」みたいなものです。

javascript自体がwindowsのメモ帳でプログラミング出来るので
enchant js も同じように作る事ができます。

 

ゲームに特化したライブラリーで、初期化、画像処理、スプイライト処理、
マップ管理などゲームが手軽に作れるようにする
工程数を大幅に減らしてくれます。

 

もともと、商業で使われる画像がフリーで
組み合わせて使えますので、とりあえず
画像はそれを使い、プログラミングに集中して完成したら
差し替えるというのもありです。

 

他のゲーム開発ツールに比べて、余計なツールを使う
必要がないので、コードだけに集中して書きたいひとに向いている
かと思います。

 

enchant jsの開発環境はメモ帳だけも簡単に可能

 

開発環境はメモ帳とブラウザになりますが
ほとんどのpc(os)にそのようなものは
最初から実装されているはずです。

 

ほぼ他のものをインストールしない状態でプログラミングの
練習ができるという訳です。

 

多くのプログラミングのフレームワークやライブラリに
言える事ですが、最初に入る障壁があるようなものほど躓きやすく
よっぽどやる気がない場合は
その時点でやめてしまうことも。

 

特にプログラミング初心者の方は多いはずです。
その点ではenchant jsの開発環境は
非常にシンプルです。

以下ゲームの初期化画面を出すまでの手順を
載せておきます。

 

 

enchant jsのファイルは
cdnは以下のURLにはまだあるようです。(2020/10)
他の場所はリンク切れが多い。

https://cdn.rawgit.com/uei/enchant.js-builds/master/enchant.min.js

このファイルを自分のHPなどにアップロードするか、直接urlを指定して
読み込みます。

 

htmlのファイルに以下のように書くと
黒い画面の初期化までできゲームの開発環境がすぐに整います。

 

上のコードをhtmlに張り付けて、それをブラウザで開けば
ゲーム用の画面が出ます。
(enchant.min.jsのファイルをcdnで読み込んでいるので
オンライン状態である必要があります。)

 

 

簡単にメモ帳で作れる enchant js 使い方

 

enchant jsは少ない行数で、ゲームで使うような処理実行可能です。
これはjavascriptで書く多くのことを、関数に
ラッピング(一まとめ)されていることによるものです。

 

簡単に画像の読み込みから表示までの使い方を
掲載しておきます。

 

画像の読み込み

 

gameクラスオブジェクトへ画像ファイルを読み込みます。
引数を複数入れると多数のファイルをよびこむ事もできます。
prelodeしたファイルを以下のスプライトクラスと結びつけます。

 

画像の描画 Spriteクラス

 

 

画像の読み込みからスプライトクラスと結びつけ

 

 

Spriteクラス プロパティ

freme フレームのインデックス
image Spriteの画像
rotation Spriteの回転率
scaleX SpriteのX軸方向の倍率
scaleY SpriteのY軸方向の倍率

Spriteクラス メソッド(関数)

rotate(degree) Spriteを回転

scale(x,y) Spriteを拡大縮小

 

上に載せたゲーム初期化に組合わせて使うと
以下のようになります。これで画像の表示までが完成。

 

 

これ以降は、スプライトにaddEventListener でイベント(動きやアニメーション)を登録したり。

タッチやキー入力をとって移動したり。

当たり判定をとったり。

シーンの移動などをいれたりしてゲームを作っていきます。

 

-プログラミング 学習
-,

執筆者:

関連記事

no image

プログラミング ブラインドタッチできないデメリット

プログラミングする場合にブラインドタッチは必要? まだ出来ない人はそう考える人も 多いのではないでしょうか。ブラインドタッチできない事で どのようなデメリットがあるのかを挙げてみました。   …

no image

プログラミング 脳になるには

プログラミング脳という事でなかなか 表現は難しいですが、プログラミング学習する前と 後で実際に考え方か変わったことをあげていきます。   まったくの初学に比べると、コードの見方といい ますか …

no image

プログラミング学習に必要なもの

プログラミング学習に必要なものは 結論を言ってしまうと 物でいえばスマホだけでも概要を学習するには 問題ありません、ただし非常に効率が悪かったり 実践的ではなかったりします。   サイトコン …

no image

プログラミング学習を記録(メモ)してブログにすると効率がいい

学習した内容などをブログに記録することにより 効率よく学習できます。   以下のようにいくつかの理由があります。   忘れてもすぐに確認できる 文章に起こすことにより詳細に内容を確 …

no image

プログラミング 勉強 場所は?

日本の住宅環境は平均するとさほどよくないという。 賃貸の人などは自宅が落ち着かないという人も 多いのではないでしょうか。 自宅に物が多いというような方も、集中できない 原因となっているかもしれません。 …