React-VR iFrameフルスクリーン

Question

既存のアプリにiFrameする必要があるReact-VRアプリケーションを作成する。私の質問は全画面ボタンに関するものです。このボタンを非表示にして、他のアプリ内で管理したり、ボタンがクリックされたという親にメッセージを送信するにはどうすればよいですか？

Answer 1

これについての公式のドキュメントは見つかりませんでしたが、実装をVRInstanceに見ると、そのボタンを隠すhideFullscreenオプションがあります。あなたはあなたがFullscreen APIの様々なクロスブラウザの実装の詳細について心配する必要はありませんscreenfull.jsのようなライブラリを使用することができますiframe対応のフルスクリーンモードを切り替えること

// vr/client.js 
const vr = new VRInstance(bundle, 'VRTEST', parent, { 
    hideFullscreen: true, 
    ...options, 
}); 

。

あなたのページにボタンをレンダリングし、クリック時にDOM要素のフルスクリーンモードを切り替えるだけです。

const vrIframe = document.getElementById('vrIframe'); 

document.getElementById('vrFullscreenButton').addEventListener('click',() => { 
    if (screenfull.enabled) { 
    screenfull.request(vrIframe); 
    } 
});