2013年12月3日火曜日

Google PlayのTop Grossing 100に入っている+その他のタイトルでどのくらいcocos2d-xが使われているのか調べてみる

概要

こんにちは。数ヶ月前から趣味でcocos2d-xをさわり始めました。リリースした初日から遊んでいたブレイブフロンティアGoodiaのアプリがcocos2d-xで作られているのを知り、知っているアプリの中でどれが、cocos2d-xで作られているのか興味を持ちました。

今回のブログでは、2013年12月3日の時点でGoogle PlayのTop Grossing 100位以内とその他、私が興味を持って、cocos2d-xで作られているかもと思ったアプリを調べて、cocos2d-xで作られているかどうか判定していきます。

調べ方

cocos2d-xで作られているかどうか判定するのはどのようにするかといいますと、今回は、*.apk内にある*.soを判断して判定します。cocos2d-xの場合は<PROJECT_ROOT>/proj.android/jni/Android.mkのLOCAL_MODULE_FILENAMEにlibgameと書いてあるので、libgame.soファイルがあればcocos2d-xと判定します。

調査結果

ではいきなりですが調査結果です。Google Play Top Grossing 100位の中で、以下のアプリがcocos2d-xを使っていました。
  • LINE PLAY
  • 三国志パズル大戦
  • LINE Bubble!
  • 究極キャッスル攻防戦 - Castle Clash
  • ZOOKEEPER BATTLE
  • LINE I Love Coffee
その他興味のもったアプリを調べたところ以下もcocos2d-xでした
  • にゃんこ大暴走
  • ドン★パッチン
注意: 半分手動で調べたので間違っていたら訂正致します。


ど、どちらかというとUnityが多くてびっくりしました。。。


2013年11月23日土曜日

Tiled Map Editor用のTilesetを自作する

Tiled Map Editor用のTileSetを自作してみます。

Tilesetを以下のように作りました。


Map->New Tilesetで、Tiled Map Editorに追加します。Margin, Spacingは2pxにする必要がありますので気をつけてください。




ばっちりかけました。



cocos2d-xのMulti-resolution supportの内容箇条書き

cocos2d-xのMulti-resolution supportの内容をメモとして箇条書きにします。


  • 異なる端末の解像度に合わせるためにcocos2d-xでは以下が使用される
    • CCEGLView::setDesignResolutionSize()
    • CCDirector::setContentScaleFactor()
  • 端末の解像度は以下で取れる
    • CCEGLView::sharedOpenGLView()->getFrameSize()
  • 端末の解像度がなんであろうとDesign Resolution Sizeというのを使う。設定の仕方は以下。
    • CCEGLView::sharedOpenGLView()->setDesignResolutionSize(width, height, policy)
  • 解像度に合わせた画像を使用するために以下を使う
    • searchPath.push_back(largeResource.directory);
  • ContentScaleFactorというのはdesignResolutionSizeに対するリソースサイズの比である。
  • 表示されている原点とサイズは以下で取得できる
    • CCDirector::sharedDirector()->getVisibleOrign()
    • CCDirector::sharedDirector()->getVisibleSize()
  • 5つの画面表示方法がある
    • Exact Fit
    • No border
    • Show all
    • Fixed Height
    • Fixed Width

Cocos2d-xでTiled Map Editorを使用する

ステップ

  • はじめに
  • Cocos2d-xプロジェクトの作成
  • Tiled Map Editorを使ってみる
  • Tiled Map EditorをCocos2d-xに組み込む

はじめに

ソースコードは以下です。

環境は以下で作成しています。
  • Mac OS X: 10.8.3
  • Cocos2d-x: 2.2.1
  • Tiled Map Editor: 0.9.1
また、この記事は、以下の本のレシピ74を参考にしています。


Cocos2d-xプロジェクトの作成

