ゴーストシミュレータ。 プログラマーになるというアイデアから、iOSで完成したゲームまで

プログラミングを学ぶことを決めてから約10か月が経過しました。なぜなら、現在のテクニカルサポートエンジニアの仕事は単に私を無関心にし、何ももたらさないからです。 そして、学習プロセスをできるだけ面白くするために、モバイルデバイス用のゲームを作成することにしました。 次に、私がまさに作成しようとしていたものと、初心者が直面しなければならない困難について説明します。







IT業界の世界に自分の人生をつなげたいと思っている初心者デベロッパーにとって重要なポイントが1つあります。 最も快適な自己教育戦略を自分で決定する必要があります。 1つは実用的なタスクを定期的に解決する必要があり、もう1つは理論の微妙なニュアンスを理解するまで動きません。 実際、大多数は、彼らの意図の純粋さにもかかわらず、主な仕事、家族、友人、趣味を持っています...そして、とにかく、すべてのこの日常的な渦はあなたのトレーニングの時間と質に影響します。 そして、それはあなたが長い箱にあなたの毎日の活動を投げて、彼らに二度と戻ってこないという事実につながります。



私にとって、最も快適な開発方法は、ゲームまたはアプリケーションの形で結果の全体的で明確な画像を見ることができるときだと判断しました。 プラットフォームとして、iOSとそれに付随する言語であるApple-Objective-Cを選択しました。 Cocos2d-iphoneは、ゲームフレームワークに最適でした。 シンプルで無料であり、インターネット上に膨大な数の例とチュートリアルがあります。



ゲーム自体について、ファンタジーでどのように見えるか、そしてそれを実装するために何をする必要があるかについて話をする時です。

プロジェクトのアイデア

このゲームは「ゴーストシミュレーター」と呼ばれ、クエストパズルとシミュレーターアンチストレスの組み合わせです。 あなたのヒーローは神秘的な状況で死に、幽霊になります。 しかし、人生はそこで終わりではなく、逆に、はるかに楽しいものになります。 結局のところ、今、あなたは彼らを怖がらせ、彼らをヒステリーに連れて行くことによって、人生のすべての犯罪者に復takeすることができます。



ゲームプレイは悪者の部屋にいることになります。 さまざまなオブジェクトをシフトすることで、被害者の恐怖を養うことができ、そこから強くなり、より複雑なトリックを実行できます。 最初のスケッチは次のとおりです。







アイデアは熟している。 しかし、それを実装するには、最初にプログラミング方法を学ぶ必要があります。 また、誰もが自分で言語と情報源を学習する方法を選択する必要があります。 Objective-Cの学習計画のみを提供できます。 特定の本ではなく、インターネットで説明を探しているトピックについて勉強することを提案します。 これにより、より多くの情報の中で機会が与えられます。 リソース、最も理解しやすく読みやすいものを選択し、さらに、新しい概念の誤った解釈の可能性を減らします。 私に最も適した本は、Stephen Cochan「Programming on Objective-C 2.0」、Bert Altenberg、Alex Clarke「Become an Xcoder」、およびビデオチュートリアルwww.youtube.com/user/MacroTeamChannel、macscripter.ru Webリソースでした。 、imaladec.com。



一般に、100ドルで古いMacBookを購入し、Xcodeバージョン4.3（新しいバージョンはインストールされていません）をアップロードして、次のトピックの学習を開始しました。



-オブジェクト指向プログラミング。

-Xcodeのインターフェイスと要素。

-プリミティブデータ型。

-オブジェクトとクラス。 NSDate、＃define、NSString。 変数のスコープ。

-メソッド。 セレクター

-配列。 NSArray、NSMutableArray、NSSet、NSDictionary、NSNumber。

-独自の作成。 クラス（＃import、 interface 、@ implementation、 private 、public、protected、 readonly 、readwrite、setter、getter）。

-プロパティ。

