<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>cocos2d-x | ユガラボ</title>
	<atom:link href="https://yugalab.net/archives/tag/4005_cocos2d-x/feed" rel="self" type="application/rss+xml" />
	<link>https://yugalab.net</link>
	<description>pursue the beauty with yuga lab.</description>
	<lastBuildDate>Tue, 27 Jan 2015 06:06:22 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=5.7.7</generator>
	<item>
		<title>cocos2d-xの環境構築をしたら次は何をすればよいのか</title>
		<link>https://yugalab.net/archives/872</link>
					<comments>https://yugalab.net/archives/872#respond</comments>
		
		<dc:creator><![CDATA[ユーリ]]></dc:creator>
		<pubDate>Tue, 27 Jan 2015 04:00:47 +0000</pubDate>
				<category><![CDATA[cocos2d-x]]></category>
		<category><![CDATA[technical]]></category>
		<category><![CDATA[xcode]]></category>
		<guid isPermaLink="false">http://yugalab.net/?p=872</guid>

					<description><![CDATA[<p>こんにちは、ユーリです！最近、次のスマホゲームを作成するべく、cocos2d-xでの開発をはじめました！※cocos2d-xとは、iphoneとAndroid、両方のプラットフォームで2dゲーム開発ができるフレームワーク [&#8230;]</p>
<p>The post <a href="https://yugalab.net/archives/872">cocos2d-xの環境構築をしたら次は何をすればよいのか</a> first appeared on <a href="https://yugalab.net">ユガラボ</a>.</p>]]></description>
										<content:encoded><![CDATA[こんにちは、ユーリです！<br />最近、次のスマホゲームを作成するべく、cocos2d-xでの開発をはじめました！<br /><br /><span class="l_red f080 lh_default">※cocos2d-xとは、iphoneとAndroid、両方のプラットフォームで2dゲーム開発ができるフレームワークです。<br />この記事は、ある程度プログラムへの知識がある方へ向けて書いています。</span><br />

<div class="fold_post"><br />環境構築については、うまくまとめていらっしゃるサイト様がたくさんありますので、この場では省きます！<br />ですが、環境構築をして、テストプロジェクトを作り、サンプルの動作を確認、まで行ったら…次になにをしたらいいか、パッと見つからなかったため、私なりにまとめてみました。<br /><span class="l_red f080 lh_default">※実行環境<br />mac OS X ver 10.9.5<br />cocos2d-x ver 3.3<br />Xcode ver 6.1.1</span><br /><br /><h3 class="section_title putit_caption l_green">メインシーン用クラスを作る</h3><br />ひとまずHelloWorldの次のステップとして、オリジナルの画面をつくることですね。<br />デフォで存在している「Classes」フォルダの中にオリジナルシーン用のクラスを作成します。<br /><a href="https://yugalab.net/wp-content/uploads/2015/01/20150127_1.jpg"><img loading="lazy" class="alignnone size-full wp-image-896" src="https://yugalab.net/wp-content/uploads/2015/01/20150127_1.jpg" alt="20150127_1" width="500" height="252" srcset="https://yugalab.net/wp-content/uploads/2015/01/20150127_1.jpg 500w, https://yugalab.net/wp-content/uploads/2015/01/20150127_1-300x151.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" /></a><br />New File&#8230;でファイル作成。<br /><br /><a href="https://yugalab.net/wp-content/uploads/2015/01/20150127_2.jpg"><img loading="lazy" class="alignnone size-full wp-image-897" src="https://yugalab.net/wp-content/uploads/2015/01/20150127_2.jpg" alt="20150127_2" width="500" height="293" srcset="https://yugalab.net/wp-content/uploads/2015/01/20150127_2.jpg 500w, https://yugalab.net/wp-content/uploads/2015/01/20150127_2-300x175.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" /></a><br />C++ Fileを選びます。<br /><br /><a href="https://yugalab.net/wp-content/uploads/2015/01/20150127_3.jpg"><img loading="lazy" class="alignnone size-full wp-image-898" src="https://yugalab.net/wp-content/uploads/2015/01/20150127_3.jpg" alt="20150127_3" width="500" height="294" srcset="https://yugalab.net/wp-content/uploads/2015/01/20150127_3.jpg 500w, https://yugalab.net/wp-content/uploads/2015/01/20150127_3-300x176.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" /></a><br />クラス名を決めます。何でもいいんですが、MainSceneにしました。<br /><br /><a href="https://yugalab.net/wp-content/uploads/2015/01/20150127_4.jpg"><img loading="lazy" class="alignnone size-full wp-image-899" src="https://yugalab.net/wp-content/uploads/2015/01/20150127_4.jpg" alt="20150127_4" width="500" height="223" srcset="https://yugalab.net/wp-content/uploads/2015/01/20150127_4.jpg 500w, https://yugalab.net/wp-content/uploads/2015/01/20150127_4-300x133.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" /></a><br />決定すると、<br /><span class="l_red">MainScene.cpp</span>　と<br /><span class="l_red">MainScene.h</span>　の二つのファイルが作成されます。<br />ソースファイルはこのようにシーンごとに作成します。<br /><br />
<p><h3 class="section_title putit_caption l_green">Sceneの骨組みと、入力に反応するメソッドを作る</h3><br />次に、シーンを制御するコンストラクタとデストラクタ、<br />そして入力に反応するイベントリスナーを実装します。<br />まずはヘッダファイルから。</p>
<pre class="brush:cpp" title="MainScene.h">//
//  MainScene.h
//  testproject
//
//  Created by yuri on 2015/01/26.
//
//

#ifndef __testproject__MainScene__
#define __testproject__MainScene__

#include "cocos2d.h"

class MainScene :public cocos2d::Layer
{
protected:
    MainScene();            //コンストラクタ
    virtual ~MainScene();   //デストラクタ
    bool init() override;   //初期化処理

public:
    static cocos2d:: Scene* createScene();
    CREATE_FUNC(MainScene);                 //createメソッドを作成
    CC_SYNTHESIZE_RETAIN(cocos2d::Sprite *, _cursor,Cursor);    //_cursor変数を作成し、ゲッターとセッターを実装する
};

#endif /* defined(__testproject__MainScene__) */</pre>
<p>まずは必要最低限の実装です。<br /> シーンクラスは、<span class="l_blue">Scene</span>ではなく<span class="l_blue">Layerを</span>継承して作成します。 <span class="l_blue">CREATE_FUNC(MainScene);</span> はマクロで、create();関数の生成を行います。<br /> <span class="l_blue">CC_SYNTHESIZE_RETAIN(cocos2d::Sprite *, _cursor,Cursor);</span> では、入力に反応して動くカーソル用のスプライトを生成します。<br /> <br /> 続いて、ソースファイルです。</p>
<pre class="brush:cpp" title="MainScene.cpp">//
//  MainScene.cpp
//  testproject
//
//  Created by yuri on 2015/01/26.
//
//

#include "MainScene.h"

USING_NS_CC;

MainScene::MainScene()
: _cursor(NULL) //コンスタラクタ内での初期化
{

}

MainScene::~MainScene()
{
    CC_SAFE_RELEASE_NULL(_cursor);  //オブジェクトをリリースする
}

Scene* MainScene::createScene()
{
    auto scene = Scene::create();
    auto layer = MainScene::create();
    scene -&gt; addChild(layer);
    return scene;
}

bool MainScene::init()
{
    if(!Layer::init()){
        return false;
    }
    auto director = Director::getInstance();    //Directorを取り出す

    //初期化を行う
    this -&gt; setCursor(Sprite::create("CloseSelected.png")); //指定画像をリソースにスプライトを生成
    _cursor -&gt; setPosition(Vec2(100,100));                  //位置の定義
    this -&gt; addChild(_cursor);                              //生成したスプライトをシーンに追加

    //タッチ操作の動作定義
    auto listner = EventListenerTouchOneByOne::create();    //一点タッチされたときのイベント定義
    listner -&gt; onTouchBegan = [this](Touch* touch,Event* event){
        //タッチされたときの処理(この定義は必須である)
        auto touchPosition = touch -&gt; getLocation(); //タッチした位置を取得
        _cursor -&gt; setPosition(touchPosition);    //カーソルの座標にタッチ座標を格納
        log("タッチ位置 : %f , %f" , touchPosition.x , touchPosition.y );
        return true;
    };
    listner -&gt; onTouchMoved = [this](Touch* touch,Event* event){
        //タッチしたあと移動した場合
        auto touchPosition = touch -&gt; getLocation(); //タッチした位置を取得
        _cursor -&gt; setPosition(touchPosition);    //カーソルの座標にタッチ座標を格納
    };
    director-&gt;getEventDispatcher()-&gt;addEventListenerWithSceneGraphPriority(listner, this);  //作成したイベントを画面にひもづける

    return true;
}</pre>
<p>カーソル用の画像は、今回はデフォルトでリソースに入っているボタン画像を使っちゃいました。<br /><a href="https://yugalab.net/wp-content/uploads/2015/01/20150127_5.jpg"><img loading="lazy" class="alignnone size-full wp-image-905" src="https://yugalab.net/wp-content/uploads/2015/01/20150127_5.jpg" alt="20150127_5" width="500" height="238" srcset="https://yugalab.net/wp-content/uploads/2015/01/20150127_5.jpg 500w, https://yugalab.net/wp-content/uploads/2015/01/20150127_5-300x142.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" /><br /></a>お好みのものを使いたい場合、Resourcesフォルダ内に画像を追加する必要があります。<br /><br />今回は初期化用の関数 <span class="l_blue">init()</span>と、<span class="l_blue">Director</span>というクラスがポイントになります。<br /><span class="l_blue">init()</span>内では、リソース内の画像ファイルからスプライトの生成、タッチした時の挙動をイベントリスナーに登録。という二つの動作を実装しています。<br /><span class="l_blue">Director</span>はゲーム全体を管理するクラスで、画面サイズや端末情報を得る際に使用します。<br />今回はこのDirectorクラスを通じて、画面にイベントリスナーを追加しています。<br /> その他の部分はだいたいおまじないです。<br /> <br /> あとは、AppDelegate.cpp内のHelloWorldの部分をMainSceneに置き換えれば完成です。</p>
<pre class="brush:cpp highlight:[2,3]" title="MainScene.cpp">#include "AppDelegate.h"
//#include "HelloWorldScene.h"
#include "MainScene.h"</pre>
<pre class="brush:cpp first-line:38 highlight:[42,43]" title="MainScene.cpp">    // set FPS. the default value is 1.0/60 if you don't call this
    director-&gt;setAnimationInterval(1.0 / 60);

    // create a scene. it's an autorelease object
    //auto scene = HelloWorld::createScene();
    auto scene = MainScene::createScene();</pre>
<p>背景は真っ暗ですが、タッチするとタッチした位置にカーソルがついてくる画面が完成しました！<br /><a href="https://yugalab.net/wp-content/uploads/2015/01/20150127_6.jpg"><img loading="lazy" class="alignnone size-full wp-image-911" src="https://yugalab.net/wp-content/uploads/2015/01/20150127_6.jpg" alt="20150127_6" width="500" height="297" srcset="https://yugalab.net/wp-content/uploads/2015/01/20150127_6.jpg 500w, https://yugalab.net/wp-content/uploads/2015/01/20150127_6-300x178.jpg 300w" sizes="(max-width: 500px) 100vw, 500px" /></a><br /><br /> 今日はここまでに致します…。</p>
</div><p>The post <a href="https://yugalab.net/archives/872">cocos2d-xの環境構築をしたら次は何をすればよいのか</a> first appeared on <a href="https://yugalab.net">ユガラボ</a>.</p>]]></content:encoded>
					
					<wfw:commentRss>https://yugalab.net/archives/872/feed</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
