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

 皆さんこんにちは、MBAインターナショナル インターン生の岩岬です。ついにこれが最後となりました。第10回の今回は、最終的にどんな機能ができたのかをご紹介しようと思います。

 以前の記事でも触れましたが、私はこの10日間のインターンで、オープンデータを活用したWebサービスを開発していました。HTMLなんぞ触ったことがないも同然、JavaScriptに至っては本当に触ったことがないという状態での開発でしたが、最終的に一応動くものができたということに一安心しています。最終的に出来上がったのは、「だれでもトイレ検索」なるWebサービスです。「だれでも|トイレ検索」ではなく、「だれでもトイレ|検索」です。「だれでもトイレ」というものは、多目的トイレや多機能トイレのようなもので、いろいろな方にとって使いやすいことを目指したトイレというもののようです。今回これを、東京都オープンデータカタログサイト上に公開されているオープンデータをもとに、都内の駅、都立もしくは区市町村立施設に設置された、だれでもトイレを検索できるサービスを開発しました。
 具体的には、車いす対応、オストメイト対応、対応性別(共用、男性用、女性用)という条件によるフィルタリングをしつつ、施設名や駅名、所在地についてフリーワード検索ができます。マッチしたデータは、施設・駅名を見出しとして一覧表示されます。見出しをクリックまたはタップすると、より詳細なデータが表として確認できます。

 さて、ここまでは完成したものについて、大まかに説明しました。ここからは今回で達成したことに触れていきます。
 今回の成果は、データ表示方法の改善、駅のデータへの対応、動作検証の三つです。表示の改善については、データがない項目を表示しないようにしたことと、データを複数行の表にまとめたことで行いました。前者については、ビル名や特定期間の利用可能時間などは空欄の場合が多かったので、表示前にデータがあるか確認して、空欄なら項目を削るという処理をしました。後者については、5項目ごとに改行する処理を実装しました。これについては、コーディングの計画性が低かったせいで処理の把握に手間取った、というのが時間のかかった理由でしょうか。反省したいところです。駅データは、検索ボタンを分離して処理を別記して対応しました。動作検証はレンタルサーバーを借りて行いました。ひとまず動いたので良かったです。

 終わってみると、成果に納得できていない部分もあります。このインターンで出来なかったことは、今後の課題と考えたいと思います。

 これで、全10回のインターン開発日誌は終わりです。記事を読んで下さった方や、インターン中にお世話になった方々にお礼申し上げます。

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

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

 皆さんこんにちは、MBAインターナショナル インターン生の岩岬です。インターン中の作業も残り1回となった第9回です。今回も進捗を書いていきます。

 前回の時点では、アコーディオンメニューが実装できました。ただし、メニュー内の表示は平文そのままで、整っているとは言えませんでした。
 今回の時点で達成できたことは、各データの表示をスクロール可能な表の形式にまとめたことと、CSVデータを整えたこと、そして、住所のデータからハイパーリンクを動的に作成したことです。システムのつくりは拙いですが、一応Webサービスとして動きはするレベルに持って行けそうです。達成できたこと、次回で達成したいことをまとめて今日の日誌とします。

 さて、今回の成果についてですが、第一にデータを表にしたことです。これまではCSVファイルから引っ張ってきた文をほぼそのまま表示していましたが、今回の時点で表の形に落とし込むことができました。とはいえデータはすべて一行に並んでいるため、表とは呼び難いし、それほど見やすくもなっていません。最低限データを見ることができるように、画面からはみ出た分のデータを、スクロールして表示する機能は付けましたが、次回のうちに改良する必要があるでしょう。
 第二に、CSVファイルの編集です。重要性が低いデータを削除したことに加えて、項目名を短く変更したことが編集内容です。例を挙げると、もともとは「トイレへの誘導路として点字ブロックを敷設している」という項目名が付けられていたのに対して、今回の編集で項目名を「点字ブロック」に変えました。これによって、表示するデータをなるべく短くして見やすさを確保することが目的です。CSVファイルの編集については、今回の時点で完了したと考えています。これについては次回に取り掛かるべき部分はないでしょう。
 そして第三に、住所のデータからハイパーリンクを動的に作成したことです。住所の項目をクリックすると、その場所をGoogleMapで表示する機能を今回実装しました。これについては数回前から実装したいと考えていましたが方法がわからなかった部分です。実装方法はかなり単純で、googlemapのurlに住所のデータを付け加えた文字列を、htmlタグで無理やり囲ってリンクにしました。正直キレイな実装ではありませんが、やりたい事はなんとか実現できたかというところです。同じく今回の時点で完了したと考えています。

 さて、以上が今回達成できたことですが、次回が最後だというのに、次回実現したい機能はまだまだあります。こちらに触れて日誌を終わりにしたいと思います。
 まず、最優先で行いたいのは、データの表示方法の改善です。現状だと、ひたすら横に長いデータをスクロールして閲覧する必要があります。前半のデータと後半のデータを同時に確認することすら難しい有様なので、なんとか頑張って行きたいところです。表を分割するか、複数行に表示するかといったところでしょうか。
 次に、スマートフォンでの表示にも耐えうる表示を行うことです。画面表示するデータのサイズが固定だと、スマートフォン表示すると過剰にズームしたような形になってしまいますので、これの対策をしようということです。こちらについては、今回の時点である程度試しましたが、思うようにいっていません。情報を調べて、ちゃんと実装したいところです。
 最後に、サーバーに移し替えての動作検証です。はい、今の今までローカルファイル上でしか動作検証していません。そのせいもあって、Chromeはセキュリティの都合で一度も動作検証していません。レンタルサーバーを借りて動作検証をしたいところです。

 さて、今回は9回目、何度も言及しましたが次回で最後です。しかしながら、ご覧のあり様、まだまだ問題だらけです。次回のあいだにどれだけ達成できるか、せめて動作確認ぐらいはしたいといったところで、今回の日誌を締めくくります。

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

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

 皆さんこんにちは、MBAインターナショナル インターン生の岩岬です。今回で8回目です。苦戦続きで疲れました。

 前回はアコーディオンを付ける実装は「時間かかったら恥さらし」とか嘯いて余裕でしたが、翻って今回はそれだけで一日かかりました。今回は時間が掛かった言い訳がテーマです。

 アコーディオンメニューを作ってみるところまでは、インターネットを頼ってですが、前回の時点で何とかなっていましたが、その時はjavascriptで書いていたため、これまでに作っていたプログラムとの兼ね合いが問題でした。
 具体的に言うと、その時のアコーディオンメニューはhtml起動時に存在しているp要素を参照して、メニューを作成していました。対して私が作っていたプログラムは、検索がなされたときに、html内に要素を追加していました。メニュー作成には起動時に要素があるべき、しかし、要素は起動時にはない。何とか起動時に要素がなくても動くようにしようと躍起になりましたが、うまくいきませんでした。こうして書きながら振り返ると、根本からしてサーバーサイドが作れないせいで、ページ読み込み時に要素が揃ってないとかいう奇怪なアプリを作っているのが全部悪い気がしてきました。
 とはいえ一朝一夕でサーバー完全理解出来たら苦労しないわけで、今回はCSSで実装できるアコーディオンメニューを作る方法をネットで見つけてきて、そちらを参考に実装しました。こちらの実装にあたってlabelのfor属性とか、divやpのid属性を動的にいじくる必要が出てきたのですが、こちらの方法に関してもネットで見つけたものを参考にしました。今回色々参考にした部分が多いので、まとめてご紹介させていただきます(一人じゃ何にもできないんです、ゆるして)。