-OOPパラダイム：継承、ポリモーフィズム、カプセル化。

-カテゴリー。

-パターン。 MVC：通知、デリゲート、アウトレット、ターゲット、送信者。

-View Controllerのライフサイクル。

-委任。 プロトコル（最適、必須）。

-ブロック。

-ビュー、ジェスチャー認識。

-マルチスレッド（GCD）、KVOブロードキャスター、UIAlertView、UIActionSheet。

-シングルトン。

-メモリの操作（保持、リリース、自動リリース）。 ARC。

-ネットワークを操作します。 データをダウンロードします。 NSCashe。

-JSON。



小さな理論を解いてこの理論を研究した後、プログラムとは何か、何かのプログラミングプロセスがどのように機能するかについての一般的なアイデアを得ました。 ゲームに戻って、私の計画を実現することがいかに現実的であるかを理解する時が来ました。

ゲームの仕組み

結局のところ、cocosエンジンのおかげで、ゲームは非常に簡単に実装できるはずです。 最初のシーンを作成し、背景として機能するメインレイヤーを追加し、スプライトの形で画像を追加し、メニュー項目を追加します。 cocos2dはARCをサポートしていないため、別のシーンへのトランジションを作成し、deallocメソッドですべての使用済みオブジェクトをリセットします...

// Import the interfaces #import "HelloWorldLayerr.h" #import "CCTouchDispatcher.h" #import "CCAnimation.h" #import "SimpleAudioEngine.h" #import "LanguageOfGame.h" #import "LanguageOfGameUA.h" #import "LanguageOfGameRu.h" CCScene* scene; CCMenu* startMenu; // HelloWorldLayer implementation @implementation HelloWorldLayerr +(CCScene *) scene { // 'scene' is an autorelease object. scene = [CCScene node]; // 'layer' is an autorelease object. HelloWorldLayerr *layer = [HelloWorldLayerr node]; // add layer as a child to scene [scene addChild: layer]; // return the scene return scene; } // on "init" you need to initialize your instance -(id) init { if( (self=[super init])) { CGSize size = [[CCDirector sharedDirector] winSize]; //    16-   [CCTexture2D setDefaultAlphaPixelFormat:kCCTexture2DPixelFormat_RGB565]; CCSprite* startPicture = [CCSprite spriteWithFile:@"startMenu.png"]; startPicture.scale = 0.5; startPicture.position = ccp(size.width/2, size.height/2); [self addChild: startPicture z:1]; CCLabelTTF *languageLabel = [CCLabelTTF labelWithString:@"Choose your language" fontName:@"AppleGothic" fontSize:30]; languageLabel.anchorPoint = CGPointMake(0, 0.5f); languageLabel.color = ccYELLOW; languageLabel.position = ccp(size.width*0.05, size.height*9/10); [self addChild:languageLabel z:2]; CCMenuItemFont* button1 = [CCMenuItemFont itemFromString:@"ENG" target:self selector:@selector(selector1:)]; button1.color = ccYELLOW; CCMenuItemFont* button2 = [CCMenuItemFont itemFromString:@"UA" target:self selector:@selector(selector2:)]; button2.color = ccYELLOW; CCMenuItemFont* button3 = [CCMenuItemFont itemFromString:@"RU" target:self selector:@selector(selector3:)]; button3.color = ccYELLOW; startMenu = [CCMenu menuWithItems:button1, button2,button3, nil]; button1.position = ccp(size.width/4, size.height*8/10); button2.position = ccp(size.width/4, size.height*6.5/10); button3.position = ccp(size.width/4, size.height*5/10); startMenu.position = CGPointZero; [self addChild:startMenu z:10]; } return self; } -(void)selector1:(id)sender{ CCTransitionRadialCCW *transition = [CCTransitionZoomFlipX transitionWithDuration:1.1 scene:[LanguageOfGame scene]]; [[CCDirector sharedDirector] replaceScene:transition]; } -(void)selector2:(id)sender{ CCTransitionRadialCCW *transition = [CCTransitionZoomFlipX transitionWithDuration:0.8 scene:[LanguageOfGameUA scene]]; [[CCDirector sharedDirector] replaceScene:transition]; } -(void)selector3:(id)sender{ CCTransitionRadialCCW *transition = [CCTransitionZoomFlipX transitionWithDuration:0.8 scene:[LanguageOfGameRu scene]]; [[CCDirector sharedDirector] replaceScene:transition]; } //on "dealloc" you need to release all your retained objects - (void) dealloc { [scene release]; [startMenu release]; [super dealloc]; } @end
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

