Group

phaser.io
Phaser - The fast, fun and free HTML5 Game Framework
https://phaser.io/phaser3/api/group
Desktop and Mobile HTML5 game framework. A fast, free and fun open source framework for Canvas and WebGL powered browser games.

一覧へ戻る

Overview

Groupはゲームオブジェクトにまとめて指示を与えることができる仕組みです。Groupはtransformを持たないので、Group自体を回転や移動、拡大・縮小をさせることはできません。ゲームオブジェクトが所属するGroupは一つである必要はなく、ゲームオブジェクトが異なるグループに属していた場合、属している全てのグループの影響を受けます。

image

Groupは２つの核となる機能を要求します。一つは複数のゲームオブジェクトを生成することで、もう一つはそれらの子供を制御することです。

現在、以下の関数を持ちます。

  • add
  • addMultiple
  • create
  • createFromConfig
  • createMultiple
  • remove
  • clear
  • getChildren
  • destroy
  • angle
  • gridAlign
  • incAlpha
  • incX
  • incXY
  • incY
  • placeOnCircle
  • placeOnLine
  • placeOnRectangle
  • placeOnTriangle
  • playAnimation
  • randomCircle
  • randomEllipse
  • randomLine
  • randomRectangle
  • randomTriangle
  • rotate
  • rotateAround
  • rotateAroundDistance
  • setAlpha
  • setOrigin
  • scaleX
  • scaleXY
  • scaleY
  • setRotation
  • setScale
  • setScaleX
  • setScaleY
  • setVisible
  • setX
  • setXY
  • setY
  • smootherStep
  • smoothStep
  • spread
  • toggleVisible

Groupを利用する際の注意点です。Groupは自分自身の表示リストを管理しません。Phaser3ではネストした表示リストは存在せず、全ては一つのプレーンに存在します。そのため、レンダリング時に表示リストを解釈する際に、子供や孫を反復して処理しません。

Examples

Groupを使って新しいSpriteを生成する例です:

var group = this.add.group();

var sprite = group.create(400, 300, 'phaser');

以下、一回の処理で複数の子供のスプライトを作る例です。生成した後、configオブジェクトを使ってそれらを10×10のグリッドに整列させています:

var group = this.add.group();

group.createMultiple({
    key: 'diamonds',
    frame: [ 0, 1, 2, 3, 4 ],
    frameQuantity: 20
});

group.gridAlign({
    width: 10,
    height: 10,
    cellWidth: 32,
    cellHeight: 32,
    x: 100,
    y: 100
});

一覧へ戻る

Print Friendly, PDF & Email