usePhysics

usePhysics フックは物理エンジンの状態に関する情報を提供します。物理が有効か、ロード済みか、物理関連のエラーを処理できます。

PlayCanvas React は物理エンジンを遅延ロード・インスタンス化するため、事前にコンテンツをレンダリングできます。usePhysics は物理エンジンの状態をリアクティブに確認するメカニズムを提供します。

物理システムについての詳細は 物理ガイド や Rigidbody、Collision コンポーネントを参照してください。

使い方

条件付きレンダリング

import { usePhysics } from '@playcanvas/react/hooks'

function PhysicsInfo() {
  const { isPhysicsEnabled, isPhysicsLoaded, physicsError } = usePhysics()

  if (!isPhysicsLoaded) return null
  
  return (<Entity>
    <Rigidbody type="box" />
    <Collision type="box" />
    <Render type="box" />
  </Entity>)
}

安全な物理 Component の作成

import { usePhysics } from '@playcanvas/react/hooks'

function SafePhysicsEntity() {
  const { isPhysicsEnabled, isPhysicsLoaded } = usePhysics()
  
  return (
    <Entity>
      <Render type="box" />
      {isPhysicsEnabled && isPhysicsLoaded && (
        <>
          <Collision type="box" />
          <Rigidbody type="dynamic" mass={5} />
        </>
      )}
    </Entity>
  )
}

フォールバック付き物理

import { usePhysics } from '@playcanvas/react/hooks'

function PhysicsWithFallback() {
  const { isPhysicsEnabled, isPhysicsLoaded } = usePhysics()
  
  if (isPhysicsEnabled && isPhysicsLoaded) {
    return (
      <Entity>
        <Collision type="box" />
        <Rigidbody type="dynamic" mass={10} />
        <Render type="box" />
      </Entity>
    )
  }
  
  // 物理なしのフォールバック
  return (
    <Entity>
      <Render type="box" />
    </Entity>
  )
}

プロパティ

Name	Type	Default
isPhysicsEnabled	boolean Whether physics is enabled on the application.	-
isPhysicsLoaded	boolean Whether the physics library has been successfully loaded.	-
physicsError	Error | null The error that occurred when loading physics, if any.	-

関連

• useApp - Application インスタンスにアクセスする
• Collision Component - Collision コンポーネントの作成
• Rigidbody Component - Rigidbody コンポーネントの作成
• Application Component - usePhysics Prop で物理を有効化