モーリーのメモ

アプリ開発等(プログラミング、CG作成)、興味を持ったことを実践してまとめるブログです。

モーリーのメモ

Cocos Creator

マニュアルのチュートリアルをやってみる! その3(完):Cocos Creator

<今回やること!> こちらの記事の続きを行います。 mmorley.hatenablog.com スコアの表示、ゲームが失敗した時のシーンのリロードや効果音の再生の処理等を追加します。 今回でチュートリアル完了です。

マニュアルのチュートリアルをやってみる! その2:Cocos Creator

<今回やること!> こちらの記事の続きを行います。 mmorley.hatenablog.com スクリプト(ソースコード)を書いて、アニメーション、キー入力、ループ処理等を実装します。 前回は、ゲームシーンを作成して『Canvas』に背景、地面、キャラクタを配置しまし…

マニュアルのチュートリアルをやってみる! その1:Cocos Creator

<今回やること!> 『Cocos Creator』のチュートリアル(『Create the first game』)をします。 チュートリアルで作成するゲームの画面です。 作成に必要なリソース(画像、音声、ビットマップフォント等の素材)は、あらかじめ用意されています。 このチ…

Cocos Creatorのインストールからデバッグ環境の作成まで行う!

<今回やること!> Cocos Creatorをインストールします。 VS Code(Microsoft Visual Studio Code)をインストールします。 デバッグ環境を作成します。 この記事を読めば、『Cocos Creator』のゲーム開発環境が構築出来(るはず!)ます。Macで作業してい…

Visual Studio Codeでコード編集&デバッグする!:Cocos Creator

<今回やること!> Cocos CreatorのコードエディタをVisual Studio Code(以下、VSCode)に変更します。 VSCodeでWeb向けのデバッグするための設定を行います。 Cocos Creatorに最初から組み込まれているコードエディタはデバッグ機能がありません。 また、…

Tiledのマップデータから物理空間を作成する!:Cocos Creator

Cocos Creatorは、物理エンジンのChipmunkを使用できます。 物理エンジンとは、物体が落下したり衝突したりした時の動きを計算してくれるものです。 アクションゲーム等を作る際に利用出来ます。 Tiledのマップデータから、アクションゲームのステージを作成…

Tiledのオブジェクトのデータの中身を見る!:Cocos Creator

Tiledについては、こちらの記事で基本的なマップの作り方やオブジェクトデータの取得方法について説明しています。 mmorley.hatenablog.com Tiledでは、下記のオブジェクトを配置出来ます。四角形楕円形ポリゴンポリライン これらをCocos Creatorで読み込ん…

タイルマップ(Tiled)でステージを作成!:Cocos Creator

タイルマップとは、 下図のような色々なパターンのタイルを並べて、 マップやステージを作成したものです。 タイルのパターンのセットは、タイルセットとかマップチップとか呼ばれます。素材配布サイト等で有償/無償で入手出来ます。 タイルセットからマップ…

ジョイスティックでキャラクタを動かす!:Cocos Creator

こちらの記事で2Dのキャラクタのアニメーションを作りました。 mmorley.hatenablog.com ↑ではボタンでアニメーションを切り替えていましたが、ゲームらしくするためにジョイスティックでキャラクタを動かせるようにしてみました。

2Dキャラクタを描く! その4(完):Inkscape

こちらの記事の続きです。 2Dゲームで使うキャラクタの絵を描いています。 mmorley.hatenablog.com 前回で、それらしく出来たので、パーツごとに分けて、『Cocos Creator』で動かしたいと思います。

はてなブログでPCとスマホで内容を変更する!

こちらの記事で、Webアプリをはてなブログ内に貼り付けました。 mmorley.hatenablog.com ところが問題発生。 このWebアプリは、Cocos CreatorでWeb Mobile用にビルドしたのでスマホからでも見ることが出来るのですが、問題は表示サイズです。 このブログの記…

パズドラ チャレンジ&降臨系ダンジョン クリア報酬一覧

パズドラのチャレンジダンジョンや降臨ダンジョン等のクリア報酬の一覧です。 報酬と、何日前のメールかで検索が出来ます。 一覧の表示、検索にも時間がかかる場合があります。

CoffeeScriptを使ってみる!:Cocos Creator

こちらの記事で、CoffeeScriptについて調べました。 mmorley.hatenablog.com せっかくなので、1度は使ってみよう!ということで、CoffeeScriptを実際に試してみます。 Cocos CreatorでJavaScriptとCoffeeScriptが使えるので、実行環境はすでに整っています…

CoffeeScriptについて調べてみる!

CoffeeScriptは、『CocosCreatorが現在サポートしている言語は、JavaScriptとCoffeeScriptだけです。』というアナウンスで知ったぐらいニワカです。 変な名前だな、ぐらいでスルーしていたのですが、ちょっと興味が沸くことがありました。 『JavaScriptの変…

