10日間でAndroidゲームネイティブ制作に挑戦(画像タッチ編)

 こんにちは。星野耀司です。

 さて前回は貝を配置することができました。なので今回は貝をタッチしたら別の場所にワープさせたいと思います。
UIが完成したら、これを利用してスコア等も作ろうと思います。
完全にアクションゲームではなくなりそうですね。

 私がまず最初に画像タッチを認識させる方法として考えたものは、座標を記録して、その座標をクリックしたら画像を移動させるということでした。

「画面上の座標が分かれば判定は簡単だ!」

そう思ったのですが…。
まずどれが画面上の座標なのかわかりませんでした。
xmlを見たらwidth、height、marginEnd、marginRight,_marginBottom等、様々なものがありました。
widthは横、height縦だとしても、他のものについてはまず文字がよく分からない上、調べても直接画像の座標を取得できそうなものではありませんでした。
widthやheightは、どこにいても数字が変わらなかったため、画像の大きさであることが分かりました。

 座標取得のために何か別の変数があるのか、それともさっきのEnd、Right、Bottomの中で計算しなければならないのか、など様々なことを調べてみました。
xやyで表現されているととても分かりやすかったのですがね…。
おそらくxmlに慣れている人はわかると思います。
しかしx、y とか座標とかどうでもよくなるとんでもなく便利な変数がありました。
setOnClickListener
View.OnClickListener()

いやunity等には同じようなのがありましたがまさかこっちにもこんなものがあるとは思いませんでした。しかもこれはImageView自体にクリックイベントリックイベントを追加するというものなのでした。
これのいいところは当たり判定などをあまり気にしなくてよくなるところです。
なぜなら画像自体につけているから。
凝った当たり判定を付けたいのなら話は別ですが、今の私にとっては十分なものでした。
1~2時間座標関連で調べ続けていた私の努力はどこへ。

ということで今回はクリックイベントを追加することに成功しました。
しかし、これができたからと言って簡単にもう終わりというものではありませんでした。
画像を画面内に移動させなければならないのです。
いやいや前回移動させる術は学んだじゃないですか。という人もいるかと思いますが思い出してみてください。
setXやsetYは現在の画像の位置に影響されて画像を移動させるのです。
画像は前調整した位置から動いていますし、動いた位置はランダムです。
要するに画面外に簡単に出ます。setX、Yでは制御不可です。
…完全に前回楽したツケが回ってきているような気がします。
というわけで今度は画面外に出ないように移動させる術を探してこようと思います。
それが見つかったら前回のところも修正しなければならないかもしれませんね。
見つかったら次回はそれを紹介しようと思います。
今回はいい感じの経験を身に着けることができたと思いますね。

ではまた次回

興味を持たれた方はお気軽にお問い合わせください。

Cocos2d-x 製作開始

こんにちは、インターン生の宮本です。

折り返しも過ぎてしまいましたが、やっと制作に入ることができました。

テーマは夏で、どんなかかわりでもいいから、何か夏に関係のあるものです。

私はこいこいを作ろうと思っています。

とりあえず、menuitemimageに対してもactionオブジェクトを適用できることを確認しました。

札の情報のみを持つクラスを作りました。
引数で番号を指定しその札の画像を返すメソッドなど入れておく予定です。

ビットマスクを使い成立している役を探し返すメソッドを作り。
マスクに使う情報を格納しようと静的な配列を作るときに詰まりました。

staticだけでは初期化ができず。
staticを付けなければクラス内のstatic関数で使用できないためです。

staticを付けてビルドした場合
non-const static data member must be initialized out of line
とエラーが出ます
goolgle翻訳によると
constでない静的データ変数はライン外で初期化する必要があるという意味です。

そこで、const staticで試してみると
クラス内で初期化するには ‘constexpr’指定子が必要
というようなエラーが出ました。

そこで、constexpr const static で試してみると。
linker command failed with exit code 1 (use -v to see invocation)
とでます
リンカが終了コード1で失敗しました
ということだそうです。