以下 参考資料
 ジャングルオーシャン 【コピペOK】jQueryのアコーディオンメニュー実装サンプル10選!
 https://www.jungleocean.com/programming/180618jquery-accordion(8/29 アクセス)

 サルワカ CSSだけでアコーディオンを作る方法(レスポンシブ&矢印付)
 https://saruwakakun.com/html-css/reference/accordion(8/29 アクセス)

 COOL PROGRAMMING [jQuery]HTMLタグのidを動的に生成(or変更)する方法
 https://dive-into-programming.blogspot.com/2011/04/jqueryhtmlidor.html(8/29 アクセス)
参考資料ここまで。

コピペさせていただいたり、参考にさせていただいたり、本当にありがたい限りです。次々回が最終回、完成に向けてしっかり進めていきたいところです。

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

10日間でAndroidゲームネイティブ制作に挑戦(まとめ編)

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

 今回が最後の記事になります。ここまで読んでくださった皆様に感謝します。
今回は作ったゲームややったことの振り返り、まとめを行っていこうと思います。

 まず最初にAndroidのネイティブ開発をすることになったときは何をしていいか分かりませんでした。
そのため、何を使えば開発ができるかを調べ、AndroidStudioというものにたどり着きました。
使い方にはとても四苦八苦した覚えがあります。

 最初の方はとりあえず見つけたことをやってみようの感覚でやっていた気がします。アクションバーの削除などが良い例ですね。
