Cocos2Dを使用したiPhoneゲーム開発の基礎

こんにちは、ガーディアン!



多くの人々は、プログラムやゲームを書くことを学ぶことを夢見ていますが、多くの理由でうまくいきません。 最初は、面白いプラットフォームがなかったので、何も書きたくありませんでしたが、まだ小さすぎました。 その後、すべてが変わりました。 電話業界で新しい時代が始まりました-iPhoneが登場しました。 彼のことを聞いてすぐに、それを手に入れたいと思いました。 私はすぐにプラットフォームが好きで、ボタンもスタイラスもありません-ゲーム用が一番です。

プログラムと呼べるのであれば、2009年11月にプログラムを書き始めました。 多くの人が私がどのように勉強したかを尋ねます-YouTubeのビデオチュートリアルでですが、他の方法は? iPhone SDKのわかりにくいチュートリアルを読んでください。 その瞬間、私は私のような人々に教えるというアイデアを得ました-私は新しいトピックのためにYouTubeでビデオを録画し始めました。

興味がある場合: http : //bit.ly/pdyoutube それからすべてが行き交い、彼自身がプログラミングが上手になり、すべてがより良く記憶されました。 非常に長い紹介は書きません-最も興味深いものに移りましょう。



私はいつもゲームを作りたかったのですが、空のXcodeではあまり便利で理解しやすいものではありませんでした。 彼は、iPhone、iPad用のゲームを開発するためのプラットフォーム(フレームワーク)を選択し始めました。 私の選択はCocos2Dでした。 多くの人が理由を尋ねるでしょう-非常に使いやすいです! また、無料で頻繁に更新されます!



まだお持ちでない場合は、インストールする価値があります。 これはすべて非常に簡単に行われます。 http://bit.ly/cocos2dsiteにアクセスして 、ダウンロードからダウンロードし、解凍します。 現在のバージョンは1.0 rc-3です。 安定していないと言われていますが、開発には非常に適しています。 彼女は非常に安定しています。



解凍すると、「cocos2d-iphone-1.0.0-rc3」というフォルダーが取得されます。



ターミナルを開き、cdと入力します。



画像



スペースバーを押して、フォルダをターミナルにドラッグします。 ハードドライブ上のフォルダーの場所が表示されます。



画像



Enterキーを押して、「./ install-templates.sh –u –f」と入力します。 次にEnterをもう一度押します。



画像

画像



単語の行が流れ込み、約20秒後に完了します! それが表示された場合-あなたはすべて正しかった!



画像



さらに、ターミナルは必要なくなります。閉じることができます。 ここで、Xcodeを開きます。 Xcode 4をお勧めします。使いやすく、かなり安定しています。 iPhoneまたはMac開発者プログラムの料金を支払った場合は、Mac AppStoreで購入するか、developer.apple.comからダウンロードできます。

Xcodeを開くと、歓迎されます。



画像



Macにドキュメントを配置するかどうかを尋ねる必要があります。 それはあなた次第ですが、私は同意しました。 右側には、最近のプロジェクトのリストの選択が左側に表示されます-「新しいプロジェクトの作成」、「リポジトリへの接続」、「Xcode 4の詳細」、developer.apple.comへのリンク。



「新規プロジェクトの作成」を選択します。



画像



「新規プロジェクトの作成」で、iPhoneまたはMacを選択できます。 iPhoneでcocos2dを選択します。



「cocos2d」を選択し、「次へ」をクリックします。



画像



ここで、名前と「会社識別子」を選択できます。 Hello Worldプロジェクトに名前を付けます。



それから彼は保存することを申し出ます、あなたはただ保存する場所を選ばなければなりません。



保存後、Xcodeが開きます。 次のようになります。



画像



プロジェクトをまとめて、そこにあるものを見てみましょう。 これは、「実行」ボタンをクリックして行います。 初めてコンパイルするときは、すべてマシンのパワーに依存します。



画像



Hello WorldメッセージがiPhoneの画面に表示されます。



画像



iPad用に開発する場合は、iPhoneをiPadに変更すると、碑文がiPadに表示されます。



画像



デバイスにインストールするには、Appleから開発者証明書を購入する必要があります。



プロジェクトはすでにそこにありますが、今ではあなたのアイデアを現実に変換するだけです。



心配しないで、それだけではありません!

次に、写真を追加し、それらに対してさまざまなアクションを実行する方法を示します。



最も簡単な方法はGoogleですが、ほとんどの画像は著作権で保護されており、使用を許可されていません。 私は私のものを使用します。



古いゲーム-Iceberg Alertから写真を撮ります。 3つの氷山とボートを使用します。 2つの解像度の画像(iPhoneおよびiPhone 4)。 cocos2dのRetinaの画像は、「name-hd.yourformat」という名前形式にする必要があります。 通常の解像度の写真には「name.yourformat」があります。

わかりやすくするためのスクリーンショットを次に示します。



画像



次に、これらのファイルをプロジェクトに追加し、プロジェクトフォルダーに保存します。



コードを始めましょう。



HelloWorldLayer.mで、CCLabelに関連する8つの文字列を削除します。 削除後、すべてが次のようになります。



画像 P



