在 react-native-video 中如何禁用搜索功能?

In react-native-video how can you disable the seek function?

我正在尝试禁用 React Native 视频的搜索功能。我有一个完整的视频,我想预览 30 秒。为此,我想禁用搜索按钮,这样用户就无法跳过视频。

我试过给 onSeek 退出视频播放器的功能值,但这似乎没有任何作用。

if(!loading) {
      return <Video source={{uri: uri}}   // Can be a URL or a local file.
        onFullscreenPlayerDidDismiss={this.onDismiss}
        preferredPeakBitrate={this.state.preferredPeakBitrate}
        ref={(player) => {
          if(!this.state.playing && player) {
            player.presentFullscreenPlayer()
            this.setState({ playing: true })
          }
        }}                                      // Store reference
        rate={1.0}                              // 0 is paused, 1 is normal.
        volume={1.0}                            // 0 is muted, 1 is normal.
        muted={false}                           // Mutes the audio entirely.
        paused={false}                          // Pauses playback entirely.
        resizeMode="cover"                      // Fill the whole screen at aspect ratio.*
        repeat={false}                           // Repeat forever.
        playInBackground={true}                // Audio continues to play when app entering background.
        playWhenInactive={true}                // [iOS] Video continues to play when control or notification center are shown.
        ignoreSilentSwitch={"ignore"}           // [iOS] ignore | obey - When 'ignore', audio will still play with the iOS hard silent switch set to silent. When 'obey', audio will toggle with the switch. When not specified, will inherit audio settings as usual.
        progressUpdateInterval={PROGRESS_MILLISECONDS} // [iOS] Interval to fire onProgress (default to ~250ms)
        onError={this.onVideoError}               // Callback when video cannot be loaded
        onProgress={this.onProgress}
        onLoadStart={this.onStart}
        onEnd={this.stopPlaybackPing}
       /> 
    } else {
      return <View />
    }
  }

简答:不,你不能。

您致电 presentFullscreenPlayer() 播放视频,遗憾的是,您无法禁用播放器上的任何按钮。因为如果你 运行 你的应用在 iPhone 上,那是 Apple 制作的默认播放器,而不是由 react-native-video 的创建者制作的,我不相信有任何 public API 允许你这样做。

但是,您可以编写自己的全屏播放器,其中包含您 want/don 不想要的任何按钮。这里有一些提示:

创建一个名为 CustomVideo 的自定义组件,它将视频的 url 作为道具:

// CustomVideo.js file
import React, { PureComponent } from 'react';
import { ... } from 'react-native';
import Video from 'react-native-video';

export class CustomVideo extends PureComponent {
    constructor(props) {
        super(props)
        this.state = {
            // Have any state you want here, for example
            paused: false,
            played: 0,
            duration: 0,
            isFullscreen: false
        }
    }

    render() {
        const { url } = this.props;
        const { paused, played, duration, isFullscreen } = this.state;

        return(
            <View style={{ ... }}>
                <Video
                    source={{ uri: url }}
                    ...
                />
                // =======> Here, you add your custom buttons <=======
                // Suppose you want a pause/play button
                <TouchableOpacity onPress={this.toggleVideo}>
                    <Text>{paused ? "Play" : "Pause"}</Text>
                </TouchableOpacity>
                // If you want a progress indicator, which users
                // can use to skip videos, then use `Slider` component
                <Slider
                    value={...}
                    step={...}
                    onValueChange={(value) => ...}
                />
                // Here, you toggle whether you want to play the video
                // in full screen mode, if so, render it in a modal
                // Also, add a full screen toggle button to the video
                // the same way you add a play/pause button
                <Modal visible={isFullscreen}>
                    <View>
                        <Video ... />
                    </View>
                </Modal>
            </View>
        );
    }
}

因此,下次当您想要渲染视频时,您可以调用 <CustomVideo url='https://....' /> 组件而不是调用 <Video source={{ uri: '...' }} />