色々調べてみましたが解決策が全くわかりませんでした。
クラス内に含めることはあきらめ、クラス外に宣言することにしました。
気が付いたら2時間以上ここで詰まってしまっていたようで、他のことはあまりできていません。
この部分は、ゲームがプレイできるレベルまで完成して時間があったらリベンジしたいと思います。
次回は、ゲーム本体の処理を作りたいと思います。

興味を持たれた方はお気軽にお問い合わせください。

7日でゲームを作ろう!6

こんにちは、インターンシップ生の松本です。前回はステージ作りとプレイヤーのキャラクターに攻撃のアニメーションをつけることに成功しました。

今回はステージ作成の続きとクリア、ゲームオーバー、タイトルの画面を作っていこうと思います。そしていくつか断念してしまったことをお話ししようと思います。

最初にステージの続きをやっていきます。今回は最終目標として大きなスイカを置いていこうと思います。理想としては持っている武器を振り下ろすことでスイカが綺麗に割れるはずでしたが、調べた方法でやってもスイカが割れるようにならず、武器の攻撃判定もコリジョンが上手く働かず、結局最初の方式であったプレイヤーがただ触れたら爆発する方式に変更することになりました。時間があればもっと調べていろいろ試そうとも思えたのですが、もう残り今回と次回しかなくまだ作らなければならないものもあったので変更することにしました。

次は、各画面の作成です。このような画面のレイアウトを作るときはウィジットというものを作ります。今までのように下のコンテンツのところで右クリックし、一番下のユーザーインターフェースから、ウィジットブループリントを選びます。するとウィジットのエディット画面が開きます。真ん中に大きく出ている点線の四角いところがこのゲームの画面を表していて、この中で置いたところと比例するところに置いたものが表示されます。例えばTextというものを置き、右の詳細からTextの内容を変えるとその文字が実際に外面に表示されます。またButtonは文字通りボタンでクリックしたときなどに別の画面に移行したりするときに使います。

HPバーもこれで作ることができ、プレイヤーに設定したHPと合わせることでダメージを受けたときに連動してバーを減らすことができます。

例として、クリアのウィジットの画像とボタンで画面を移行するところのブループリントの画像を見せたいと思います。

上がまたこのゲームを最初からやり直すもので、下がタイトルに戻るものです。

このような感じで他の画面も作っていきます。

予定通りにちゃんとしたスイカ割りを作ることはできませんでしたが、次回でもう最後です。なんとか形にしようと思っているので良ければ次回も見てください。

次回は全体の動きの確認と、できれば今までできなかったことをもう一度調べて試してみたいと思っています。

興味を持たれた方はお気軽にお問い合わせください。

アプリの全体像変更(十五夜とKing Gnu少々)

こんにちは!

こんにちは!エム・ビー・エーインターナショナル株式会社インターン生の岡田優太です。

今回は3日目になります。昨日プログラミングが7割程度終わり、もうすぐ完成というところまで行ったんですが、途中で行き詰ってしまい、結局、見た目等色々と変えてしまいました。後、ブロックを全部崩した後、背景にRADWIMPSの画像を貼ろうとしましたが、著作権等が怖く、クリアした人に画面に出てくるURLを検索してもらい、私が作ったサイトに飛ぶように設定しているところです。

ですが、まったくわからなくて最終日までに終わるかわからないので、もしかしたらリンク貼って終わりになるかもしれません。その時は一応完成させたというところはくみ取っていただきたいと思います。

さて、アプリ制作の進捗状況は特に面白いものでもないので、9月について話していきたいと思います。