このトピックに関するインターネット上のレッスンはすでにたくさんあるので、ゲームに新しいフラグメントを徐々に追加する方法についての記事を散らかしません。 おもしろい瞬間だけを考えます。 たとえば、まるでその瞬間に幽霊が部屋の周りに見えないように浮遊しているかのように、指で画面に触れた後に白いループが伸びるようにしたかったのです。 幸いなことに、この場合でもココナッツの方法があります。 その実装は次のとおりです。

 CCMotionStreak* streak; //    -(void) ccTouchMoved:(UITouch *)touch withEvent:(UIEvent *)event{ NSLog(@"TouchesMoved"); CGPoint touchLocation = [self convertTouchToNodeSpace:touch]; CGPoint oldTouchLocation = [touch previousLocationInView:touch.view]; oldTouchLocation = [[CCDirector sharedDirector] convertToGL:oldTouchLocation]; oldTouchLocation = [self convertToNodeSpace:oldTouchLocation]; CGPoint changedPosition = ccpSub(touchLocation, oldTouchLocation); //      [self moveMotionStreakToTouch:touch]; } -(void)moveMotionStreakToTouch:(UITouch*)touch{ CCMotionStreak* streak = [self getMotionStreak]; streak.position = [self locationFromTouch:touch]; } -(CGPoint)locationFromTouch:(UITouch*)touch{ CGPoint touchLocation = [touch locationInView:[touch view]]; return [[CCDirector sharedDirector] convertToGL:touchLocation]; } //    -(CCMotionStreak*)getMotionStreak{ streak = [CCMotionStreak streakWithFade:0.99f minSeg:8 image:@"ghost01.png" width:22 length:48 color:ccc4(255, 255, 255, 180)]; [self addChild:streak z:5 tag:1]; CCNode* node = [self getChildByTag:1]; NSAssert([node isKindOfClass:[CCMotionStreak class]], @"not a CCMotionStreak"); return (CCMotionStreak*)node; } /*   ,        CCMotionStreak    */ -(void) ccTouchEnded:(NSSet *)touch withEvent:(UIEvent *)event{ NSLog(@"TouchesEnded"); selectedSprite = nil; streak = nil; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ゲームのロジックは、正しい順序でヒーローを怖がらせるたびに増加する単純な「int」カウンターがあるという事実に帰着します。 目的のシーケンスを決定するには、ゴーストのように考える必要があります。 もちろん、ヒントを使用できます。 カウンター値が必要な値よりも低い場合、オブジェクトに対してアクションを実行できません。 この場合、このアイテムをクリックすると、色がわずかに変化します。これは、そのアイテムに対するアクションが後で利用できることを意味します。



部屋の目的のアイテムをタッチすると、アニメーションのチェーンが始まります。 彼は自分ですべてのオブジェクトを描いたので、少なくとも恐ろしいことが判明しましたが、アーティストの骨の折れる仕事について別に言及したいと思います。

アニメーション

