User Manual

PlayCanvasでのWebXRの使用方法

WebXRのサポート

WebXRのブラウザサポートはまだ全面的には実現されていません。以下のようにして確認できます。

if (app.xr.supported) {
    //WebXRはサポートされています
}

XRセッションの開始

XRに入るAPIは、CameraコンポーネントまたはApplicationのXrManagerにあります。VRの提供を開始するには、CameraComponentの startXr メソッドを使用し、XRセッションのタイプ、参照スペース、オプションの追加引数オブジェクトを指定する必要があります。

entity.camera.startXr(pc.XRTYPE_VR、pc.XRSPACE_LOCALFLOOR);

これは非同期操作であり、ボタンクリック、マウスクリック、またはタッチなどのユーザー操作でのみ開始できます。セッションが開始されたことを知るには、 start イベントに登録することができます。

app.xr.on('start', function () {
    // XRセッションが開始されました
});

セッションタイプや参照スペースが特定のプラットフォームで利用できない場合、セッションを開始できず、コールバックでエラーが提供され、XrManagerでerror イベントが発生します。

entity.camera.startXr(pc.XRTYPE_VR, pc.XRSPACE_UNBOUNDED, {
    callback: function(err) {
        if (err) {
            //セッション開始に失敗しました。
        }
    }
});

XRセッションの終了

XRの終了はさまざまな方法でトリガーできます。コードからXRを終了することができます。

app.xr.end();

また、ユーザーはブラウザの戻るボタンなどの外部プロセスを介してXRを終了する場合があります。 XrManagerは、セッションendに関連するイベントを発生させます。

app.xr.on('end', function () {
    // XRセッションが終了しました。
});

XRの種類

それぞれのプラットフォームで、異なる種類のセッションがサポートされています。これらは以下の通りです。

セッションタイプの利用可能性は、プラグインされたデバイスやデバイス上の機能に基づいてアプリケーションの寿命中に変化する可能性があるため、チェックする必要があります。

if (app.xr.isAvailable(pc.XRTYPE_VR)) {
    // VRは利用可能です
}

利用可能性の変更にもサブスクライブすることもできます。

app.xr.on('available', function (type, available) {
    console.log('XR session', type, 'type is now', available ? 'available' : 'unavailable');
});

//または特定のセッションタイプ
app.xr.on('available:' + pc.XRTYPE_VR, function (available) {
    console.log('XR session VR type is now', available ? 'available' : 'unavailable');
});

XR中のカメラの位置と向き

XRでプレゼンテーションしている場合、カメラの位置と向きはXRセッションのデータによって上書きされます。カメラの追加の移動と回転を実装する場合は、カメラに親エンティティを追加し、そのエンティティへの操作を適用する必要があります。

Camera Offset

ワールドスペースで提供される入力ソースレイ、およびグリップとハンドの位置と回転。

なぜ自動的にXRモードを有効にできないのですか?

WebXRに入るには、 ユーザーアクション によって呼び出す必要があります。つまり、キーの押下、マウスのクリック、またはタッチイベントに応答する必要があります。そのため、ページの読み込み時にすぐにXRに入る方法はありません。

実験的な機能

WebXR APIは常に進化しており、さまざまなXRの機能を拡張した追加APIがリリースされます。エンジンは常にXR APIの統合に更新されますが、一部の機能には遅延が伴う場合があります。新しい機能を実験してみたい開発者は、関連する optionalFeatures フラグを渡すことでそれらを有効にすることができます。 注意:内部未公開APIへのアクセスはエンジン変更の対象であり、後方互換性が保証されているわけではありませんWebXR Layersの実験的APIを有効にする例を以下に示します。

app.xr.start(cameraComponent, pc.XRTYPE_VR, pc.XRSPACE_LOCAL, {
    optionalFeatures: [ 'layers' ],
    callback: function(err) {
        if (err) {
            console.log(err);
            return;
        }

        if (app.xr.session.renderState.layers) {
            // get access to WebXR Layers
        }
    }
});
This site is translated by the community. If you want to get involved visit this page