[月見は、主に旧暦8月15日から(午前零時を介して)16日の夜(八月十五夜)と、日本では旧暦9月13日から14日の夜(九月十三夜)にも行われる。そのため、月見に関する話題で単に「十五夜(じゅうごや)」、「十三夜(じゅうさんや)」という場合、これらの夜を意味する。中国や日本では、単に月を愛でる慣習であれば古くからあり、日本では縄文時代頃からあると言われる[1]。ただ、『竹取物語』には、月を眺めるかぐや姫を嫗が注意する場面があり、月見を忌む思想も同時にあったと推察される。](ウィキペディア引用)

とありますが9月は15夜じゃなくて13夜らしいですね。意外ですね。はい。

まあそんなことは置いておいて、今日はKing Gnuについて話していきたいと思います。King Gnuは2013年にリーダーの常田大希が立ち上げたプロジェクト、Mrs.Vinci(ミセス・ヴィンチ)、それを原型としたSrv.Vinci(サーヴァ・ヴィンチ)を前身とする。2017年にKing Gnuへ改名(ウィキペディア引用)したといわれています。ヴォーカルが二人いて、常田さんと井口さんの二人で歌っています。井口さんは芸人気質の方で、歌っているときは井口さんで普段は”井口”の愛称でファンの方から親しまれています。いっけんKing Gnuも9月と何もつながりがないように思えますが、実は1stアルバム「Mad me more softly」が9月リリースであの有名な1stシングルPrayer Xも9月に発売されたそうです!これはテーマである9月とばっちり合っていますね!それでは今日はこの辺で終わりにしたいと思います。

興味を持たれた方はお気軽にお問い合わせください。

オープンデータ活用サービス開発日誌~03~

 皆さんこんにちは、MBAインターナショナル インターン生の岩岬です。
インターン3日目ということで、テーマの決定と要件定義を目標に掲げて作業中です。

 さて、今回の作業中に気になったデータですが、AEDの設置場所のデータと、多目的トイレの設置場所のデータです。今回はAEDのデータと、多目的トイレのデータともに、世田谷区が公開しているオープンデータをダウンロードしました(本社ビルが世田谷区なので)。AEDのデータは、設置している施設名と、その施設の住所、郵便番号、地域区分、電話番号とAEDの利用可能時間がセットになったCSVデータです。多目的トイレのデータは、設置している施設の用途と名称および所在地のデータに加えて、車いすでの利用に対応しているか、オストメイトの方が利用できるか、ベビーベッド、ベビーシート、ベビーチェア、大人用ベッドがあるか、というデータがまとめられています。

 これらのデータをうまく使えば面白いことができそうですが、ただ位置をまとめるだけならば、類似のより良いサービスが既にありますので、今回はそのような先行事例を2件ご紹介します。

 まず1件目は、オストメイトなびというアプリケーションです。このアプリはNPO法人エムアクトさんが開発したものであり、機能の1つにオストメイト対応トイレの検索があります。オープンデータとして提供されたデータに加えて、ユーザーから提供されたデータも、他のユーザーに共有されるようです。

 次に2件目は、財団全国AEDマップというWEBサービスです。こちらは一般財団法人日本救急医療財団さんが公開しているサービスであり、AED設置場所がピンで配置されており、ピンを選択するとAEDの設置施設名や設置年月日とともに、そのAEDのパッドやバッテリの管理情報の有無や、設置からの年数をもとに情報の精度が出力されるというサービスです。

 所詮インターンの製作物と割り切ればそれまでですが、位置をまとめただけでは先行事例の劣化版になります。今後は可能な限りサービスの差別化に努め、制作できる範囲で新規性のある成果物を作ることを目標にしたいと思います。言葉だけは意識高いですが、正直あまり進んでいませんし、技術力も不十分です。今後の期間でどこまで伸ばせるか、数日後の自分に任せようと思います。それでいいのか。

興味を持たれた方はお気軽にお問い合わせください。

参考資料
総務省行政管理局 データカタログサイト
https://www.data.go.jp/ (2019/8/21 アクセス)

情報通信技術(IT)総合戦略室 オープンデータ100|政府CIO ポータル
https://cio.go.jp/opendata100 (2019/8/21 アクセス)