Layoutも使わずにxmlを使っていたりととてもおかしなことをしていました。
ボタンがうまく配置できない、配置できてるように見えてErrorが出ているなんでだろうとなっていき、結局designからtextに記述方法を乗り換えた結果様々なことを理解することができました。

 調べ方が下手なのか、やりたいことをいくら調べても出てこず代替の方法でやっていったこともありました。
貝の配置の時ですね。画像のスポーン方法が分からず、画面外において、そこからワープさせました。
結果的にこの考え方は他の事をやるときにも役に立ちました。臨機応変に対応できるようにすることが大切なのかもしれません。

 様々な過程を経てできたゲームですが、構想編で考えていたものよりも大きくスケールダウンする結果になりました。
流石に何もわからない状況から構想通りのものにすることは無理でしたね。
まずアクションゲームの予定だったのがタップゲームになり、敵なんて一切登場しない移動していく貝を制限時間内でなるべく多くタップせよというものになりました。
本来であれば偽物の貝などを登場させることができればよかったのですが、全く同じの色違いの素材がなく、色を付ける時間もなかったため断念しました。
実装できなかった機能があるのは残念ですが、今回のゲーム制作で知識をたくさん得られたのはとても良いことだと思います。
UnityやUnreal Engine以外でのゲーム開発経験がなかった私にとって、今回の体験はとても貴重なものでした。今後も様々な環境や状況で開発をしてみたいと思いました。

 ではそろそろ終わりにしようと思います。
今回でお別れとなりますが、またいつかどこかで出会えたら嬉しいですね。

 それでは今までありがとうございました。

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

cocos2d-x(終) 逆イテレーター

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

いよいよ今回で最後です。

突然ですが、今までエミュレータを使用して開発していました。

今回になって初めて自分のデバイスにつないで実行しましたが、解像度の差のためか遊べないほどではありませんがレイアウトが崩れていました。思えば、画像のサイズでレイアウトしていました。対応している時間がないため、エミュレータのままで進めます。

見栄えが非常に悪いですが、遊べるようにはなりました。

調整をする時間がありませんでしたが。一応完成させることができ良かったです。

相手の操作を実装するときに逆イテレータで苦労したため、
今回は逆イテレータについて、少しまとめようと思います。

まず最初に、イテレータとはポインタのようなもので主にコンテナに対して使います。

逆イテレータとは、名前からも想像がつきそうですが、後ろから初めに向かって進むイテレータです。

逆イテレータのbase()メソッドで同じ要素を参照しようとするときは、一つ前にずらす必要があります。

逆イテレータは基本的には、イテレータと同様に使用できますが、erase()などvectorの一部のメソッドは逆イテレータを引数にすることができません。リファレンスを参照すると逆イテレータには、元となったイテレータを返すメソッドがあります。

早速これを使用し、erase()を使いますが。少しずれた要素が削除されてしまいました。
試行錯誤して、base()-1でerase()を使用したところ。目的の要素を削除することができました。

逆イテレータを使用しているとき、同じ要素を指すイテレータはbase()-1でd求められるようです。

参考:https://qiita.com/hotwatermorning/items/ec44d295798f67a1b135

時間に余裕がなく読み込んでいないので詳しくはわかりませんが、
どうやら配列の[-1]を参照しないためにこのようなことになっているようです。

