Sekarang saya melihat daftar masalah, apakah ini mirip dengan #3078?

3066 lebih akurat saya pikir.

sebagai catatan saya menggunakan ( https://github.com/bfred-it/iphone-inline-video ) untuk mendapatkan video untuk diputar inline dengan sendirinya di ios 9. Ini berfungsi, namun videoTexture sepertinya tidak menggambar bingkai di ios9. lib itu membuat panggilan bingkai animasi permintaan dan melangkah melalui bingkai video demi bingkai.

Hmm menarik. Ini sulit bagi saya karena saya tidak memiliki perangkat iOS. Semoga salah satu devs lain bisa segera menyelesaikan ini!

@pr1ntr Di utas sebelumnya untuk ini saya menjelaskan bagaimana ios9 dan di bawahnya tidak dapat memutar video tanpa layar penuh. Itu adalah bagian dari bagaimana Apple mendesainnya.

Sekarang, ada lib polyfill pihak ketiga yang melakukan beberapa kejahatan pintar untuk benar-benar mengizinkan perilaku ini. Apa yang saya yakini berada di luar cakupan PIXI, jadi saya tidak dapat melihatnya dimasukkan ke dalam PIXI itu sendiri.

Tapi.... Saya telah mengelilingi diri saya dengan iPhone dari berbagai versi os, dan akan bermain dengan lib ini. Saya akan menghubungi Anda kembali dengan temuan apa pun :)

Hai, terima kasih telah menyelidiki. Perilaku yang saya temukan adalah bahwa pembaruan pada tekstur tidak diperbarui jika video menjalankan peristiwanya seperti biasa. Polyfill yang saya gunakan harus mengaktifkan semua acara secara normal, ia hanya memiliki centang voodoo requestAnimationFrame untuk mendorong video. Saat menggunakannya hanya dengan tag <video> itu benar-benar berfungsi dengan baik.

Saya pikir bugnya bukan layar penuh, tetapi tidak mendengar acara dengan cara yang sama. Saya mencoba menyelidiki sumbernya tetapi tidak punya banyak waktu dan/atau kerangka acuan.

Saya dapat mencoba membuat contoh pada codepen untuk menunjukkan perilaku ini. apakah itu akan membantu?

Jika Anda bertahan selama beberapa menit lagi, saya mungkin telah menemukan solusi untuk Anda :)

manis!

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);
}

Jadi, hal di atas berfungsi untuk saya ios8 dan ios9. Catatan, ketika Anda memanggil 'makeVideoPlayableInline', Anda memberikan 'false'. Ini untuk mengatakan bahwa video tidak memiliki suara. Ini adalah satu-satunya cara saya bisa bekerja sebaris dengan PIXI dengan polyfill pihak ketiga ini. Semoga itu adalah trade off yang dapat diterima untuk Anda!

Saya pikir kuncinya mungkin video tidak memiliki audio sama sekali. Saya menyediakan palsu tetapi video memiliki trek audio. Saya hanya menggunakan video uji yang memiliki audio. Video sebenarnya untuk aplikasi yang kami buat tidak akan ada. Biarkan saya mencoba pengkodean ulang dan saya akan melaporkan kembali.

Dalam pengujian saya dengan banyak video, tidak masalah apakah video tersebut memiliki audio di dalamnya atau tidak. Dengan meneruskan 'false' ke 'makeVideoPlayableInline', video akan diputar sebaris.

benar saya lewat palsu. tapi saya membungkus video di tempat lain.

Ini adalah komponen video saya _Warning_ React.
https://Gist.github.com/pr1ntr/8511ede7068eac180f515a18ddf75a89#file -connectvideo-js-L52
Di sinilah ia menjalankan polyfill sebaris (baris 52)
Baris 60 memanggil fungsi siap yang memberitahu induknya untuk merender PixiVideoWrapper
Ini dia di sini:
https://Gist.github.com/pr1ntr/57032704841e471c3a145308072f3ee2#file -game-js-L37

Kemudian setelah PixiVideoWrapper dipasang, ia melakukan semua hal untuk membuat tekstur video berjalan:
https://Gist.github.com/pr1ntr/3a44f327406d5d5a97824c47d6194484#file -pixivideowrapper-js-L118

Jadi di Game.js jika pengguna telah mengetuknya, itu akan memberi tahu video untuk diputar di PixiVideoWrapper baris 81 melalui baris 121 componentWillReceiveProps .

Jika saya menghapus display:none saya dapat melihat pemutaran video sebaris.

apakah Anda juga menggunakan #dev terbaru?

ya

Apa pun sebelum dev terbaru memiliki masalah saat memuat tekstur video dasar atau tidak mengandung tag sebaris untuk video yang diperlukan ios10

ok jadi contoh Anda bekerja untuk saya. Tapi di mana video di DOM? juga apa tombol ini disebut HOOK DIV? Ini aneh. Mengapa ada bedanya jika video sudah ada di halaman?

Saat membuat tekstur video dasar, jika sumbernya adalah video langsung, itu akan membuat tag video html itu sendiri. Mungkin disinilah letak perbedaannya. Lihatlah kode sumber untuk melihat apakah ada pendengar acara yang disiapkan secara berbeda? Tidak akan memiliki akses ke perangkat ios hingga Kamis untuk bermain dengan ini lagi, saya khawatir

apakah Anda menguji di simulator?

Tidak, saya sedang menguji pada perangkat nyata.

Hai
Saya melakukan tes dasar untuk melihat apakah menyediakan elemen video Anda sendiri akan berhasil. Itu tidak di ios9, contoh ketika Anda memberikan sumber sebagai string tidak berfungsi.

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);
}

Saya tidak dapat menemukan perbedaan dalam sumber PIXI. Saya pikir saya akan gila.

Satu-satunya hal yang saya lihat berbeda adalah jika Anda membiarkan PIXI membuat tag videonya sendiri dari url string, itu juga memanggil
video.load();
Coba itu setelah
video.appendChild(src);

luar biasa! yang benar-benar memperbaikinya. fml. Terima kasih.

Utas ini telah dikunci secara otomatis karena tidak ada aktivitas terbaru setelah ditutup. Silakan buka edisi baru untuk bug terkait.