NPO法人エムアクト NPOエムアクト(オストメイトなびプロジェクト)
https://www.m-akt.jp/ (2019/8/21 アクセス)

一般財団法人日本救急医療財団 全国財団AEDマップ
https://www.qqzaidanmap.jp/ (2019/8/21 アクセス)

10日間でAndroidゲームネイティブ制作に挑戦(ランダム編)

 皆さんこんにちは。星野耀司です。

 今回は前回より進捗がありましたのでその報告とその中で使ったrandumというものについて話そうと思います。

 今回やったところは拾う貝を適当な場所に配置する作業になります。
前回も言った通り画面外に配置してワープをすることにしました。
どうやら配置のし直しはSetXやSetYを使うことでできるようです。
値に座標を入れればワープするのですが、どうやらこの関数は、ワープ前のものの位置に影響されるようなのです。
やってるときは気づくのが遅かったため、全部手作業でそれぞれ変えていきましたが、私のようにワープさせるときはすべてのものを同じ位置に最初に置いておくやり方をしたほうがいくつも別バージョンを作らずに済むでしょう。
またもや一日程度かけてしまいましたが、これで貝が配置できました。
初期位置が同じということはなく、変化するようにすることができました。

 さて、次にrandumの話ですが、これはjavaに元々用意されているものを使用しました。javaのrandumクラスの情報を他の変数に継承させ、それを乱数の発生装置にするというものでした。発生させる場合は

乱数を入れたい変数=random変数.next変数の型()

という記述方法を基本にすると発生させることができます。
ただし、これは完全な乱数というわけではないです。
プログラム内で乱数表というものを作り、そこからシード値というものを使って、数を引き出し始める場所を決めて引き出しているのです。
そのためシード値が変わっていないと複数の変数に乱数を発生させたとき、乱数のはずなのに同じ値が出てきてしまうということがあるので、シード値を変えることができるような工夫をしなければなりません。
どう工夫するかは私もわかっていない部分もあるので自分で調べてみてください。

 では今回はここまでにしたいと思います。
次回は貝をタップした際に、消える又は別の場所にまたワープさせるということができればいいなと思っています。
正直アクションにするのは厳しくなってきたためタップゲーに切り替えようと思っています。
敵キャラクターすら出せるか怪しいです。
とんでもないクソゲーが出来上がる気がしてきました。

また次回

(random等の説明に関しては正しいかどうかはわかりません。ここをきっかけに正しい情報を調べることをお勧めします)

興味を持たれた方はお気軽にお問い合わせください。

Cocos2d-x Scene Layer

こんにちは、インターン生の宮本です。

今回は、Sceneを練習するにあたって躓いたことを中心にお伝えしようと思います。

ファイルを作成してもプロジェクトへの追加は手動で行わなければならないようです。

Sceneを継承するHelloWorldのクラスを参考にSceneを継承するクラスを作成しましたが、スーパークラスのinit()の呼び出しなどができませんでした。

このように赤くなってしまします。

調べても原因がわからず、ソースファイルを一つにしてしまおうかと考え始めたころ、見つけることができました。

———————-
・ External Buld Files/Android.mk の LOCAL_SRC_FILES 部分を以下のように修正