思えば、全然ゲーム制作のことを書いていない気がしますが、最後までお付き合いありがとうございました。

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

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

 皆さんこんにちは、MBAインターナショナル インターン生の岩岬です。
 7回目ということで、そろそろ残り日数も気にしなければならない所まで来ました。今回も引き続きUI面の改善といったところですが、やや足踏み気味な現状です。
 さて、前回はデータを表にして出力する機能や、フィルタリング機能が実装できました。フィルタリング機能の出来はさておくとして、問題はデータの出力です。表にしたとはいえ、依然見づらいです。着地点を見据えて進めなければならない中、肝となるのはUIをどこまで改善できるかという点だと考えています。
 その中で今回は、現状の問題点を分析し、完成図のペーパープロトタイピングを行ったことが主な進捗です。付け加えると、jQueryを触ってみたことと、住所による検索を実装したことも今日の成果です。完成品のコーディングは一つも進んでいないという所に不安はありますが、焦ってコーディングを始めても仕方がないと己に言い聞かせています。まずは要件定義と完成図から取り掛からねば。ただ白状しておくと、jQuery初めて触った上にサーバーサイド全然わかんない人なので、そこらへん頑張らないと酷い結末を迎えそうだということについては、不安を払拭しきれません。正直インターンにして初のWebサービス開発みたいなものなので、サーバーサイドは最悪しょうがないかなぁと逃げ道を作っておこうと思います。
 今回、自分のプロトタイプを眺めて感じたのは、データを一括で表示することが間違っているのだろうという点です。そのため、完成版では一覧表示するのは施設名と住所に限り、そこから何らかの方法で詳細を表示したいところです。目下検討中なのはアコーディオンメニューにすることです。そんなに時間はかからないはず、というより余りに手こずると恥を晒すことになるので、早々に完成させたいところ。
 このような形で次回の己にプレッシャーをかけつつ、目指すところは納得できる成果物を提出してインターンを終わることです。

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

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

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

 前回はゲームの大筋ができたので、今回は手直しをしていく中で便利だったものを紹介していこうと思います。

 まずは

ScrollView

これは画面をスクロールできるように設定するものです。
さあ、画面がスクロールできるようにするためにはどうすればよいでしょうか。
実はこれでスクロールできるようにさせたいところを挟むだけです。
ゲームの遊び方のレイアウトを記述しているとき、textで打ってプレビューで見るというレイアウトの確認方法をしていたのですが、いざエミュレーターで実行してみたら見切れている!という事態が発生したことがありました。
時間がないから文字を小さくするかと思ったところ、これを見つけたのですぐさまスクロールを実装できるようになりました。
それにしても本当にdesignのプレビューが役に立ってくれませんね。何か条件でも必要なのでしょうか?
さあ次です

 次です

android:scaleType=”fitXY”

これは画像を拡大させたいときに使うものです。背景を拡大するときに大変お世話になりました。
これ系統のものは他にもいろいろ種類があるようです。

引用URL
https://akira-watson.com/android/imageview_scaletype.html

引用始め
CENTER
Viewの中央に表示、拡大縮小無し
android:scaleType=”center”
CENTER_CROP
View内で画像の縦横比を維持し、Cropして中央に配置
android:scaleType=”centerCrop”
CENTER_INSIDE
View内で画像の縦横比を維持し画像すべてをView内の中央に配置
android:scaleType=”centerInside”
FIT_CENTER
View内で画像の縦横比を維持し中央に配置
android:scaleType=”fitCenter”
FIT_END
View内で画像の縦横比を維持し、右下に寄せて配置
android:scaleType=”fitEnd”
FIT_START
View内で画像の縦横比を維持し、左上に寄せて配置
android:scaleType=”fitStart”
FIT_XY
View内で縦横を独立してリサイズし、フル画面にする
android:scaleType=”fitXY”
MATRIX
Image Matrix を使うときに使用する
android:scaleType=”matrix”
引用終わり

これだけの画像操作がコマンド一つでできるというのはとてもすごいですね。
ゲーム制作で画像に扱いに悩んだらこのコマンドたちを使ってみましょう。

今回はゲーム制作時に便利だったものを紹介していきました。
この記事、次回で最後となります。作ったゲームを簡単ではありますが紹介したりしていこうと思いますので最後までよろしくお願い致します。

それではまた次回

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

cocos2d-x

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

今回は、とった札を整理して表示する関数と、役ができたときに中断する処理を作成しました。
また、アドバイスをいただき、山札から引いたときと手札から1枚選択した時に、合う札が場に1枚しかないとき、自動でその札を取るようにしました。

制作中に同じ処理を複数回使いそうだったため関数化し、進めていったところ。関数化したところでエラーが発生しました。
no matching function for call to ‘create’

と出ています。

全く同じ文を他でも使っているため、引数に間違いはありません。

自力でいろいろ試しても、一向に解決する気配がなく、
ブラウザで検索したところ似たような事例を見つけました。
https://discuss.cocos2d-x.org/t/ccsequence-no-matching-function-for-call-create/7683/4

こちらのサイトを参考にし色々試しましたが、解決しませんでした。
他の箇所では何の問題もなく動作していたため、最後の手段として関数化したものを呼び出しているところに展開し、関数をコメントアウトしたところエラーが消えました。原因はわからないままです。

