Spritekitを利用したゲームAIもどきの実装

今流行りのAI、即ち人工知能とタイトルすれば甚だ釣り気味ですが、 ゲーム作成に於いてはコンピュータにプレイヤーの相手をさせる場合、 大にしろ小にしろ孰れ其の為のアルゴリズムを用意しなければなりません。 其れは手元の開発iPhone専用ゲームアプリ バルーンズオキュパイ でも一般です。

略してバルオキュでは プレイヤーが画面上に風船を膨らませて自陣を拡張しているのに対し 此のゲームでは敵キャラクターとなる うさ犬 兄弟の弟、 はなまる が画面上を所狭しとジャンプしまくりプレイヤーが膨張させつつある風船を割って回る、 と言うゲーム内容になっています。 此の際、はなまるはプレイヤー陣地の確定した部分は避けて飛ぶ必要があります。 また膨張中の風船にはなまるが飛び込めば其の風船は割れてプレイヤーの負けが確定しなければなりません。 此の両者の解決を同時に図る上手い方法はないものかと模索して、 どうやら共に衝突判定が使えるだろうと思い付きました。 ゲームAIに衝突事件を組み込んで実装すればはなまるは確定風船を避けつつ時には膨張中の風船を割りに掛かるだろうと言う目論見です。

Hanamaru and uPanda in iPhone Game Balloons Occpy

衝突判定の実装は一般に難しいと言われる処ですが アップル社がXcodeに用意する2Dゲーム開発フレームワークである SpriteKit には最初から其の機能が用意されているので其れを用いることにします。

WordPressで特定親カテゴリーとその子カテゴリー全ての記事一覧を日付順に取得する

WordPress案件でよくある要請にカテゴリー記事一覧の表示があります。 単に特定の単独カテゴリーの記事一覧であれば 其の方法はネット検索すればかなり豊富に見付かります。 此れが複数カテゴリーの記事一覧の表示になると些か其の方法が見付かり難くなるのは カテゴリーの複数化に因る表示のバリエーションが増え、 情報が其々の状況に応じたものに寄せてあって目的に適い難い部分が出てくるからかも知れません。

バリエーションの一つとして此の要請のオプションに於いては屡々 カテゴリーの親子関係を考慮した記事一覧の表示が求められと言う条件が与えられます。 具体的に言えば 複数カテゴリーの其々最新の記事を一つづつ表示したり、 複数カテゴリーを横断して最新の記事を任意数表示したりする条件から、 中には親子カテゴリーを考慮して特定親カテゴリーに属する子カテゴリーの其々の記事一覧を表示したりするものまで なかなか多様な条件に彩られると言っても良いかも知れません。

手元で実現したい条件としては 特定の親カテゴリーの記事一覧と其の子カテゴリー全ての記事一覧を合わせて 中から日付順に表示していく必要があるもので、 此れもオプションとしては要請の度合いが高いものに属するかも知れません。 此の条件を実現しようとすると どうしても複数カテゴリーの記事の全てを取得して 時系列で整列させて上で表示させなければならなくなります。

ゲーム画面を覆うようにforループでNSMutableArrayを生成する

陣取りゲームとして目論む処のゲーム主画面に於いては 陣地の遣り取りの判定のために画面全体を区切る必要があります。 区切った画面各々にプレイヤーの陣地か如何かの判定フラグを持たせ 更には他にも様々に応用して用いる使い勝手の良い 配列 として扱う腹積もりです。 この際ゲーム画面の幅に合わせて区切りを柔軟に保たせるために 可変配列を用いることにします。

可変配列オブジェクト NSMutableArray の概要については iPhoneアプリ開発の虎の巻 のページ NSMutableArray などが参考になるかも知れません。

Scene受け渡し時の画面サイズの初期化

キャラクターが空を飛んでいるのを表現するのに iPhoneの画面を超えて縦横無尽に飛び回る状況を作り出したい為に上方に上限を設けぬ実装を鑑み Spritekitに於ける座標系を考察したのが以下列挙する本ブログの両記事です。

処が此処に問題の内在が発覚しました。 時折デバッグの為に変数を出力して検討するのは誰もが実行する処でしょう。 2017年5月5日記事 SpriteKitに於ける時間軸に基づく背景グラデーションの独自実装 に記したようにゲームに於いてキャラクターが上空に飛翔すればするほど 宇宙空間に近いた表現で空色を濃く染め上げるのに背景色を変化させたのですが 此の時必要なのはキャラクターの縦軸の位置変数であるのは言う迄もありません。 其の変数とした honmaruPosYRatio の算出法は以下コードとなります。

WordPressでjQueryを必要とするJavaScriptファイルをjQueryの後に読み込む

世の中フロントエンドと言えばFacebookの提供するフレームワークなどで大規模なものを想起し勝ちとなりましたが まだまだホームページに於ける小規模な実装では jQuery が活躍しますしWordPressの2017年最新版に於いても標準で読み込まれるような実装となっています。 ちょっとしたスムーススクロールやアンカーリンクの無効化などを一部に適用するなどの要請では 特定のページに読み込むだけの実装で済ませられれば大規模なフレームワークでは些か冗長さを免れません。 jQueryを利用すれば此れ等の如きJavaScriptファイルは僅か数行となりますから尚更です。

懐かしのポケコン シャープポケットコンピューターPC-1210
懐かしのポケコン シャープ ポケットコンピューター PC-1210

