Nun, da ich mir die Problemliste ansehe, ist diese ähnlich zu #3078?

3066 ist meiner Meinung nach genauer.

Für die Aufzeichnung verwende ich (https://github.com/bfred-it/iphone-inline-video), um ein Video zum Inline-Abspielen auf ios 9 zu erhalten. Dies funktioniert, aber es scheint VideoTexture nicht zu zeichnen die rahmen auf ios9. dass lib einen requestanimationframe-Aufruf erstellt und das Video Bild für Bild durchläuft.

Hmm, interessant. Das fällt mir schwer, da ich kein iOS-Gerät besitze. Hoffentlich kann einer der anderen Entwickler das bald ausschalten!

@pr1ntr Im vorherigen Thread dafür habe ich beschrieben, wie ios9 und darunter ein Video nicht abspielen können, ohne dass es im Vollbildmodus angezeigt wird. Das ist ein Teil davon, wie Apple sie entwickelt hat.

Nun gibt es diese Polyfill-Lib von Drittanbietern, die einige clevere Spielereien macht, um dieses Verhalten tatsächlich zuzulassen. Was es tut, liegt meines Erachtens außerhalb des Rahmens von PIXI, daher konnte ich mir nicht vorstellen, dass es jemals in PIXI selbst enthalten ist.

Aber.... Ich habe mich mit iPhones verschiedener Betriebssysteme umgeben und werde mit dieser Lib spielen. Bei Erkenntnissen melde ich mich wieder :)

Hallo, danke für die Untersuchung. Das Verhalten, das ich finde, ist, dass die Aktualisierung der Textur nicht aktualisiert wird, wenn das Video seine Ereignisse wie gewohnt auslöst. Dieses Polyfill, das ich verwende, sollte alle Ereignisse normal auslösen, es hat nur seinen eigenen Voodoo-Häkchen requestAnimationFrame , um das Video weiterzuleiten. Wenn es nur mit einem <video> Tag verwendet wird, funktioniert es tatsächlich gut.

Ich denke, der Fehler ist nicht, dass es im Vollbildmodus angezeigt wird, sondern dass es die Ereignisse nicht auf die gleiche Weise hört. Ich habe versucht, die Quelle zu untersuchen, hatte aber nicht so viel Zeit und/oder Bezugsrahmen.

Ich kann versuchen, ein Beispiel für Codepen zu machen, um dieses Verhalten zu zeigen. wäre das hilfreich?

Wenn du noch ein paar Minuten durchhältst, habe ich vielleicht eine Lösung für dich gefunden :)

Süss!

var renderer = PIXI.autoDetectRenderer(window.innerWidth, window.innerHeight, { transparent: true });
document.body.appendChild(renderer.view);

// create the root of the scene graph
var stage = new PIXI.Container();

// create a video texture from a path
var texture = PIXI.Texture.fromVideo('video.mp4');
texture.baseTexture.autoPlay = false;
makeVideoPlayableInline(texture.baseTexture.source, false);

window.document.addEventListener( 'mousedown', function() {
    texture.baseTexture.source.play();
});

window.document.addEventListener( 'touchstart', function() {
    texture.baseTexture.source.play();
});

var videoSprite = new PIXI.Sprite(texture);
videoSprite.width = renderer.width;
videoSprite.height = renderer.height;
stage.addChild(videoSprite);

animate();

function animate(){
    requestAnimationFrame(animate);

    // render the stage
    renderer.render(stage);
}

Also, das obige funktioniert für mich ios8 und ios9. Beachten Sie, dass Sie beim Aufruf von 'makeVideoPlayableInline' 'false' angeben. Dies bedeutet, dass das Video keinen Ton hat. Dies ist die einzige Möglichkeit, mit diesem Polyfill von Drittanbietern inline mit PIXI zu arbeiten. Hoffentlich ist das ein akzeptabler Kompromiss für Sie!

Ich denke, der Schlüssel könnte sein, dass das Video überhaupt kein Audio enthält. Ich habe false geliefert, aber das Video hat eine Audiospur. Ich habe nur ein Testvideo mit Audio verwendet. Das eigentliche Video für die App, die wir erstellen, wird keine haben. Ich versuche es mit der Neucodierung und ich melde mich wieder.

