Power Appsに当たり判定をさせるカスタム関数

カスタム関数を使用して、当たり判定をするカスタム関数(コンポーネント)を作成します。

これにより、Power Appsでゲームなどを作成しやすくなります。

カスタム関数とは→【早い・美しい・易しい】カスタム関数について

作り方

新しいコンポーネントより、当たり判定というコンポーネントを作成します。

サイズはブロックのように正方形にしておきましょう。

新しいカスタムプロパティより、HitBoxというプロパティを作成します。

内容をそれぞれ以下のように設定します。

新しいパラメーターとして、以下の4つを設定します。

targetxval

対象のX座標です。以下のように設定します。

targetwidth

対象の横幅です。以下のように設定します。

targetxval

対象のY座標です。以下のように設定します。

targetheight

対象の高さです。以下のように設定します。

関数の中身を作成

左上の選択肢からHitBoxを選択し、関数の中身を以下のように書いていきます。

And(
    Or(
        //対象の左端がコンポーネントのX座標範囲内に存在するか
        And(
            Self.X <= targetxval,
            targetxval <= Self.X + Self.Width
        ),
        //対象の右端がコンポーネントのX座標範囲内に存在するか
        And(
            Self.X <= targetxval + targetwidth,
            targetxval + targetwidth <= Self.X + Self.Width
        ),
        //対象のX座標範囲内にコンポーネントのX座標範囲が完全に収まっているか
        And(
            Self.X >= targetxval,
             targetxval + targetwidth >= Self.X + Self.Width
        )
    ),
    Or(
        //対象の上端がコンポーネントのY座標範囲内に存在するか
        And(
            Self.Y <= targetyval,
            targetyval <= Self.Y + Self.Height
        ),
        //対象の下端がコンポーネントのY座標範囲内に存在するか
        And(
            Self.Y <= targetyval + targetheight,
            targetyval + targetheight <= Self.Y + Self.Height
        ),
        //対象のY座標範囲内にコンポーネントのY座標範囲が完全に収まっているか
        And(
            Self.Y >= targetyval,
             targetyval + targetheight >= Self.Y + Self.Height
        )
    )
)

とりあえずコピペすれば大丈夫です。

Self.XまたはSelf.Yを使用してコンポーネントのXとY座標を取得しています。

使用してみる

対象となる図形(Rectangle1)を配置します。

大きさが200×200の正方形を設置しました。

次に画面に当たり判定コンポーネントを設置し、そのFillを以下のように設定します。

If(
    当たり判定_1.HitBox(
        Rectangle1.X,Rectangle1.Width,Rectangle1.Y,Rectangle1.Height
    ),
    RGBA(255,0,0,1),RGBA(0,255,0,1)
)

正方形がコンポーネントの範囲内にある場合は赤、それ以外は緑色になります。

範囲外にあるとき

正方形の一部が範囲内にある時

正方形の内部にコンポーネントがある時

正しく判定されていることがわかります。

まとめ

今回はコンポーネントのFillを使用しましたが、実際にゲームを作成する際にはタイマーコントロールを使用して判定させればリアルタイムに当たり判定が出来ます。

このカスタム関数を活用してゲームアプリを作成してみてください！