advanced cocos2d
DESCRIPTION
cocos2d iPhone advanced technics.TRANSCRIPT
![Page 1: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/1.jpg)
Advanced cocos2d
@Seasons
cocos2d実践テクニックのご紹介
![Page 2: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/2.jpg)
@Seasonscocos2d AUTHOR
Blog:Seasons.NET•cocos2dリリース情報の翻訳•テクニカル情報の翻訳
@cocos2dfan_jp 管理人•cocos2dに関する情報を不定期にポスト
My Profile
![Page 3: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/3.jpg)
Today’s agenda
![Page 4: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/4.jpg)
Today’s agenda
•Introduction cocos2d
![Page 5: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/5.jpg)
Today’s agenda
•Introduction cocos2d•How to learn cocos2d
![Page 6: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/6.jpg)
Today’s agenda
•Introduction cocos2d•How to learn cocos2d•Advanced technics
![Page 7: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/7.jpg)
Introduction cocos2d
![Page 8: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/8.jpg)
What is cocos2d ?
![Page 9: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/9.jpg)
What is cocos2d?
![Page 10: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/10.jpg)
What is cocos2d?
•2Dゲームフレームワーク
![Page 11: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/11.jpg)
What is cocos2d?
•2Dゲームフレームワーク•オープンソース
![Page 12: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/12.jpg)
What is cocos2d?
•2Dゲームフレームワーク•オープンソース•MITライセンス
![Page 13: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/13.jpg)
What is cocos2d?
•2Dゲームフレームワーク•オープンソース•MITライセンス•ハイパフォーマンス
![Page 14: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/14.jpg)
What is cocos2d?
•2Dゲームフレームワーク•オープンソース•MITライセンス•ハイパフォーマンス•物理エンジンなども統合
![Page 15: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/15.jpg)
cocos2dの最新バージョン
0.99.5(stable版)1.00 rc3(開発版)
Xcode4
![Page 16: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/16.jpg)
http://d.hatena.ne.jp/Seasons/20110602/1307037640
1.0.0 rc3(開発版)正式リリースまでは、あと1~2ヶ月?
リリースノート翻訳
公式フォーラムにもcocos2d作者許可を得て掲載中
![Page 17: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/17.jpg)
気になるライセンス
昔は、 や という標記を入れる必要があった。
MIT ライセンス???
![Page 18: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/18.jpg)
気になるライセンス
昔は、 や という標記を入れる必要があった。
MIT ライセンス???
![Page 19: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/19.jpg)
気になるライセンス
昔は、 や という標記を入れる必要があった。
MIT ライセンス???
cocos2d
![Page 20: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/20.jpg)
気になるライセンス
昔は、 や という標記を入れる必要があった。
MIT ライセンス???
cocos2d
![Page 21: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/21.jpg)
気になるライセンス
昔は、 や という標記を入れる必要があった。
MIT ライセンス???
cocos2d
![Page 22: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/22.jpg)
気になるライセンス
MIT ライセンス???
cocos2d
![Page 23: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/23.jpg)
気になるライセンス
MIT ライセンス???
cocos2d
ソースコード上の著作権や許諾表示を含めること以外は許諾料も制限も一切ない。
![Page 24: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/24.jpg)
最新!!cocos2d採用タイトル
![Page 25: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/25.jpg)
最新!!cocos2d採用タイトル
Birzzle
![Page 26: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/26.jpg)
最新!!cocos2d採用タイトル
Birzzle
![Page 27: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/27.jpg)
最新!!cocos2d採用タイトル
Birzzle Siege Hero
![Page 28: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/28.jpg)
最新!!cocos2d採用タイトル
Birzzle Siege Hero
![Page 29: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/29.jpg)
最新!!cocos2d採用タイトル
Birzzle Siege Hero倉木麻衣★ムービーパズル
![Page 30: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/30.jpg)
最新!!cocos2d採用タイトル
Birzzle Siege Hero倉木麻衣★ムービーパズル
![Page 31: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/31.jpg)
多くの採用実績!!
![Page 32: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/32.jpg)
多くの採用実績!!
![Page 33: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/33.jpg)
多くの採用実績!!
![Page 34: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/34.jpg)
多くの採用実績!!
多すぎて掲載しきれません...
![Page 35: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/35.jpg)
パフォーマンス
よく言われること...
cocos2dって遅そう.パフォーマンス大丈夫?CとかC++の方がよくない?
![Page 36: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/36.jpg)
パフォーマンス
よく言われること...
cocos2dって遅そう.パフォーマンス大丈夫?CとかC++の方がよくない?
![Page 37: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/37.jpg)
cocos2d News
![Page 38: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/38.jpg)
cocos2d News
最近、cocos2d開発者である
![Page 39: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/39.jpg)
cocos2d News
最近、cocos2d開発者である Ricardo Quesada氏が
![Page 40: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/40.jpg)
cocos2d News
最近、cocos2d開発者である Ricardo Quesada氏がZynga社にJoinしました。
祝!!
![Page 41: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/41.jpg)
よく言われること...
Zynga社にJoinしたら、cocos2dはZynga社のもの?開発は大丈夫なの?
![Page 42: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/42.jpg)
公式フォーラムにて作者自ら回答
![Page 43: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/43.jpg)
How to learn cocos2d
![Page 44: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/44.jpg)
cocos2d 日本2強
cocos2dで困ったら、まずこの2人に何か聞いてみる
@Seasonscocos2dリリースノートを2年以上追っている。日本語での情報発信に専念。たまに技術ネタ。
@splhack 氏cocos2dに関するstack over flow 回答上位テクニカルなネタ中心に守備範囲が広い!!
![Page 45: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/45.jpg)
書籍を読む!!
![Page 46: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/46.jpg)
書籍を読む!!
•cocos2dのほぼ全機能について解説•洋書プログラミング部門1位•cocos2d ユーザー必読本
![Page 47: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/47.jpg)
書籍を読む!!
•ミニゲームを作成しながら学習•基本的な機能について丁寧に解説•CCActionの図解が嬉しい!!•物理エンジンは、Chipmunkを解
•cocos2dのほぼ全機能について解説•洋書プログラミング部門1位•cocos2d ユーザー必読本
![Page 48: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/48.jpg)
書籍を読む!!
•基本的な機能について丁寧に解説•Box2Dに関する解説が詳しい•VertexHelperの使い方も掲載
•ミニゲームを作成しながら学習•基本的な機能について丁寧に解説•CCActionの図解が嬉しい!!•物理エンジンは、Chipmunkを解
•cocos2dのほぼ全機能について解説•洋書プログラミング部門1位•cocos2d ユーザー必読本
![Page 49: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/49.jpg)
現実はそう甘くない...
洋書、英語嫌いがまだまだ多いこの業界。
![Page 50: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/50.jpg)
洋書の中でもダントツで人気のこの書籍を翻訳して販売できないか?
例によってまたTwitterでつぶやく
![Page 51: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/51.jpg)
日本開発者のみなさん、ついに翻訳本出ます!!
![Page 52: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/52.jpg)
日本開発者のみなさん、ついに翻訳本出ます!!
![Page 53: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/53.jpg)
日本開発者のみなさん、ついに翻訳本出ます!!
Amazon プログラミング部門1位 !!
![Page 54: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/54.jpg)
日本開発者のみなさん、ついに翻訳本出ます!!
Amazon プログラミング部門1位 !!
企画、監修、付録+15p執筆担当
@Seasons@splhack@hkato193@tomohisa
監修、執筆陣
![Page 55: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/55.jpg)
日本開発者のみなさん、ついに翻訳本出ます!!
Amazon プログラミング部門1位 !!
企画、監修、付録+15p執筆担当
@Seasons@splhack@hkato193@tomohisa
監修、執筆陣
6月24日発売
![Page 56: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/56.jpg)
著者からメッセージ頂きました!!
@gaminghorror氏
![Page 57: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/57.jpg)
はっきり言って超オススメです!!cocos2dのリファレンス本としても実践本としても使えます
付録+30ページ増量で500ページに迫るボリューム!
![Page 58: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/58.jpg)
Advanced Technics
![Page 59: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/59.jpg)
倉木麻衣★ムービーパズル実際に使ったテクニックなどについてご紹介
![Page 60: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/60.jpg)
テクニック一覧
![Page 61: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/61.jpg)
テクニック一覧
•画面遷移
![Page 62: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/62.jpg)
テクニック一覧
•画面遷移•画像最適化手法
![Page 63: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/63.jpg)
テクニック一覧
•画面遷移•画像最適化手法•画像の継ぎ目をなくす
![Page 64: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/64.jpg)
テクニック一覧
•画面遷移•画像最適化手法•画像の継ぎ目をなくす•サウンド容量を削減する
![Page 65: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/65.jpg)
テクニック一覧
•画面遷移•画像最適化手法•画像の継ぎ目をなくす•サウンド容量を削減する•座標系の変更(AfterEffects連携)
![Page 66: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/66.jpg)
テクニック一覧
•画面遷移•画像最適化手法•画像の継ぎ目をなくす•サウンド容量を削減する•座標系の変更(AfterEffects連携)•便利なクラス
![Page 67: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/67.jpg)
画面遷移
![Page 68: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/68.jpg)
画面遷移で考えること
•シーン(CCScene)の再読み込み•音切れ(特にBGM)•シーン間トランジション
![Page 69: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/69.jpg)
例)タイトル画面とオプション画面
CCTitleScene CCOptionScene
![Page 70: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/70.jpg)
ありがちな実装
CCTitleScene
CCOptionScene
[[CCDirector sharedDirector] replaceScene:[CCTransitionCrossFade transitionWithDuration:1.0 scene:[HelloWorldLayer scene]]];
replaceScene
![Page 71: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/71.jpg)
何が起きるか?
replaceScene
CCTitleScene
常駐メモリ
![Page 72: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/72.jpg)
何が起きるか?
replaceScene
CCTitleScene
常駐メモリ
![Page 73: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/73.jpg)
何が起きるか?
replaceScene
常駐メモリ
![Page 74: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/74.jpg)
何が起きるか?
replaceScene
CCOptionScene
常駐メモリ
![Page 75: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/75.jpg)
何が起きるか?
replaceScene
CCOptionScene
常駐メモリ
![Page 76: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/76.jpg)
何が起きるか?
replaceScene
CCOptionScene
常駐メモリ
replaceSceneは、シーンを破棄して、シーンを読み込む
![Page 77: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/77.jpg)
•シーン間の読み込みが毎回発生CCSceneが沢山のメモリをロードする場合は、コストが大きい。処理負荷が心配。
•シーン内の音声が途切れるシーン内で再生しているBGMやSEがシーン再生時に途切れる。
replaceScene
![Page 78: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/78.jpg)
replaceScene
![Page 79: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/79.jpg)
![Page 80: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/80.jpg)
pushScene
![Page 81: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/81.jpg)
replaceSceneとの違い
pushScene
CCTitleScene
常駐メモリ
![Page 82: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/82.jpg)
replaceSceneとの違い
pushScene
CCTitleScene
常駐メモリ
![Page 83: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/83.jpg)
replaceSceneとの違い
pushScene
CCTitleScene
CCOptionScene
常駐メモリ
![Page 84: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/84.jpg)
replaceSceneとの違い
pushScene
CCTitleScene
CCOptionScene
常駐メモリ
![Page 85: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/85.jpg)
replaceSceneとの違い
pushScene
CCTitleScene
CCOptionScene
常駐メモリpushScene(popScene)は、現在のシーンの上にシーンを読み込む。
![Page 86: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/86.jpg)
replaceSceneとの違い
CCTitleScene
CCOptionScene
常駐メモリpushScene(popScene)は、現在のシーンの上にシーンを読み込む。
popScene
![Page 87: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/87.jpg)
replaceSceneとの違い
CCTitleScene
常駐メモリpushScene(popScene)は、現在のシーンの上にシーンを読み込む。
popScene
![Page 88: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/88.jpg)
pushScene
•シーン間の再読み込みを回避前のシーンを再読み込みすることが無いため戻る時間が大幅に短縮。
•シーン内の音声が途切れない前のシーンは実質バックグラウンドで動いているため、音声は途切れない。
Solution
![Page 89: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/89.jpg)
CCTransitionScene
![Page 90: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/90.jpg)
CCTransitionScene
![Page 91: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/91.jpg)
シーン間の切り替えを綺麗に見せるためによく使いますよね?
CCTransitionScene
![Page 92: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/92.jpg)
致命的な問題点
Scene A
Scene B
![Page 93: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/93.jpg)
致命的な問題点
Scene A
Scene BpushScene
![Page 94: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/94.jpg)
致命的な問題点
Scene A
Scene BpushScene popScene
![Page 95: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/95.jpg)
致命的な問題点
Scene A
Scene BpushScene popScene
![Page 96: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/96.jpg)
致命的な問題点
Scene A
Scene BpushScene popScene
CCTransitionScene
![Page 97: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/97.jpg)
致命的な問題点
Scene A
Scene BpushScene popScene
CCTransitionScene
popSceneは、トランジションに対応していない。
![Page 98: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/98.jpg)
popSceneWithTransition
•トランジション版を使うpopSceneにトランジションパッチを当てたバージョンを使いましょう。
Solution
-(void) popSceneWithTransition: (Class)transitionClass duration:(ccTime)t{! NSAssert( runningScene_ != nil, @"A running Scene is needed"); ! [scenesStack_ removeLastObject];! NSUInteger c = [scenesStack_ count]; ! if( c == 0 ) {! ! [self end];! } else {! ! CCScene* scene = [transitionClass transitionWithDuration:t scene:[scenesStack_ objectAtIndex:c-1]];! ! [scenesStack_ replaceObjectAtIndex:c-1 withObject:scene];! ! nextScene_ = scene;! }}
http://www.cocos2d-iphone.org/forum/topic/1076付録でも紹介
![Page 99: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/99.jpg)
画像最適化手法
![Page 100: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/100.jpg)
こんなことありませんか?
•20MBに収めたい•画像の処理負荷が高い•読み込み速度が気になる
![Page 101: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/101.jpg)
![Page 102: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/102.jpg)
TexturePackerhttp://www.texturepacker.com/
![Page 103: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/103.jpg)
どんなツールか?
![Page 104: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/104.jpg)
どんなツールか?
•テクスチャを自動的に配置
![Page 105: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/105.jpg)
どんなツールか?
•テクスチャを自動的に配置•減色テクスチャ生成
![Page 106: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/106.jpg)
どんなツールか?
•テクスチャを自動的に配置•減色テクスチャ生成•圧縮テクスチャ生成
![Page 107: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/107.jpg)
どんなツールか?
•テクスチャを自動的に配置•減色テクスチャ生成•圧縮テクスチャ生成•テクスチャ最適化
![Page 108: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/108.jpg)
もっと詳しく
付録:A.3.1 TexturePacker•インストール方法•Free,Proエディションの違いについて•よく使う機能についての日本語マニュアル
![Page 109: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/109.jpg)
20MBに収めるテクニック
![Page 110: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/110.jpg)
20MBに収めるテクニック
1.画像を減色する
![Page 111: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/111.jpg)
20MBに収めるテクニック
1.画像を減色する2.テクスチャフォーマット
![Page 112: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/112.jpg)
20MBに収めるテクニック
1.画像を減色する2.テクスチャフォーマット3.圧縮テクスチャ
![Page 113: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/113.jpg)
1.画像を減色する
RGBA8888BGRA8888RGB4444RGBA5555RGBA5551RGB565PVRTC4PVRTC2Alpha
豊富なフォーマット
Solution
![Page 114: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/114.jpg)
減色用フォーマット
RGBA8888:デフォルト画質を落としたくない時。フルカラー画像に向いている。ファイルサイズは最も大きくなる。
RGBA4444,5555画質多少落としても問題ない時に利用。RGBA5555は、PVR形式で出力できないので注意。マッハバンドが出やすい。
RGBA5551,RGB565α値=透過色扱いなら、RGBA5551も検討できる。α値が全く含まれない場合は、RGB565でさらにファイルサイズ減。
![Page 115: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/115.jpg)
2.テクスチャを圧縮する
PNGPVRGZip & PVRZLib & PVRJPG
豊富なフォーマット
Solution
![Page 116: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/116.jpg)
フォーマットの使い分け
PNG(pngフォーマット)α値も格納出来る一般的な画像フォーマット。可逆圧縮。Bitmapなどと異なりファイルサイズは小さくなる。cocos2dでは単体画像でよく使われるフォーマット。
CCSprite *sprite = nil;[CCSprite spriteWithFile:@"Icon.png"];
![Page 117: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/117.jpg)
PVR(PowerVR テクスチャフォーマット)PVR形式は、最終的にVRAMに配置されるフォーマット形式であるため、テクスチャの読み込みが激的に速くなる。ただし、ファイルサイズは比較的大きくなる。*通常テクスチャは、画像ファイルを読み込み、OpenGL用のVRAM転送関数で転送する際、VRAMのフォーマットに変換する。これらがオーバーヘッドとなるため、転送時間が別途かかってしまう。
Not PVR
PVR
read transfer
![Page 118: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/118.jpg)
PVR(PowerVR テクスチャフォーマット)PVR形式は、最終的にVRAMに配置されるフォーマット形式であるため、テクスチャの読み込みが激的に速くなる。ただし、ファイルサイズは比較的大きくなる。*通常テクスチャは、画像ファイルを読み込み、OpenGL用のVRAM転送関数で転送する際、VRAMのフォーマットに変換する。これらがオーバーヘッドとなるため、転送時間が別途かかってしまう。
Not PVR
PVR
read transfer
![Page 119: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/119.jpg)
PVR(PowerVR テクスチャフォーマット)PVR形式は、最終的にVRAMに配置されるフォーマット形式であるため、テクスチャの読み込みが激的に速くなる。ただし、ファイルサイズは比較的大きくなる。*通常テクスチャは、画像ファイルを読み込み、OpenGL用のVRAM転送関数で転送する際、VRAMのフォーマットに変換する。これらがオーバーヘッドとなるため、転送時間が別途かかってしまう。
Not PVR
PVR
read transfer
![Page 120: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/120.jpg)
PVR(PowerVR テクスチャフォーマット)PVR形式は、最終的にVRAMに配置されるフォーマット形式であるため、テクスチャの読み込みが激的に速くなる。ただし、ファイルサイズは比較的大きくなる。*通常テクスチャは、画像ファイルを読み込み、OpenGL用のVRAM転送関数で転送する際、VRAMのフォーマットに変換する。これらがオーバーヘッドとなるため、転送時間が別途かかってしまう。
Not PVR
PVR
read transfer
x5~10 speed up!!
![Page 121: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/121.jpg)
GZip compressed PVR(.pvr.gz)PVR形式のフォーマットをgzipで圧縮したフォーマット。データの抽出と伸張が同時に出来るためメモリ使用量が少ない。*通常、圧縮されたファイルは展開後のデータを格納するためのメモリを別途確保する必要があり、データ展開時にメモリ消費が激しくなる傾向がある。これはその問題を解決するフォーマットである。
GZip PVR
new
![Page 122: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/122.jpg)
GZip compressed PVR(.pvr.gz)PVR形式のフォーマットをgzipで圧縮したフォーマット。データの抽出と伸張が同時に出来るためメモリ使用量が少ない。*通常、圧縮されたファイルは展開後のデータを格納するためのメモリを別途確保する必要があり、データ展開時にメモリ消費が激しくなる傾向がある。これはその問題を解決するフォーマットである。
GZip PVR
new
![Page 123: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/123.jpg)
GZip compressed PVR(.pvr.gz)PVR形式のフォーマットをgzipで圧縮したフォーマット。データの抽出と伸張が同時に出来るためメモリ使用量が少ない。*通常、圧縮されたファイルは展開後のデータを格納するためのメモリを別途確保する必要があり、データ展開時にメモリ消費が激しくなる傾向がある。これはその問題を解決するフォーマットである。
GZip PVR
new
![Page 124: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/124.jpg)
Zlib compressed PVR(.pvr.ccz)PVR形式のフォーマットをzlibで圧縮したフォーマット。pvr.gzの登場以前に採用されていたフォーマット。*ファイルの抽出と慎重は同時に行えないため展開後のデータサイズを別途メモリ確保する必要がある。
Zlib PVR
![Page 125: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/125.jpg)
Zlib compressed PVR(.pvr.ccz)PVR形式のフォーマットをzlibで圧縮したフォーマット。pvr.gzの登場以前に採用されていたフォーマット。*ファイルの抽出と慎重は同時に行えないため展開後のデータサイズを別途メモリ確保する必要がある。
Zlib PVR
![Page 126: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/126.jpg)
Zlib compressed PVR(.pvr.ccz)PVR形式のフォーマットをzlibで圧縮したフォーマット。pvr.gzの登場以前に採用されていたフォーマット。*ファイルの抽出と慎重は同時に行えないため展開後のデータサイズを別途メモリ確保する必要がある。
Zlib PVR
![Page 127: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/127.jpg)
Zlib compressed PVR(.pvr.ccz)PVR形式のフォーマットをzlibで圧縮したフォーマット。pvr.gzの登場以前に採用されていたフォーマット。*ファイルの抽出と慎重は同時に行えないため展開後のデータサイズを別途メモリ確保する必要がある。
Zlib PVR
![Page 128: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/128.jpg)
JPG(.jpg)WEBなどでも一般的によく使われるJPEG画像。非可逆圧縮であるため、圧縮率を調整しながら希望の画質とファイルサイズまで調整することができる。
JPEG
![Page 129: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/129.jpg)
JPG(.jpg)WEBなどでも一般的によく使われるJPEG画像。非可逆圧縮であるため、圧縮率を調整しながら希望の画質とファイルサイズまで調整することができる。
JPEG
![Page 130: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/130.jpg)
3.圧縮テクスチャ
RGBA8888BGRA8888RGB4444RGBA5555RGBA5551RGB565PVRTC4PVRTC2Alpha
PVRTC?
Solution
![Page 131: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/131.jpg)
PVRTC
•PowerVR専用圧縮テクスチャフルカラー系の画像に特化したテクスチャフォーマット。大幅に画像サイズを小さくすることが出来る。但し、画質は犠牲になる。
![Page 132: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/132.jpg)
PVRTC用フォーマット
PVRTC44bit PVRTC圧縮テクスチャ。画質を優先したい場合は、このフォーマットを利用する。フルカラーに向いている。
PVRTC22bit PVRTC圧縮テクスチャ。画質よりもサイズを優先したい場合は、このフォーマットを利用する。但し、画質は相当悪くなってしまう。
![Page 133: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/133.jpg)
画像の継ぎ目をなくす
![Page 134: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/134.jpg)
エフェクト画像の裏話
![Page 135: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/135.jpg)
エフェクト画像の裏話
テクスチャの容量、メモリ使用量を抑えるため以下のような素材を4つ組み合わせて、エフェクト画像を生成している。
![Page 136: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/136.jpg)
エフェクト画像の裏話
テクスチャの容量、メモリ使用量を抑えるため以下のような素材を4つ組み合わせて、エフェクト画像を生成している。
![Page 137: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/137.jpg)
エフェクト画像の裏話
テクスチャの容量、メモリ使用量を抑えるため以下のような素材を4つ組み合わせて、エフェクト画像を生成している。
![Page 138: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/138.jpg)
エフェクト画像の裏話
テクスチャの容量、メモリ使用量を抑えるため以下のような素材を4つ組み合わせて、エフェクト画像を生成している。
![Page 139: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/139.jpg)
エフェクト画像の裏話
テクスチャの容量、メモリ使用量を抑えるため以下のような素材を4つ組み合わせて、エフェクト画像を生成している。
![Page 140: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/140.jpg)
画像の継ぎ目???
![Page 141: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/141.jpg)
画像の継ぎ目???
![Page 142: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/142.jpg)
画像の継ぎ目???
テクスチャを4つ綺麗に並べて表示。しかし、浮動小数点の誤差で間に隙間が出来てしまう。
![Page 143: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/143.jpg)
画像の継ぎ目???
![Page 144: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/144.jpg)
画像の継ぎ目???
そこで、画像同士を1ピクセルそれぞれ重ねて表示させることで継ぎ目をなくしている。
![Page 145: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/145.jpg)
画像の継ぎ目???
そこで、画像同士を1ピクセルそれぞれ重ねて表示させることで継ぎ目をなくしている。
![Page 146: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/146.jpg)
継ぎ目が目立つ!?
![Page 147: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/147.jpg)
継ぎ目が目立つ!?
![Page 148: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/148.jpg)
継ぎ目が目立つ!?
![Page 149: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/149.jpg)
継ぎ目が目立つ!?
![Page 150: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/150.jpg)
継ぎ目が目立つ!?
![Page 151: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/151.jpg)
継ぎ目が目立つ!?
ピクセル同士の重なりの部分がα値を含む場合、浮動小数の誤差により、1ピクセル以上重なることがある。これにより、画像の境界が濃くなってしまう。
![Page 152: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/152.jpg)
TexturePackerを使う
Extrude
Solution
![Page 153: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/153.jpg)
TexturePackerを使う
Extrude
画像の境界のピクセルを指定したピクセル数分押し出す機能
Solution
![Page 154: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/154.jpg)
TexturePackerを使う
Extrude
画像の境界のピクセルを指定したピクセル数分押し出す機能
Solution
![Page 155: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/155.jpg)
TexturePackerを使う
Extrude
画像の境界のピクセルを指定したピクセル数分押し出す機能
Solution
![Page 156: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/156.jpg)
TexturePackerを使う
Extrude
画像の境界のピクセルを指定したピクセル数分押し出す機能
Solution
![Page 157: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/157.jpg)
TexturePackerを使う
Extrude
Extrude=2
画像の境界のピクセルを指定したピクセル数分押し出す機能
Solution
![Page 158: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/158.jpg)
TexturePackerを使う
Extrude
境界が押し出されるため、1ピクセル以上重なっても予期しないピクセル同士の重なりを防ぐことが可能。
Extrude=2
画像の境界のピクセルを指定したピクセル数分押し出す機能
Solution
![Page 159: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/159.jpg)
サウンド容量を削減する
![Page 160: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/160.jpg)
サウンドの再生(SE)
wave format
wave:非圧縮フォーマットSEは、BGMなどとは違い、レスポンス重視であるためこのフォーマットがよく使われる。サイズが大きい。
![Page 161: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/161.jpg)
IMA-ADPCM•16bitのデータを4bit/1サンプルに圧縮
エンコード、デコードも速く、サンプルの音質低下もわずか。
•cocos2d:再生をサポートOpenALは、IMA-ADPCMフォーマットを未サポート。cocos2dでは、ExtendAudio機能を使い、PCMフォーマットにデコードし、データをOpenALに渡すことで再生している。
ima PCM
![Page 162: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/162.jpg)
サウンドの作成
afconvert -f caff -d ima4@22050 “ファイル名”
afconvertツールは、Mac標準でインストール済み。ターミナルを立ち上げて、上記コマンドを打ち込むことでwave -> caff(ima)フォーマットに変換可能。
![Page 163: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/163.jpg)
座標系を変更
![Page 164: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/164.jpg)
cocos2dの座標系(変更前)
![Page 165: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/165.jpg)
cocos2dの座標系(変更前)
(0,0)
![Page 166: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/166.jpg)
cocos2dの座標系(変更前)
(0,0)+X軸
![Page 167: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/167.jpg)
cocos2dの座標系(変更前)
(0,0)+X軸
+Y軸
![Page 168: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/168.jpg)
(0,0)+X軸
+Y軸
![Page 169: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/169.jpg)
(0,0)+X軸
+Y軸
cocos2dの座標系(変更後)
![Page 170: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/170.jpg)
(0,0)+X軸
+Y軸
cocos2dの座標系(変更後)
![Page 171: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/171.jpg)
ccp()マクロを書き換える
#undef ccp#define ccp(__X__,__Y__) CGPointMake((__X__),(480.0f-(__Y__)))
#undef ccp#define ccp(__X__,__Y__) CGPointMake((__X__),(320.0f-(__Y__)))
#define ccop(__X__,__Y__) CGPointMake( (__X__),(__Y__) )
横画面用
縦画面用
オリジナル
Solution
![Page 172: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/172.jpg)
使用方法
#import “cocos2d.h”#import “XXXXX.h”
#undef ccp#define ccp(__X__,__Y__) CGPointMake((__X__),(480.0f-(__Y__)))
![Page 173: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/173.jpg)
使用方法
#import “cocos2d.h”#import “XXXXX.h”
#undef ccp#define ccp(__X__,__Y__) CGPointMake((__X__),(480.0f-(__Y__)))
cocos2d.hでccpが定義されているので、その下でccp()を再定義する。”ゲーム内だけでccp()の定義を変更”する。
![Page 174: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/174.jpg)
新しいccp()での位置
![Page 175: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/175.jpg)
新しいccp()での位置
sprite.position = ccp(100,100)
![Page 176: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/176.jpg)
新しいccp()での位置
sprite.position = ccp(100,100)
![Page 177: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/177.jpg)
AfterEffectsとの連携
![Page 178: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/178.jpg)
AfterEffectsとの連携
![Page 179: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/179.jpg)
AfterEffectsとの連携
![Page 180: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/180.jpg)
AfterEffectsとの連携
![Page 181: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/181.jpg)
AfterEffectsとの連携
左上起点のAfterEffects上の座標がそのまま使えるので、レイアウトツールとして利用。
![Page 182: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/182.jpg)
便利なクラス
![Page 183: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/183.jpg)
CCBumper
•起動時ロゴ表示クラスDefault.pngとは別に起動時ロゴ画面を出したい時に利用。このクラス表示時に画像の読み込みを行ったりする。
Hello World
![Page 184: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/184.jpg)
CCBumper
•起動時ロゴ表示クラスDefault.pngとは別に起動時ロゴ画面を出したい時に利用。このクラス表示時に画像の読み込みを行ったりする。
Hello World
![Page 185: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/185.jpg)
- (void) applicationDidFinishLaunching:(UIApplication*)application{ /* 省略 */! // Run the intro Scene! [[CCDirector sharedDirector] runWithScene: [CCBumper scene]];}
使用方法
CCBumper scene
HelloWorldLayer scene
![Page 186: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/186.jpg)
- (void) applicationDidFinishLaunching:(UIApplication*)application{ /* 省略 */! // Run the intro Scene! [[CCDirector sharedDirector] runWithScene: [CCBumper scene]];}
使用方法
CCBumper scene
HelloWorldLayer sceneCCBumper内で次に読み込みたいシーンを設定しておく
![Page 187: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/187.jpg)
Demo
![Page 188: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/188.jpg)
![Page 189: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/189.jpg)
![Page 190: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/190.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureA.png
TextureB.png
TextureC.png
![Page 191: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/191.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureA.png
TextureB.png
TextureC.png
![Page 192: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/192.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureA.png
TextureB.png
TextureC.png
![Page 193: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/193.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureA.png
TextureB.png
TextureC.png
![Page 194: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/194.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureA.png
TextureB.png
TextureC.png
resourceCount = 3
![Page 195: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/195.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureB.png
TextureC.png
resourceCount = 3resourceCount = 2
![Page 196: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/196.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureC.png
resourceCount = 3resourceCount = 2
![Page 197: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/197.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
TextureC.png
resourceCount = 3
resourceCount = 2resourceCount = 1
![Page 198: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/198.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
resourceCount = 3
resourceCount = 2resourceCount = 1
![Page 199: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/199.jpg)
CCResourceAsyncLoader
•非同期読み込み支援クラス手軽に非同期読み込みを実現するためのクラス。素材を読み込む毎に処理も記述できる=プログレスバーの実装。
CCResourceAsyncLoader
resourceCount = 3
resourceCount = 2resourceCount = 0
Loading Complete!!
![Page 200: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/200.jpg)
使用方法(起動まで)
CCResourceAsyncLoader *loader = nil; NSArray *resourceNames = [NSArray arrayWithObjects: @"1.tif", @"2.tif", @"3.tif", nil]; CCSendMessages *message = [CCSendMessages actionWithTarget:self]; [[message addMessage] loadComplete];
loader = [CCResourceAsyncLoader loaderWithCount:[resourceNames count]]; loader.tag = kTag_CCBumper_Loader;
for (NSString *path in resourceNames) { [loader addLoadAsyncTexture:path message:message]; } [self addChild:loader];
![Page 201: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/201.jpg)
使用方法(起動まで)
CCResourceAsyncLoader *loader = nil; NSArray *resourceNames = [NSArray arrayWithObjects: @"1.tif", @"2.tif", @"3.tif", nil]; CCSendMessages *message = [CCSendMessages actionWithTarget:self]; [[message addMessage] loadComplete];
loader = [CCResourceAsyncLoader loaderWithCount:[resourceNames count]]; loader.tag = kTag_CCBumper_Loader;
for (NSString *path in resourceNames) { [loader addLoadAsyncTexture:path message:message]; } [self addChild:loader];
読み込み後呼び出し
![Page 202: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/202.jpg)
使用方法(起動まで)
CCResourceAsyncLoader *loader = nil; NSArray *resourceNames = [NSArray arrayWithObjects: @"1.tif", @"2.tif", @"3.tif", nil]; CCSendMessages *message = [CCSendMessages actionWithTarget:self]; [[message addMessage] loadComplete];
loader = [CCResourceAsyncLoader loaderWithCount:[resourceNames count]]; loader.tag = kTag_CCBumper_Loader;
for (NSString *path in resourceNames) { [loader addLoadAsyncTexture:path message:message]; } [self addChild:loader];
読み込み後呼び出し
ローダーのセットアップ
![Page 203: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/203.jpg)
使用方法(起動まで)
CCResourceAsyncLoader *loader = nil; NSArray *resourceNames = [NSArray arrayWithObjects: @"1.tif", @"2.tif", @"3.tif", nil]; CCSendMessages *message = [CCSendMessages actionWithTarget:self]; [[message addMessage] loadComplete];
loader = [CCResourceAsyncLoader loaderWithCount:[resourceNames count]]; loader.tag = kTag_CCBumper_Loader;
for (NSString *path in resourceNames) { [loader addLoadAsyncTexture:path message:message]; } [self addChild:loader];
読み込み後呼び出し
ローダーのセットアップ
ローダーの起動
![Page 204: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/204.jpg)
使用方法(読み込み後)
- (void) loadComplete {
CCNode *obj = [self getChildByTag:kTag_CCBumper_Loader]; NSAssert([obj isKindOfClass:[CCResourceAsyncLoader class]], @"Not CCResourceAsyncLoader"); CCResourceAsyncLoader *loader = (CCResourceAsyncLoader *)obj; loader.resourceCount--; // Load Complete!! if( loader.resourceCount == 0 ) { /* 読み込み完了後にしたい処理 */ } /* loader.resourceCountを使ってプログレスバーを更新したり */}
![Page 205: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/205.jpg)
使用方法(読み込み後)
- (void) loadComplete {
CCNode *obj = [self getChildByTag:kTag_CCBumper_Loader]; NSAssert([obj isKindOfClass:[CCResourceAsyncLoader class]], @"Not CCResourceAsyncLoader"); CCResourceAsyncLoader *loader = (CCResourceAsyncLoader *)obj; loader.resourceCount--; // Load Complete!! if( loader.resourceCount == 0 ) { /* 読み込み完了後にしたい処理 */ } /* loader.resourceCountを使ってプログレスバーを更新したり */}
ローダー取り出し
![Page 206: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/206.jpg)
使用方法(読み込み後)
- (void) loadComplete {
CCNode *obj = [self getChildByTag:kTag_CCBumper_Loader]; NSAssert([obj isKindOfClass:[CCResourceAsyncLoader class]], @"Not CCResourceAsyncLoader"); CCResourceAsyncLoader *loader = (CCResourceAsyncLoader *)obj; loader.resourceCount--; // Load Complete!! if( loader.resourceCount == 0 ) { /* 読み込み完了後にしたい処理 */ } /* loader.resourceCountを使ってプログレスバーを更新したり */}
ローダー取り出し
リソースカウント更新&
ユーザー処理
![Page 207: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/207.jpg)
使用方法(読み込み後)
- (void) loadComplete {
CCNode *obj = [self getChildByTag:kTag_CCBumper_Loader]; NSAssert([obj isKindOfClass:[CCResourceAsyncLoader class]], @"Not CCResourceAsyncLoader"); CCResourceAsyncLoader *loader = (CCResourceAsyncLoader *)obj; loader.resourceCount--; // Load Complete!! if( loader.resourceCount == 0 ) { /* 読み込み完了後にしたい処理 */ } /* loader.resourceCountを使ってプログレスバーを更新したり */}
ローダー取り出し
リソースカウント更新&
ユーザー処理
loadCompleteは、メインスレッド呼び出し
![Page 208: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/208.jpg)
Demo
![Page 209: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/209.jpg)
![Page 210: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/210.jpg)
![Page 211: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/211.jpg)
![Page 212: Advanced cocos2d](https://reader036.vdocuments.net/reader036/viewer/2022062418/554bd5ecb4c9058f6c8b50b6/html5/thumbnails/212.jpg)
Enjoy cocos2d programming