Spritekitに於ける座標系補遺

ゲーム画面座標空間に座るうさ犬

求めるゲームの要件から導いた仕様ならずとも 2Dアクションゲームの開発に於いては採用フレームワーク内での 直行座標系 の取り扱いに関する把握は必須となります。 斯くして前稿 Spritekitに於ける座標系 をものしたのでしたが本稿では其の補遺として更に詳細を追ってみたいと思います。

さて以下は Scene クラスでの作業となります。 先ず実装例の一部を示しましょう。


スポンサーリンク
日付：2014年4月8日
開発機：MacBook Air（11-inch, Mid 2013）
MacOSバージョン：OS X 10.9.2
Xcodeバージョン：5.1
言語：Objective-C
主関連アプリ：うさ犬が行く
-(id)initWithSize:(CGSize)size {  
  if (self = [super initWithSize:size]) {
    /* 以下は特に設定しなくても標準で採用される */
    // self.anchorPoint = CGPointMake(0.5f, 0.5f);

-(void)update:(CFTimeInterval)currentTime {
  /* anchorPointに依るうさ犬を中心としたシーンの描画 */
  // self.anchorPoint =
  //   CGPointMake(self.anchorPoint.x - 0.001, self.anchorPoint.y - 0.001);
  if (flyingHonmaru.position.y > 234.0f) {
    self.anchorPoint =
      CGPointMake((flyingHonmaru.position.x + 160) / 320.0,
      -(flyingHonmaru.position.y - 284) / 568.0);
  } else {
    self.anchorPoint =
      CGPointMake((flyingHonmaru.position.x + 160) / 320.0, 50.0 / 568.0);
  }

前稿 でゲーム画面の座標としては基本的にシーンに適用するアンカーポイントを利用しました。 中心にアンカーポイントを据えるのであれば標準値として与えられますので記述の必要はありません。 此れを背景に主人公キャラクターうさ犬の ほんまる を中心に据えた画面を構成するには飛行するほんまるのアニメーションインスタンスを flyingHonmaru とすれば以下の如く座標を指定します。

CGPointMake(
  (flyingHonmaru.position.x + 160) / 320.0,
  -(flyingHonmaru.position.y - 284) / 568.0
)

さてほんまるが地面に或る閾値を超えて近付いた時の条件は （flyingHonmaru.position.y <= 234.0f） で齎され広告表示用余白を踏まえた画面下 （50.0 / 568.0） を基準としてシーンを描画すればほんまるは画面構成上落下する筈ですが、 SpriteKitの anchorPoint プロパティの性質をなお確り把握すればX座標の中心は常にシーンの中央に設定し ほんまるはX座標方向に関しては常に中心を占めるとは限らない旨、以下で表現出来るでしょう。

if (flyingHonmaru.position.y > 234.0f) {
  self.anchorPoint =
    CGPointMake(0.5f, -(flyingHonmaru.position.y - 284) / 568.0);
} else {
  self.anchorPoint =
    CGPointMake(0.5f, 50.0 / 568.0);
}

UIViewの原点の変更

ゲーム画面としての座標を考えるに当たっては 中心キャラクター、背景、画面全体等複数の座標系が混在し独立して動く難しさがあります。 アンカーポイントを考慮した時には正規化される煩雑さも伴いますし ノードの親子関係を確り把握した上で其々の座標原点の在り方を検討しなければ 思惑通りにはどうにも動いてくれません。 UIViewに如何に調整を施すかについては以下両情報ページを参考にしました。

ViewController上にシーン、 SKScene を描画するに広告表示分余白を考慮すれば 以下のように記述すればSKSceneの親Viewであるのでずれた部分の背景色が黒くなってしまいます。

self.view.frame =
  CGRectMake(0, -50, self.view.frame.size.width,
  self.view.frame.size.height);

此の実装はSpriteKitのupdateメソッド -(void)update:(CFTimeInterval)currentTime への記述で動くものであってゲーム画面を初期化するメソッド -(id)initWithSize:(CGSize)size への記述では当然ながら動かないのも問題となり 今後へ保留する宿題となりました。 手法を固定せず柔軟に考えればブログ @kitano_ow's blog の2014年1月15日の記事も参考になるでしょう。

【Xcode5】Xcodeの使い方 SpriteKit 編 Vol13 〜 スクロールについての考察 cameraとセンタリングについて〜 　

約めればセンターに位置させるスプライトノードに対する親ノードのpositionプロパティを変更することで 然るべきゲーム画面構成を実現している、と言えるでしょう。 何しろゲーム画面の基本となる重要な部分ですので実際の開発アプリでは 紆余曲折を経ながら目論見の実現を果たしていますが 此処では機会が有れば検討する腹積もりを以て手仕舞いにする稿として〆ます。

Going USAINU（邦題： うさ犬が行く）
無料：カテゴリ: ゲーム： 4+ 評価
バージョン: 3.21
リリース： 2015年9月14日
更新： 2022年3月7日
サイズ : 19.7 MB
互換性： iOS 14.4 以降のiPhone、iPod touch に対応。および、macOS 11.0以降とApple M1 チップを搭載したMac に対応。

1件のコメント

  1. ピンバック: Spritekitに於ける座標系 – Acenumber Technical Issues

コメントは受け付けていません。