LOCAL_SRC_FILES := $(LOCAL_PATH)/hellocpp/main.cpp \
$(wildcard $(LOCAL_PATH)/../../../Classes/*.cpp)]

————–引用:http://vivi.dyndns.org/blog/archives/1563

どうやらExternal BuildFiles /Android.mkのLOCAL_SRC_FILESにパスを追加すればいいようです。
早速Android.mkを探します。
見つかりました……大量に。

しかし、ExternalBuildFilesとパスに入っているものは見つかりません。
探し方を変えてみます。プロジェクトウィンドウのプルダウンをAndroidにするとありました。

ところが、あるのはCMakeLists.txtのみでAndroid.mkはありません。
このファイル名の前半部分、見たことがあります。Gradleが同期できないと悩んでいた時に”ビルドシステムがcmakeに変わった”と書いてあるのを見かけました。
もしや、と思いプロジェクトファイルのルートにあるものを開いて中身を確認してみると、HelloWorldクラスの書かれているソースファイルとヘッダファイルの記述がありました。これに倣ってファイルパスを追記し、同期したところ赤くなっていた文字が通常の色になりました。

やはりAndroid.mkはcmakeビルドではCMakeList.txtに変更されているようです。

また、後から気づいたことですが
”プロジェクトに追加されていない”とエディタ上部に表示されていました。

次回から本格的に制作に取り掛かることができそうです。

興味を持たれた方はお気軽にお問い合わせください。

7日でゲームを作ろう!5

こんにちは、インターンシップ生の松本です。前回は武器を振る動作とステージの作成をやりました。

今回も引き続きステージを作っていこうと思います。

テーマが夏ということで砂浜をイメージした地面と背景に海を作り、置きましたがまだ夏、という感じがあまり出てきていません。ですので今回はそういった夏を連想できるような物を置いていこうと思うので、置いたものの紹介とどのように使ったのかを今回は説明しようと思います。

まず海といえばカモメやウミネコなど鳥が意外と見られると思います。そこでEpicGames公式で無料で配布している”AnimalVarietyPack”を使っていきます。このアセットはカラスやシカ、トナカイ、キツネ、ブタ、オオカミといった動物のモデルが入っています。ここからカラスを使って海で飛ぶ鳥を表現していこうと思います。カラスを使ってウミネコやカモメと言い張るのはなかなか難しいですがあまり近いところに配置せず、距離を離すことで何とかしようと思います…..

動かし方は障害物やプレイヤーを動かしたときと同じ方法です。一定の間隔で現れるように障害物を生成したときを参考にして、設定していきます。

さらにもっと夏、そしてこのゲームのメインでもあるスイカを印象的になるように障害物を火をまとったスイカにします。火のマテリアルは、こちらもEpicGames公式にあるFXVarietyPackのものを使いました。

あとは左右の移動制限として、通り過ぎたらゲームオーバーにするフェンスのようなものを設置し、さらにゴールのスイカの前に過ぎれば障害物の生成が止められるようなアクタも設置しました。

最後に、前回武器を振るアニメーションが無く攻撃の動作ができないという話をしましたが、今回何とか使うことのできそうなアニメーションを見つけることができ、Zキーの長押しでアニメーションをするように設定できました。

こちらがプレイヤー側のブループリントで、

こちらがアニメーションブループリントの画像です。

今回はステージにさまざまな要素を増やすことができましたが、GameOver画面やクリア画面、タイトル画面が仮のものしかできなかったので次回はその三つを完成させるのとプレイヤーの攻撃の当たり判定を作っていこうと思います。

興味を持たれた方はお気軽にお問い合わせください

アプリの内容調整(THE ORAL CIGARETTES少々)

こんにちは!エム・ビー・エーインターナショナル株式会社インターン生の岡田優太です。

今回は2日目になります。昨日はアプリの内容と構成が決まったので、本日はアプリのプログラムを書いていこうと思います。HTMLとCSSでアプリの全体像を決めて、JavaScriptで動的に動かしてしっかりと遊べるアプリにしていきたいと思います。

 

<!DOCTYPE html>
<html>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=300,user-scalable=no”>
<title>ブロック崩し</title>
<script type=”text/javascript” src=”breakout.js”></script>
</head>
<body>
<canvas id=”sample” width=”640″ height=”480″></canvas>
<button onclick=”main()”>押してみよ</button>
</body>
</html>

サンプルコードを少し改変させたコードです。これだけでサイトに表示させることができます。このコードとJavaScriptを組み合わせることで一応アプリの完成です。ですが皆さん、こんなものはコピペすれば誰でもできますよね。私は個性的な成果物をつくりたい!そう思いました。そこで、

とりあえず色だけ変えて十五夜カラーを演出しました。ちなみにブロックが餅でボールが月を表しています。わかりにくいとかそういった批判は後でにしてくださいね。そんなこんなでHTMLはだいたい完成して、JavaScriptを試行錯誤中です!

ところで今日はRADWIMPSの話はないのかと思いませんか?本日は THE ORAL CIGARETTESのライブについてお話します。(以下オーラル)オーラルのライブ(PARASITE DEJAVU)が9/14,9/15にあります。これは待ち遠しいですね。

オーラルは9月に半年に渡りアリーナ4公演含む全国ワンマンツアー「Kisses and Kills Tour 2018-2019」も開催しており、なにか由来があるのかもしれませんね。信じるか信じないかはあなた次第です。まあ、私はまだオーラルのライブ行ったことないんですけどね。誰か一緒に行きましょう。お願い致します。

興味を持たれた方はお気軽にお問い合わせください。

オープンデータ活用サービス開発日誌~02~

 皆さんこんにちは、MBAインターナショナル インターン生の岩岬です。早いものでインターン二日目です。進捗に不安はありつつも、ゆるりと作業中な現状です。

 さて、前回の記事ではデータカタログサイトについてご紹介しましたが、今回は、内閣官房のIT総合戦略室がまとめたオープンデータ活用事例集、オープンデータ100より、気になった事例を2件ピックアップしてご紹介します。

 一件目は、5374.jpというアプリケーションです。こちらのアプリは、一般財団法人コード・フォー・カナザワ(Code for Kanazawa)さんが制作した、地域別のごみ収集日と、分別を表示するアプリです。このアプリは、「あと何日で燃えるゴミの日?」や「ビニール袋って燃えるゴミ?」といった疑問を解決できます。この5374.jp、元々は金沢市でのデータを表示するアプリですが、オープンソースであるため有志が様々な地域向けの5374.jpを作成しています。あなたの町向けの5374.jpがあるかもしれないし、なかったらあなたが作ることもできます。

 二件目はWheeLog!というアプリケーションです。こちらは一般社団法人WheeLogさんが運営しているアプリであり、車いすユーザーが移動したルートをGPSを用いて記録し、車いすで通行できる道のデータを収集して共有するという機能があります。この機能に加えて、都立公園などにあるエレベーターや多目的トイレの情報を提供していますが、こちらがオープンデータを活用している部分です。このアプリの面白さは、対象や目的が明確であることに加えて、このアプリがデータを蓄積しながら利用している点にあると思います。

 先行事例のご紹介が済んだところで、今日の進捗報告です。今日は制作するサービスの方向性を決めるために、先行事例や利用可能なデータの調査にあたりました。ダウンロードしたデータは、例えば日本の人口推移やレッドリスト、都道府県別の図書館数などありましたが、これらはまだ、利用したシステム案が思い浮かんでいません。個人的に気になっているのが、歩行空間ネットワークのデータです。これは日本各地の歩行者用通路をノードとリンクで構成されたグラフとして表現したデータです。加えて、スロープやエレベーターの有無がデータになっているため、うまく読み解ければ何か面白いことができるんじゃないかといったところで、本日の進捗はこれまで。

興味を持たれた方はお気軽にお問い合わせください。

参考資料

総務省行政管理局 データカタログサイト
https://www.data.go.jp/ (2019/8/21 アクセス)

情報通信技術(IT)総合戦略室 オープンデータ100|政府CIO ポータル
https://cio.go.jp/opendata100 (2019/8/21 アクセス)

一般財団法人Code for Kanazawa 5374 Official Website
http://5374.jp/ (2019/8/21 アクセス)

NPO法人PADM NPO法人PADM -遠位型ミオパチー患者会-
https://npopadm.com/ (2019/8/21 アクセス)

一般社団法人WheeLog アプリ – WheeLog!
https://www.wheelog.com/hp/app (2019/8/21 アクセス)