$ cd tools/project-creator/
$ python create_project.py -project TiledMapSample -package com.wapa5pow.TiledMapSample -language cpp
proj.ios  : Done!
proj.android  : Done!
proj.win32  : Done!
proj.winrt  : Done!
proj.wp8  : Done!
proj.mac  : Done!
proj.blackberry  : Done!
proj.linux  : Done!
proj.marmalade  : Done!
New project has been created in this path: /Applications/development/Android/cocos2d-x-2.2.1/projects/TiledMapSample
$ mkdir Resources/TileMaps


Tiled Map Editorを使ってみる

ここからダウンロードします。



Exampleを開いてその中にある各種ファイルを開いてみましょう。以下の画像はdesert.tmxを開いたところです。





一通り試してみたら、今回、Cocos2d-xに組み込んでみるファイルを作ります。
File -> New から以下の設定で作成します。


Map->New Tilesetからタイルを選択します。今回はサンプルにはいっていたtmw_desert_spacing.pngを選択します。



自由にタイルを配置していきます。終わったら、File->Save AsでCocos2d-xプロジェクトのResource以下に配置します。今回はdesert.tmxのファイル名で保存しました。


Tiled Map EditorをCocos2d-xに組み込む

TiledMapSample.xcodeprojをXcodeで開き、先ほどResourceファイル以下に追加したdesert.tmxをResource下にXcode上で配置します。



Tiled Mapを読み込むコードをHelloWorldScene.cppに、以下のように追加します。

// add tiled map
CCTMXTiledMap* pTileMap = CCTMXTiledMap::create("TiledMaps/desert.tmx");
this->addChild(pTileMap);


2013年9月28日土曜日

Amazon Linux AMIのEC2インスタンスを眺めてみる

EC2インスタンスを作ったので中身を確認してみる。

ステップ

  • 各種情報を集めてみる
  • サーバスペックを確かめてみる

各種情報を集めてみる

  • CPU: Intel(R) Xeon(R) CPU E5-2650 0 @ 2.00GHz
  • メモリ: 608,480 kB
  • ディスク: 7.9GB
$ cat /etc/system-release
Amazon Linux AMI release 2013.03

$ cat /proc/version 
Linux version 3.4.43-43.43.amzn1.x86_64 (mockbuild@gobi-build-31003) (gcc version 4.6.3 20120306 (Red Hat 4.6.3-2) (GCC) ) #1 SMP Mon May 6 18:04:41 UTC 2013

$ cat /proc/cpuinfo  
processor : 0
vendor_id : GenuineIntel
cpu family : 6
model  : 45
model name : Intel(R) Xeon(R) CPU E5-2650 0 @ 2.00GHz
stepping : 7
microcode : 0x70a
cpu MHz  : 1799.999
cache size : 20480 KB
physical id : 0
siblings : 1
core id  : 0
cpu cores : 1
apicid  : 0
initial apicid : 10
fpu  : yes
fpu_exception : yes
cpuid level : 13
wp  : yes
flags  : fpu de tsc msr pae cx8 sep cmov pat clflush mmx fxsr sse sse2 ss ht syscall nx lm constant_tsc up rep_good nopl nonstop_tsc pni pclmulqdq ssse3 cx16 pcid sse4_1 sse4_2 x2apic popcnt tsc_deadline_timer aes avx hypervisor lahf_lm
bogomips : 3599.99
clflush size : 64
cache_alignment : 64
address sizes : 46 bits physical, 48 bits virtual
power management:

$ cat /proc/meminfo 
MemTotal:         608480 kB
MemFree:           93480 kB
Buffers:           16184 kB
Cached:           432288 kB
SwapCached:            0 kB
Active:           221112 kB
Inactive:         241116 kB
Active(anon):      13788 kB
Inactive(anon):      100 kB
Active(file):     207324 kB
Inactive(file):   241016 kB
Unevictable:           0 kB
Mlocked:               0 kB
SwapTotal:             0 kB
SwapFree:              0 kB
Dirty:                 0 kB
Writeback:             0 kB
AnonPages:         13816 kB
Mapped:             8248 kB
Shmem:               140 kB
Slab:              38728 kB
SReclaimable:      32996 kB
SUnreclaim:         5732 kB
KernelStack:         536 kB
PageTables:         5044 kB
NFS_Unstable:          0 kB
Bounce:                0 kB
WritebackTmp:          0 kB
CommitLimit:      304240 kB
Committed_AS:      81236 kB
VmallocTotal:   34359738367 kB
VmallocUsed:        5056 kB
VmallocChunk:   34359733103 kB
AnonHugePages:         0 kB
HugePages_Total:       0
HugePages_Free:        0
HugePages_Rsvd:        0
HugePages_Surp:        0
Hugepagesize:       2048 kB
DirectMap4k:      637952 kB
DirectMap2M:           0 kB

$ df -h
Filesystem            Size  Used Avail Use% Mounted on
/dev/xvda1            7.9G  1.1G  6.8G  14% /
tmpfs                 298M     0  298M   0% /dev/shm

Amazon EC2インスタンスにWebサーバを設置し、独自ドメインからアクセスできるようにする

ステップ

  • EC2インスタンスのグローバルIPアドレスを確認する
  • 独自ドメインとEC2インスタンスのひも付け
  • 正しくひもづけられているか確認
  • Webサーバインストール
  • EC2インスタンスへhttpdのポート80でアクセスできるように設定する
  • アクセステスト

EC2インスタンスのグローバルIPアドレスを確認する

以下の手順で確認する

独自ドメインとEC2インスタンスのひも付け

  • 独自ドメインを取得します。どのサービスでもよいですが私は以下のサービスで取得しました。
以下の手順でムームードメインで取得した独自ドメインとEC2インスタンスのIPアドレスをひも付けます。




ちなみに種別設定で選択できる、A, MX, CNAME, TXTの意味については以下を参照してください。

正しくひもづけられているか確認

以下のサイトで独自ドメインを入力して、確認してみてください。自分で設定した、IPアドレスとひもづけられていれば正しく設定できています。

Webサーバインストール

EC2インスタンスにWebサーバをインストールします。Macのターミナルからインスタンスにログインし、以下のコマンドを入力します。

sudo yum -y install httpd

起動します。

sudo service httpd start

EC2インスタンスへhttpdのポート80でアクセスできるように設定する

以下の手順で設定する

アクセステスト

ブラウザを開いて、独自ドメインのURLを入れアクセスする。Apacheのページが表示されれば、EC2にWebサーバが正しくインストールされた事が確認できる。








AWSの東京リージョンでAmazon EC2インスタンスを作成し手元のMacからアクセスできるようにする

ステップ

  • AWSアカウント作成
  • EC2インスタンスの作成
  • Macからのアクセス設定

AWSアカウント作成

  • AWSのサイトに行き、アカウントを作ります
  • 2013年9月28日現在で、AWS新規アカウント作成者には無料利用枠が付いております
    • http://aws.amazon.com/jp/free/
      • コンピューティング&ネットワーク
        • Amazon EC2
        • Amazon ELB
      • ストレージ
        • Amazon S3
        • Amazon EBS
      • データベース
        • Amazon RDS
        • Amazon DynamoDB
        • Amazon ElasticCache
      • アプリケーションサービス
        • Amazon SNS
        • Amazon Elastic Transcoder
        • Amazon SQS
        • Amazon SWF
      • 開発と管理
        • Amazon CloudWatch
        • AWS Data Pipeline

EC2インスタンスの作成

EC2 Dashboardを開き以下の手順でインスタンスを作成する











以下で保存する鍵は適切な場所に保存する。



Macからのアクセス設定

作成したインスタンスにアクセスするための方法を確認する

以下の手順にてインスタンスにログインする
  • MacのTerminalを立ち上げる
  • 先ほど保存した鍵が入っているフォルダまでcdコマンドで移動する
  • 鍵のパーミッションを変更する
    • chmod 400 鍵名
  • sshコマンドによりインスタンスに接続する
    • ssh -i 鍵名 ec2-user@ip_address