ios - React Native - 如何防止 IOS 中的全屏视频模式？

Question

我正在为 IOS 使用 react native 创建一个简单的视频应用程序。但问题是，当我播放视频时，视频以全屏模式播放，即使我将属性 allowsInlineMediaPlayback 设置为 true 但仍然没有任何印象。谁能告诉我们为什么使用 allowsInlineMediaPlayback 属性以及如何在 IOS 中启用内联视频模式？

即使我也将 webkit-playsinline 属性添加到 HTML video 标签中，但它在 react native 上有记录(如下所示) > 网站，但仍然无法正常工作。

NOTE:

In order for video to play inline, not only does this property need tobe set to true, but the video element in the HTML document must alsoinclude the webkit-playsinline attribute.

请查看以下链接:

• Documentation Reference For WebView.allowsInlineMediaPlayback .

• Working Source Code .

谢谢!!!

Answer 1

只需从 webkit-playsinline 中删除 webkit 前缀，因为不再需要也不支持 webkit 前缀。

以下是您在问题中共享的代码的正确和修改后的代码片段:

import React, { Component } from 'react';
import { WebView, View } from 'react-native';

export default class MyVideoApp extends React.Component{
    render(){
        return(
            <View style={{
                flex: 1,
                flexDirection: 'column',
                justifyContent: 'center',
                alignItems: 'center'
            }}>
                <WebView
                source={{
                    html: '<video playsinline controls autoplay src="https://www.w3schools.com/html/mov_bbb.mp4" ></video>'
                }}
        useWebKit={true}
                originWhitelist={['*']}
                allowsInlineMediaPlayback={true}
                style={{
                    height: 600,
                    width: 400,
                }}/>
            </View>
        );
    }
}