現在、どの役ができているかを表示する処理を制作中です。
1画面では収められない場合があるため、
http://akai0ringo.blog.shinobi.jp/cocos2d-x/cocos%E3%81%AE%E3%82%B9%E3%82%AF%E3%83%AD%E3%83%BC%E3%83%AB%E3%83%93%E3%83%A5%E3%83%BC

http://tak-taniguchi.hatenablog.com/entry/2014/11/24/152014

これらのサイトを参考に、スクロールビューを使用して表示しようと思います。

役の判定自体は完成しているため、あとは表示するだけです。

役の表示が完成したら、NPCの動作を作成します。
これは、ほとんどプレイヤーのものを流用できるため、あまり苦労することはないと思います。

いよいよ次回が最後です。デバッグする時間がありませんが、ちゃんと遊べるもができるよう、頑張りたいと思います。

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

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

 皆さんこんにちは、MBAインターナショナル インターン生の岩岬です。
 早いもので折り返しを過ぎた6回目です。今回はUI周りに手を付けて、プロトタイピングを終わらせにかかろうというところです。
 さて、まず前回の振り返りですが、都内における、だれでもトイレ(多目的トイレとほぼ同義です)の設置場所のオープンデータを利用する方針で、そちらの表示ができるところまでは進みました。ここから、データの見易さとアクセシビリティをなんとかしようという目標のもと、今回の作業に当たりました。
 今回の進捗としては、データの表示方法をカンマ区切りの文章から表へと変更、設備の対応状況によるフィルタリング機能、性別の対応(共用、男性用、女性用の3条件)でのフィルタリング機能の3点があげられます。これによって、比較的ではありますが、見やすい表示ができているのではないかと考えております。また、この方針でもインターン制作物とみれば一定のWebサービスができるのではないでしょうか。
 今回の作業で気になった点は、動作速度の問題です。今回は重要度が低いと思われるデータ項目を削る方向で動作速度の確保を狙いましたが、削っていいデータの量には限度があるので本実装では工夫が必要になると思います。
 今回の作業でプロトタイピングは完了したと考え、次回以降は本実装にあたろうと考えています。本実装ではUIをより一層分かりやすくすることが必要でしょう。それ以外に必要な部分としては、フィルタリングを今より多い条件(地域や利用可能な時間など)で行えるようにすることと、施設名のほかに地域による検索が行えるようにすることがあるでしょうか。
 残り日数は多くないですが、なるべく良いものが作れるように作業を進めていきたいところです。

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

10日間でAndroidゲームネイティブ制作に挑戦(情報受け渡し編)

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

 前回はゲーム画面のUIを作りましたね。
今回はまずクリア画面を作っていこうと思います。

いつものようにアクティビティを作っていくのですが、今回はタイトルにはありませんが、まずLayoutについて話していこうと思います。

レイアウトはそれを置いておくと、ある程度画面内のアイテムを並べておいてくれるものです。
最初のほうに引用してあったサイトでもレイアウトを使っていたような気がします。
私はクリア画面を作るときにLinearLayoutを使いました。縦にアイテムを設置していってくれるもので、単純な画面を作るのならこれがあれば十分です。
最初に入っているConstraintLayoutはなくてもいいと思います。
これまでDesignを使ってやっていましたが、レイアウトが分かりづらかったり、配置しずらい、プレビューとテスト時のエミュレーターのアイテム配置が異なっているなどの問題があったため、Textでやってみました。
Textは記述することはとても面倒ですが、サンプルなどを見ながら打って、自分に合うように改良していけば段々と覚えていくことができると思います。

 ついでにmarginについて過去に訳が分からなかったと話したと思いますが、隣接してるアイテムとの距離を示すためのものだったようです。Layoutと組み合わせればかなり簡単に配置ができそうでとてもいいものだと思いました。
できればx、yでのやり方も知りたいものですが。

 そしてレイアウトなどを使ってテキストやボタンなどを配置していったのですが、ある問題が発生しました。
今までの画面切り替えの方法のままだと回収した貝の情報が新たなアクティブに行かないため、結果がクリア画面で出せないのです。
情報を持っていくための情報を探したら比較的早く出てきました。
putExtraです。
これは、変数を取り出すためのキーを設定しておいて保持したい情報を格納するものでした。
相手先で情報を得るために、GetExtraをしなけらばなりませんが、たった二文書くだけで一つ分情報を送ることができるのでとても便利に感じました。

 今回はxmlについての知識や画面切り替えに関する新たな知識を得ることができました。
次回はゲームを遊びやすくするためにはどうすればよいかや、追加要素などを検討していきたいと思います。

 ではまた次回

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