モーリーのメモスマートフォン用の表示で見るモーリーのメモアプリ開発等(プログラミング、CG作成)、興味を持ったことを実践してまとめるブログです。DragonBonesを使ってアニメーションを作成します。Creatorで使用します。DragonBonesは、無料で使える2Dアニメーション作成ツールです。物理エンジンを使ったシンプルなアクションゲームを作成します。こちらの記事の続きです。物理エンジンを使ったシンプルなアクションゲームを作成します。こちらの記事の続きです。ビジュアルな環境で、プレハブとノードを作成します。フレームアニメーションを作成します。物理エンジンを使ったシンプルなアクションゲームを作成します。ゲームに必要な絵、音、フォント等のリソースを入手します。タイルマップエディタの『Tiled』を使用して、ステージを作成します。『Tiled』マップエディターで、タイルマップを作成します。見た目の作成だけでなく、オブジェクトの配置も行います。Creatorで読み込みます。配置したオブジェクトのデータを読み込みます。こちらの記事でJavaScirptで作成したスクリプトをTypeScriptで書きます。こちらの記事の続きを行います。スコアの表示、ゲームが失敗した時のシーンのリロードや効果音の再生の処理等を追加します。今回でチュートリアル完了です。こちらの記事の続きを行います。スクリプト(ソースコード)を書いて、アニメーション、キー入力、ループ処理等を実装します。game』)をします。チュートリアルで作成するゲームの画面です。作成に必要なリソース(画像、音声、ビットマップフォント等の素材)は、あらかじめ用意されています。Creatorをインストールします。Code)をインストールします。デバッグ環境を作成します。Creator』のゲーム開発環境が構築出来(るはず!)ます。Code(以下、VSCode)に変更します。VSCodeでWeb向けのデバッグするための設定を行います。Creatorに最初から組み込まれているコードエディタはデバッグ機能がありません。Creatorは、物理エンジンのChipmunkを使用できます。物理エンジンとは、物体が落下したり衝突したりした時の動きを計算してくれるものです。アクションゲーム等を作る際に利用出来ます。TiledTiledについては、こちらの記事で基本的なマップの作り方やオブジェクトデータの取得方法について説明しています。Tiledでは、下記のオブジェクトを配置出来ます。JavaScriptこちらの記事で2Dのキャラクタのアニメーションを作りました。↑ではボタンでアニメーションを切り替えていましたが、ゲームらしくするためにジョイスティックでキャラクタを動かせるようにしてみました。Creatorこちらの記事の続きです。2Dゲームで使うキャラクタの絵を描いています。Creator』で動かしたいと思います。Creatorこちらの記事で、Webアプリをはてなブログ内に貼り付けました。Mobile用にビルドしたのでスマホからでも見ることが出来るのですが、問題は表示サイズです。アプリパズドラのチャレンジダンジョンや降臨ダンジョン等のクリア報酬の一覧です。報酬と、何日前のメールかで検索が出来ます。一覧の表示、検索にも時間がかかる場合があります。Creatorこちらの記事で、CoffeeScriptについて調べました。1度は使ってみよう!ということで、CoffeeScriptを実際に試してみます。CreatorCoffeeScriptは、『CocosCreatorが現在サポートしている言語は、JavaScriptとCoffeeScriptだけです。』というアナウンスで知ったぐらいニワカです。変な名前だな、ぐらいでスルーしていたのですが、ちょっと興味が沸くことがありました。Studio2』の時とそんなに変わらないだろうと思っていたのですが、意外に苦戦しました。実質的には、JSONファイルの読み込みに苦戦したというよりはJSONファイルのパスの渡し方に苦戦しました。Macこちらの記事の続きです。前回は、歩くアニメーションを作りました。今回は他にも『走る』、『ジャンプする』等のアニメーションを作って見たいと思います。Macこちらの記事の続きです。Creator』で体のパーツを組み立てました。各パーツの関節の位置にアンカーポイントを置き、動きや表示順序を考えてパーツ(ノード)の親子関係を作りました。Macこちらの記事の続きです。前回は、座標の構成について考えました。Creator』で実際に組み立ててみます。Macこちらの記事の続きです。前回は、2Dキャラクタのパーツ構成を考えました。17個のパーツを動かすとなると、この先面倒くさそうですが、もう少し頑張ります。Macアクションゲームでキャラクタが移動する時、キャラクタが静止画のままでは違和感満載です。歩く、走る、ジャンプする等の状態に応じたアニメーションをキャラクタにさせる必要があります。Mac以前、こちらの記事の続きです。前回は、『ListView』の外枠の部分を作りました。今回は、リストの項目を作って『ListView』に追加します。2を使ってListViewを作成しました。Creatorで作成します。CreatorにはListViewコンポーネントがありません。ScrollViewコンポーネントをカスタマイズしてListView作成します。Mac『cc.Sprite』の属性値について調べたことを書きます。属性値は『Properties』パネルで設定するパラメータです。マニュアルだと『attribute』と書かれてます。<iframe>タグを使えば、はてなブログ内に外部サイトが表示出来たんですね。Macこちらの記事の続きです。スクリプトでアニメーションを操作する方法、アニメーションイベントに関する内容です。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。