Теперь, когда я просмотрел список проблем, похоже ли это на # 3078?

3066, я думаю, более точен.

для записи, которую я использую (https://github.com/bfred-it/iphone-inline-video), чтобы заставить видео воспроизводиться самостоятельно на ios 9. Это работает, однако videoTexture, похоже, не отображает рамки на ios9. Эта библиотека создает запрос кадра анимации и проходит через видео кадр за кадром.

Хм, интересно. Для меня это непросто, так как у меня нет устройства iOS. Надеюсь, что кто-нибудь из других разработчиков скоро выбьет это из строя!

@ pr1ntr В предыдущей теме я описал, как ios9 и ниже не могут воспроизводить видео без перехода в полноэкранный режим. Это часть того, как их разработала Apple.

Теперь есть эта сторонняя библиотека polyfill, которая проделывает несколько хитроумных махинаций, чтобы на самом деле разрешить такое поведение. Я считаю, что это выходит за рамки PIXI, поэтому я не видел, чтобы это когда-либо было включено в сам PIXI.

Но .... Я окружил себя айфонами разных версий и буду играть с этой библиотекой. Я вернусь к вам с любыми выводами :)

Привет, спасибо за расследование. Я обнаружил, что обновление текстуры не обновляется, если видео запускает свои события как обычно. Этот полифилл, который я использую, должен запускать все события в обычном режиме, у него просто есть собственный тик voodoo requestAnimationFrame чтобы продвигать видео. При использовании только с тегом <video> он действительно работает нормально.

Я думаю, что ошибка не в том, что он работает в полноэкранном режиме, а в том, что он не слышит события таким же образом. Я пытался исследовать источник, но у меня не было так много времени и / или системы отсчета.

Я могу попробовать сделать пример кода, чтобы продемонстрировать это поведение. это было бы полезно?

Если вы продержитесь еще несколько минут, я, возможно, нашел для вас решение :)

сладкий!

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

Итак, вышеизложенное работает для меня ios8 и ios9. Обратите внимание: когда вы вызываете makeVideoPlayableInline, вы указываете false. Это означает, что в видео нет звука. Это единственный способ получить встроенную работу с PIXI с помощью этого стороннего полифилла. Надеюсь, это приемлемый компромисс для вас!

Я думаю, что ключевым моментом может быть видео, в котором вообще нет звука. Я указывал ложь, но на видео есть звуковая дорожка. Я просто использовал тестовое видео со звуком. На самом видео для приложения, которое мы делаем, не будет. Дайте мне попробовать перекодировать, и я отчитаюсь.

В моих тестах с несколькими видео не имеет значения, есть ли в видео звук или нет. Если передать 'false' в 'makeVideoPlayableInline', видео будет воспроизводиться встроенным.

правильно, я пропускаю ложь. но я заворачиваю видео в другое место.

Это мой видеокомпонент _Warning_ React.
https://gist.github.com/pr1ntr/8511ede7068eac180f515a18ddf75a89#file -connectvideo-js-L52
Здесь запускается встроенный полифилл (строка 52)
Строка 60 вызывает готовую функцию, которая сообщает своему родительскому элементу визуализировать PixiVideoWrapper
Это здесь:
https://gist.github.com/pr1ntr/57032704841e471c3a145308072f3ee2#file -game-js-L37

Затем, как только PixiVideoWrapper монтируется, он делает все необходимое для работы с видеотекстурой:
https://gist.github.com/pr1ntr/3a44f327406d5d5a97824c47d6194484#file -pixivideowrapper-js-L118

Таким образом, в Game.js, если пользователь нажал, он должен указать видео для воспроизведения в строке 81 PixiVideoWrapper через строку 121 componentWillReceiveProps .

Если я удалю display:none я смогу увидеть встроенное воспроизведение видео.

также вы используете последнюю версию #dev?

Yeps

Все, что до последнего разработчика, либо имеет проблемы с загрузкой базовых видеотекстур, либо не содержит встроенного тега для видео, который требуется ios10.

хорошо, так что ваш пример работает для меня. Но где видео в DOM? также что эта кнопка называется HOOK DIV? Это странно. Какая разница, если видео уже существует на странице?

При создании базовой видеотекстуры, если источником является прямое видео, он сам создаст тег видео html. Возможно, в этом разница. Взгляните на исходный код, чтобы узнать, настроены ли какие-либо прослушиватели событий по-другому? У меня не будет доступа к устройствам ios до четверга, чтобы снова поиграть с этим, боюсь

ты тестируешь в симуляторе?

Нет, тестировал на реальных устройствах.

Привет
Я провел базовый тест, чтобы убедиться, что создание собственного видеоэлемента будет работать. Этого не было на ios9, пример, когда вы предоставили источник в виде строки, работает.

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

Я не смог найти разницы в исходном коде PIXI. Я думаю, что схожу с ума.

Единственное, что я вижу по-другому, - это то, что если вы позволите PIXI создать собственный тег видео из строкового URL-адреса, он также вызовет
video.load();
Попробуйте это сразу после
video.appendChild(src);

омфг невероятно! это полностью исправляет. fml. Спасибо.

Этот поток был автоматически заблокирован, поскольку после его закрытия в последнее время не было никаких действий. Пожалуйста, откройте новую проблему для связанных ошибок.