将来のゲームに写真を追加するときが来ました。 写真はCCSpriteです。 initにあるものはすべて、そのレイヤー(画面)の初期化時に作成されます。

最初に、最初のスプライトを追加します。 これは、3行のコードで実行されます。 コードは、「Hello World」という碑文のコードがあった場所に書き込まれます。



コード:



CCSprite *iceberg1 = [CCSprite spriteWithFile:@"iceberg1.png"];

iceberg1.position = ccp(100,100);

[self addChild:iceberg1];








最初の行では、CCSpriteをデバイスのメモリに追加して、後で追加できるようにします。 名前には、接尾辞-hdを付けないでください。 Cocos2D自体は、プログラムで-hdイメージを検出します。

2行目は、画像の座標を示しています。 私の場合、xは100、yは100です。 位置を指定しない場合、スプライトは画面の左下隅にあります。

3行目は、レイヤーにスプライトを追加します。

最後の行が書き込まれていない場合、何も表示されません。



プロジェクトをまとめると、次のようなものが得られます。



画像



同様に、他の写真を追加します。 外観は次のとおりです。



画像



すべてを合わせるには、最初のスプライトの座標を変更する必要がありました。



最後の図に示されているすべてのスプライトを追加するコードは次のとおりです。



CCSprite *iceberg1 = [CCSprite spriteWithFile:@"iceberg1.png"];

iceberg1.position = ccp(40,100);

[self addChild:iceberg1];



CCSprite *iceberg2 = [CCSprite spriteWithFile:@"iceberg2.png"];

iceberg2.position = ccp(110,100);

[self addChild:iceberg2];



CCSprite *iceberg3 = [CCSprite spriteWithFile:@"iceberg3.png"];

iceberg3.position = ccp(180,100);

[self addChild:iceberg3];



CCSprite *ship = [CCSprite spriteWithFile:@"ship.png"];

ship.position = ccp(270,100);

[self addChild:ship];








さて、私たちは写真を持っています-今何をしますか? アクション(CCAction)を使用してそれらを管理する方法を示します。

ココナッツには多くのアクションがあります。それらのいくつかの使用方法を紹介します。



アクションに関する詳細は、Cocos2DチュートリアルSDKプログラム(iPad)に記載されています: http ://bit.ly/sdkcocos2d



スプライトを特定のポイントに移動する方法、ねじる方法、どのように

透明にする、特定のレベルまで上げる方法

サイズ。



まず、スプライトをさまざまな角度で配置します。



コード:



CCSprite *iceberg1 = [CCSprite spriteWithFile:@"iceberg1.png"];

iceberg1.position = ccp(40,100);

[self addChild:iceberg1];



CCSprite *iceberg2 = [CCSprite spriteWithFile:@"iceberg2.png"];

iceberg2.position = ccp(150,250);

[self addChild:iceberg2];



CCSprite *iceberg3 = [CCSprite spriteWithFile:@"iceberg3.png"];

iceberg3.position = ccp(250,100);

[self addChild:iceberg3];



CCSprite *ship = [CCSprite spriteWithFile:@"ship.png"];

ship.position = ccp(400,250);

[self addChild:ship];








次のようになります。



画像



それでは、ビジネスに取り掛かりましょう。



左端のスプライトから始めましょう。 上に移動します。 これを行うために、CCMoveToというアクションがあります。これを使用する方法を次に示します。



コード:



[iceberg1 runAction:[CCMoveTo actionWithDuration:5.0f position:ccp(iceberg1.position.x,280)]];







スプライト追加コードの下に追加します。 外観は次のとおりです。



画像



このコードはどういう意味ですか?



1) iceberg1



アクションを実行する最初のスプライトの名前

2) runAction:



-アクションを実行します

3) CCMoveTo



アクション名

4) ctionWithDuration:5.0f position:ccp(iceberg1.position.x,280)



-アクション5秒、位置。



最初のアクションが整理されています。

次に、2番目のスプライトでアクションを開始しましょう。 それをひねります。

これには、CCRotateByというアクションがあります。



コード:



[iceberg2 runAction:[CCRotateBy actionWithDuration:5.0f angle:360]];







最初の部分は明確でなければならないので、2番目の部分が何をするのかを説明します。

actionWithDuration:5.0f angle:360



アクション5秒、360度の角度。 iPhoneの画面では次のように表示されます。 ご覧のとおり、2番目のスプライトが回転しています。



画像 写真19



すべてが機能します。 3番目のスプライトの時間です。 私たちは透明になります。

このために、CCFadeToアクションを使用します。

コード:

[iceberg3 runAction:[CCFadeTo actionWithDuration:5.0f opacity:0]];





すべてが明確でなければなりません。 最後の部分は、アクションが5秒間続き、0に透明になる(完全に)ことを意味します。

5秒以内に、スプライトは透明になります。



4番目のスプライト-船の時間です。 増やします。

これにはCCScaleアクションがあります。

コード:

[ship runAction:[CCScaleTo actionWithDuration:5.0f scale:2.0]];







コードは明確でなければなりません。 スプライトを2倍に増やします。



あなたがそれを楽しんで、読書中に眠りに落ちなかったことを願っています。



すべてが次のようになります。







参照:



写真なしのプロジェクトへのリンク: リンク

Cocos2d Webサイト: リンク



All Articles