cocos2dには、スプライトとフレームごとの2種類のアニメーションがあります。 スプライトアニメーションは、画面上で画像を動かす最も簡単な方法です。 アクションの軌跡のみを設定します。 次に、システムはすべての処理を行い、アニメーションのすべてのフレームを所定のサイクルで実行します。

 //    -(void) nextFrame:(ccTime)dt{ bottle.positionInPixels = ccp(bottle.positionInPixels.x - 1, + bottle.positionInPixels.y); if (bottle.positionInPixels.x <= 49) { bottle.positionInPixels = ccp(bottle.positionInPixels.x + 1, + bottle.positionInPixels.y); } } -(void)moveTouchedObject:(CGPoint)changedPosition { if (selectedSprite == bottle) { [self nextFrame:5]; } }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

フレームごとのアニメーションも使用しました。

 //    CCSprite *crashBottle2 = [CCSprite spriteWithFile:@"crashBottle01.png"]; crashBottle2.scale = 0.5; [crashBottle2 setPosition:ccp(xOfBottle, yOfBottle)]; [self addChild:crashBottle2]; CCAnimation *cbot = [CCAnimation animation]; [cbot addFrameWithFilename:@"crashBottle00.png"]; [cbot addFrameWithFilename:@"crashBottle01.png"]; [cbot addFrameWithFilename:@"crashBottle02.png"]; [cbot addFrameWithFilename:@"crashBottle03.png"]; [cbot addFrameWithFilename:@"crashBottle04.png"]; [cbot addFrameWithFilename:@"crashBottle05.png"]; [cbot addFrameWithFilename:@"crashBottle06.png"]; [cbot addFrameWithFilename:@"crashBottle07.png"]; [cbot addFrameWithFilename:@"crashBottle08.png"]; [cbot addFrameWithFilename:@"crashBottle09.png"]; [cbot addFrameWithFilename:@"crashBottle10.png"]; [cbot addFrameWithFilename:@"crashBottle11.png"]; id animationAction = [CCAnimate actionWithDuration:0.2f animation:cbot restoreOriginalFrame:NO]; [crashBottle2 runAction:animationAction];
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

ただし、このアプローチでは、グラフィックアダプターが各イメージを個別に処理するため、パフォーマンスに即座に影響します。 男のアニメーションのために、新しい方法-テクスチャのアトラスを学ぶ必要がありました。



まず、Photoshopでキャラクターを完全に描画する必要がありました。 その後、画像を体の部分に分割し、別々の画像として保存します。 次のステップは、Sprite Helper PROプログラムをダウンロードしてインストールすることです。 その助けを借りて、10秒の骨格アニメーションを作成し、ストーリーボードを開始し、出力で360枚のアニメーション画像を取得します。 次に、Texture Packerプログラムを使用して、すべての画像を1つの巨大なキャンバスに移動し、そこからOpenGLが必要な部分を切り取ります。 Texture Packerは.plistドキュメントも作成します。これにより、個々のフラグメントの特性にすばやく到達できます。 画像とplistファイルをXcodeのサポートされているファイルフォルダーにインポートし、アニメーションを開始するコードを記述します。

 CCSprite *manFrame1; CCAnimate *manCodding; CCRepeatForever* repeat; //  -(void)manAnimation{ // - -     CCSpriteBatchNode *manBatchNode; [[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:@"man300N.plist"]; manBatchNode = [CCSpriteBatchNode batchNodeWithFile:@"man300N.png"]; [self addChild:manBatchNode]; CCSpriteBatchNode *manBatchNode2; [[CCSpriteFrameCache sharedSpriteFrameCache] addSpriteFramesWithFile:@"man359N.plist"]; manBatchNode2 = [CCSpriteBatchNode batchNodeWithFile:@"man359N.png"]; [self addChild:manBatchNode2]; manFrame1 = [CCSprite spriteWithSpriteFrameName:@"UntitledAnimation_0.png"]; manFrame1.position = ccp(size.width*0.4187,size.height*0.4281); [self addChild:manFrame1 z:30]; //         NSString* fullFileName = @"man1Anim.plist"; NSString* rootPath = [NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES) objectAtIndex:0]; NSString* plistPath = [rootPath stringByAppendingPathComponent:fullFileName]; if (![[NSFileManager defaultManager] fileExistsAtPath:plistPath]) { plistPath = [[NSBundle mainBundle] pathForResource:@"man1Anim" ofType:@"plist"]; } NSDictionary* animSettings = [NSDictionary dictionaryWithContentsOfFile:plistPath]; if (animSettings == nil){ NSLog(@"error reading plist"); } NSDictionary* animSettings2 = [animSettings objectForKey:@"man1Anim"]; float animationDelay = [[animSettings2 objectForKey:@"delay"] floatValue]; CCAnimation * animToReturn = [CCAnimation animation]; [animToReturn setDelay:animationDelay]; NSString* animationFramePrefix = [animSettings2 objectForKey:@"namePrefix"]; NSString* animationFrames = [animSettings2 objectForKey:@"animationFrames"]; NSArray* animFrameNumbers = [animationFrames componentsSeparatedByString:@","]; for (NSString* frameNumber in animFrameNumbers) { NSString* frameName = [NSString stringWithFormat:@"%@%@.png", animationFramePrefix, frameNumber]; [animToReturn addFrame:[[CCSpriteFrameCache sharedSpriteFrameCache] spriteFrameByName:frameName]]; } manCodding = [CCAnimate actionWithAnimation:animToReturn]; repeat = [CCRepeatForever actionWithAction:manCodding]; [manFrame1 runAction:repeat]; }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