此れをWordPressの特定ページに読み込ませたりする際には functions.php にWordPressの特有関数 wp_enqueue_script を用いてファイル読み込みを実装するのが定石でしょう。 例えばhomeで関連づけられた wp_register_style を用意して孰れかのタイミングで add_action おけばif文で条件分岐した wp_enqueue_style で読み込めると言った塩梅で実に重宝です。

テーブルタグのレスポンシブ対応とiPhoneのフォント指定無効問題

スタイルシートで確りフォントサイズの指定をしているのに iPhoneに限って其の折角の指定が無効になっている場合が多々あります。 確認の為にPCブラウザのエミュレータで見て見ても問題ないのにiPhoneでは想定外のフォントサイズで表示されている事例としては Portraitモード、即ち縦位置で見ている画面をLandscapeモード、即ち横位置にすると 文字サイズがは大きくなる現象は割と知られているのではないでしょうか。 此れはスマホに於けるユーザービリティを考慮して スマホのブラウザでのみ有効な -webkit-text-size-adjust なる属性が用意され効いているのに起因するのも周知されている処だと思います。

しかし例えば自前のブログでは屡々振り仮名を持ちいるのですが 此の時利用する ruby タグで囲った部分には此の属性は効かないようで タグ内に記入した文字は横位置でも縦位置と同じフォントサイズであれば 横位置では思わぬ不揃いの文章表示となってしまうのでした。 此れなどは以下のリンク、サイト ヒビヅレの2011年5月24日の記事などに代表される情報を参照すれば bodyタグ、若しくはフォントサイズを指定する箇所の大枠部分に -webkit-text-size-adjust: 100%; を効かせてやれば解決するのでした。

投稿日:
カテゴリー: CSS

SpriteKitに於ける時間軸に基づく背景グラデーションの独自実装

手元の開発ゲームに於いてキャラクターの縦横無尽に動き回る 背景の空部分の広大な空間を表現するためにグラデーションを用いたく考えました。 青空は単に一様に青いのではなく 青さも位置取りに基づいて薄っすらと変化させたい要請が発生した訳です。

其処でXcodeでグラデーションを描画する実装が必要になり 大凡簡単なものだろうと高を括っていたら案に相違して 其れ程お手軽に実現出来るメソッド等はどうやら用意されていない様です。

SpriteKitに関する情報は余り多くなく 其れでこそ本ブログも幾許かの役立つ情報を提供出来るかも知れない所ですが 残念ながらSpritekitでは現状背景グラデーションに用意されたメソッドは見当たりません。 しかし UIView では幾つか方法がネットに共有されているのを見付けましたので下にリンクを貼り置きましょう。

Spritekitの物理空間で衝突を発生させる為の必須処理と衝突判定とすり抜け

アップル社がiPhoneアプリ開発に提供する2Dゲーム用フレームワーク SpriteKit を開発アプリに適用すればゲーム画面内に物理空間を生じせしめ 内部でオブジェクト同士の衝突の検出を可能にします。

処でアップル社が提供する統合開発環境、 IDE(Integrated Development Environment) 足るXcodeでは補完機能が随分重宝します。 特にスティーブ・ジョブズに依って齎された NEXTSTEP を継承するアップル社の開発環境では長くなり勝ちなメソッド名や変数名などを扱うには 補完機能がないとなると実に不便に感じるものです。

さてSpritekitを利用して開発するゲームに於けるコーディングでは 利用するクラスファイルのヘッダファイル冒頭に以下記述が必要になるのは周知でしょう。 先ずはSpritekitをインポートしなければならないのは言わずもがなです。

SwiftのPlaygroundsを使ってみた

下の図は手持ちのiPad Pro 9.7インチ版のApp Storeで Swift Playgrounds で検索した結果表示です。 どの環境でも此の如く先ず真っ先にアップル社が提供するiPad専用アプリ Swift Playgrounds が表示されるでしょう。

App Storeに於けるSwift Playgroundsでの検索結果画面

アップル社から提供されるアプリで尚且つ無料でもあり躊躇うことなく入手インストールします。 なお Swift Playgrounds の詳細説明画面を開けば下図のように 何やら楽しげな内容を垣間見せるものとなっています。 レートが 4+ 、即ち制限なく年少者にも問題なく見せられる設定となっており アップル社としては積極的に次代を担う子供達に使用を促すものとして提供されている様子が伺えるでしょう。

Swiftに於ける変数の文字列化の評価の違い

プログラムをしていれば思わぬ結果に右往左往するのも多くあります。 其れはiPhoneアプリ開発に於いても例外ではありません。 以前では其の開発言語は Objective-C の一択であり自らもアプリを幾つか当該言語で以て記述してリリースしました。 今は多くアップル社から提供された新開発言語 Swift で書かれるアプリも多くなってきました。

開発アプリのヘックス画面

Swiftは型に厳格な言語で更には思わぬバグを防ぐために 何の値をも持たない nil (null)を許す際には当該事項も型として用意されるものです。 optional (オプショナル)型と称すものですが なかなか理解が難しく正直自身も恥ずかしながら正確な部分迄把握は出来ておらず 都度都度対処療法を施している様な状況です。

さて今回落とし穴に陥ったのは変数の文字列化に於いてでした。 既にリリースのなっているアプリをバージョンアップしようと機能追加するに於いては 変数の宣言も形や場所を変えざるを得なくなります。 従来は変数の宣言を3次元配列から一義に代入していました。 以下の如くです。