In meinen Tests mit mehreren Videos spielt es keine Rolle, ob das Video Audio enthält oder nicht. Durch Übergabe von 'false' an 'makeVideoPlayableInline' wird das Video inline abgespielt.

richtig, ich übergebe falsch. aber ich verpacke das Video woanders.

Dies ist meine Videokomponente _Warnung_ Reagieren.
https://gist.github.com/pr1ntr/8511ede7068eac180f515a18ddf75a89#file -connectvideo-js-L52
Hier wird das Inline-Polyfill ausgeführt (Zeile 52)
Zeile 60 ruft eine ready-Funktion auf, die seinem Elternteil sagt, dass es PixiVideoWrapper rendern soll
Das ist es hier:
https://gist.github.com/pr1ntr/57032704841e471c3a145308072f3ee2#file -game-js-L37

Sobald der PixiVideoWrapper montiert ist, erledigt er alles, um die Videotextur zum Laufen zu bringen:
https://gist.github.com/pr1ntr/3a44f327406d5d5a97824c47d6194484#file -pixivideowrapper-js-L118

Wenn der Benutzer in der Game.js also getippt hat, sollte das Video in PixiVideoWrapper Zeile 81 über Zeile 121 componentWillReceiveProps abgespielt werden.

Wenn ich das display:none entferne, kann ich die Inline-Videowiedergabe sehen.

verwendest du auch das neueste #dev?

Ja

Alles vor dem neuesten Entwickler hat entweder Probleme beim Laden von Basisvideotexturen oder enthält nicht das Inline-Tag für Videos, das ios10 erfordert

ok dein beispiel funktioniert bei mir. Aber wo ist das Video im DOM? auch was ist dieser Knopf namens HOOK DIV? Das ist merkwürdig. Warum sollte es einen Unterschied machen, wenn das Video bereits auf der Seite vorhanden ist?

Wenn die Basisvideotextur ein direktes Video ist, wird das HTML-Video-Tag selbst erstellt. Vielleicht liegt hier der Unterschied. Sehen Sie sich den Quellcode an, um zu sehen, ob Event-Listener anders eingerichtet sind. Ich habe bis Donnerstag keinen Zugriff auf iOS-Geräte, um damit wieder zu spielen, fürchte ich

testest du im simulator?

Nein, ich habe auf echten Geräten getestet.

Hallo
Ich habe einen grundlegenden Test durchgeführt, um zu sehen, ob die Bereitstellung Ihres eigenen Videoelements funktioniert. Unter ios9 war dies nicht der Fall, das Beispiel, in dem Sie die Quelle als String bereitgestellt haben, funktioniert.

import inlineVideo from 'iphone-inline-video';

var video = document.createElement('video');
video.setAttribute('playsinline','');
video.setAttribute('webkit-playsinline','');

var src = document.createElement('source');
src.setAttribute('src', vidUrl);
src.setAttribute('type', 'video/mp4');

video.appendChild(src);

console.log(video);

// create the root of the scene graph
var stage = new PIXI.Container();

// create a video texture from a path
var texture = PIXI.Texture.fromVideo(video);
texture.baseTexture.autoPlay = false;
inlineVideo(texture.baseTexture.source, false);

window.document.addEventListener( 'mousedown', function() {
    texture.baseTexture.source.play();
});

window.document.addEventListener( 'touchstart', function() {
    texture.baseTexture.source.play();
});

var videoSprite = new PIXI.Sprite(texture);
videoSprite.width = renderer.width;
videoSprite.height = renderer.height;
stage.addChild(videoSprite);

animate();

function animate(){
    requestAnimationFrame(animate);

    // render the stage
    renderer.render(stage);
}

Ich konnte den Unterschied in der Quelle von PIXI nicht finden. Ich glaube, ich werde verrückt.

Das einzige, was ich anders sehen kann, ist, dass wenn Sie PIXI ein eigenes Video-Tag aus einer String-URL erstellen lassen, es auch aufruft
video.load();
Versuch das gleich danach
video.appendChild(src);

omfg unglaublich! das behebt es total. fml. Danke.

Dieser Thread wurde automatisch gesperrt, da nach dem Schließen in letzter Zeit keine Aktivität stattgefunden hat. Bitte öffnen Sie eine neue Ausgabe für verwandte Fehler.