その結果、360連続フレームから正しいアニメーションを取得します。 キャラクターがいかにかわいく足を引っ張るのかを見るのは、なんて楽しいことでしょう！







ゲームを作成し、「警告」をすべて削除した後、あらゆる種類のバグを修正するのに約1か月かかりました。 また、4台目のXcodeから6台目にプログラムを転送し、iPhoneデバイスでライブで実行するには、新しいMacやiPhoneを使用している人を追いかけなければなりませんでした。



不気味な黒い長方形なしでアプリケーションを4番目と6番目のiPhoneに等しく表示するには、壁紙も正しく構成する必要があります。 インターネットにはこの問題に対する多くの解決策があります（たとえば、記事http://www.raywenderlich.com/33525/how-to-build-a-monkey-jump-game-using-cocos2d-2-x-physicseditor-texturepacker-part- 1 ）しかし、それらはすべて不合理に複雑です。 サイズが1136x640の別の背景画像を作成し、メインのinitメソッドの最初に条件を書き込むだけで十分です。

 -(id) init { if( (self=[super init])) { size = [[CCDirector sharedDirector] winSize]; if (size.width > 500) { CCSprite* walls = [CCSprite spriteWithFile:@"walls.png"]; walls.position = ccp(size.width/2, size.height/2); walls.scale = 0.5; [self addChild:walls z:-10]; size.width = [CCDirector sharedDirector].winSize.width - 87; } … }
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

おわりに

メインゲームシーンのコードは1300行に収まります。 本格的な製品にはアーティストが必要なため、アプリケーションは1レベルのデモバージョンとして設計されています。ゲーム全体のほとんどが視覚効果に関連付けられています。



しかし、アプリケーションの設計上の欠陥にもかかわらず、私は最初に考えていたすべての機能を実装しました。 ゲームはハングせず、クラッシュしません。 そして、私は本当に新しい科学分野を研究することを楽しむことができました。 最初のプログラミング言語として、Objective-Cは非常に快適で直感的に正当化されたように思えました。



この記事が、初心者のプログラマーと、私のアイデアを数倍クールに開発できる経験豊富な達人の両方にとって、新しい考えと解決策につながることを願っています。



現在、アプリケーションはApple Storeでの公開を待っています。 テストに合格したら、コメント内のリンクをリセットします。 それまでの間、何が起こったかのビデオを見ることができます。