JSONファイルの読み込み:Cocos Creator

JSONファイルの読み込みは、『Cocos Studio2』の時とそんなに変わらないだろうと思っていたのですが、意外に苦戦しました。 実質的には、JSONファイルの読み込みに苦戦したというよりはJSONファイルのパスの渡し方に苦戦しました。 まだ、完全に理解した訳で…

2Dキャラクタアニメーションをテスト! その5(完):Cocos Creator

こちらの記事の続きです。 mmorley.hatenablog.com 前回は、歩くアニメーションを作りました。 今回は他にも『走る』、『ジャンプする』等のアニメーションを作って見たいと思います。

2Dキャラクタアニメーションをテスト! その4:Cocos Creator

こちらの記事の続きです。 mmorley.hatenablog.com 前回は、『Cocos Creator』で体のパーツを組み立てました。 各パーツの関節の位置にアンカーポイントを置き、動きや表示順序を考えてパーツ(ノード)の親子関係を作りました。 次は、歩くアニメーションを…

2Dキャラクタアニメーションをテスト! その3:Cocos Creator

こちらの記事の続きです。 mmorley.hatenablog.com 前回は、座標の構成について考えました。 次は、各パーツの親子関係と表示順序を考えながら、『Cocos Creator』で実際に組み立ててみます。

2Dキャラクタアニメーションをテスト! その2:Cocos Creator

こちらの記事の続きです。 mmorley.hatenablog.com 前回は、2Dキャラクタのパーツ構成を考えました。 17個のパーツを動かすとなると、この先面倒くさそうですが、もう少し頑張ります。 次は、これらのパーツを『Cocos Creator』で動かせるように、組み立…

2Dキャラクタのアニメーションを作る! その1:Cocos Creator

アクションゲームでキャラクタが移動する時、キャラクタが静止画のままでは違和感満載です。 歩く、走る、ジャンプする等の状態に応じたアニメーションをキャラクタにさせる必要があります。 ということで、今回はCocos Creatorで2Dのキャラクタのアニメー…

ListViewを作る! その2(完):Cocos Creator

以前、こちらの記事の続きです。 mmorley.hatenablog.com 前回は、『ListView』の外枠の部分を作りました。 今回は、リストの項目を作って『ListView』に追加します。

ListViewを作る! その1:Cocos Creator

以前、Cocos Studio 2を使ってListViewを作成しました。 mmorley.hatenablog.com 今回は、同じものをCocos Creatorで作成します。 Cocos CreatorにはListViewコンポーネントがありません。 ScrollViewコンポーネントをカスタマイズしてListView作成します。

cc.Spriteの属性値について:Cocos Creator

『cc.Sprite』の属性値について調べたことを書きます。 属性値は『Properties』パネルで設定するパラメータです。 マニュアルだと『attribute』と書かれてます。

iframeで、はてなブログ内にWebアプリ(外部サイト)を表示する!

はてなブログの中で、Cocos2d-JSで作成したWebアプリを動かす方法がないかと少し前から方法を調べていたのですが、見つかりました! <iframe>タグを使えば、はてなブログ内に外部サイトが表示出来たんですね。 Webアプリの本体は、『Github Pages』にアップしていま</iframe>…

マニュアルの『アニメーション』を読む! その2(完):Cocos Creator

こちらの記事の続きです。 mmorley.hatenablog.com スクリプトでアニメーションを操作する方法、アニメーションイベントに関する内容です。

マニュアルの『アニメーション』を読む! その1:Cocos Creator

アニメーションを使いたいのですが、使い方がよくわからないので、とりあえずマニュアルを読んでみました。 最新版と同期が取れているのか、若干怪しいのですが、これを読むしかないですし。

仮想ジョイパッドを作る!:Cocos Creator

以前、こちらの記事で『Cocos2d-JS』用に移植していた仮想ジョイパッドを『CocosCreator』で使えるように作り直しました。 mmorley.hatenablog.com 少し中身を整理したので、多少シンプルになりました。 動作の保証はできませんが、もしよければダウンロード…

デバッグ環境について:Cocos Creator

『Cocos Creator』単独では、コードエディタに構文チェックがあるぐらいで、プレビューを行ってもあまり詳細なデバッグ情報が得られません。 実行時エラーの場合は、実行画面が止まるだけです。 これではまともにデバッグ出来ず困ってしまいます。 が、ちゃ…

addChild、addComponentについて:Cocos Creator

まだ理解が浅いので、解釈など間違っているかもしれませんが、確認した内容を書きます。 今回は、addChild、addComponentについて。

スクリプトのPropertiesについて:Cocos Creator

まだ理解が浅いので、解釈など間違っているかもしれませんが、確認した内容を書きます。 今回は、スクリプトのPropertiesについて。