Android 如何在视频播放器中使用手机的底部空间？

我使用的是react native视频播放器，当它设置为全屏时，它的设置为全屏，但底部菜单显示黑色空间，该空间不用于视频播放器，如何在视频播放器中使用该空间

视频播放器视图设计

<View style={customStyles.videoWrapper}>
        {
            video.uri !== '' ?
                <Video
                    {...props}
                    style={[
                        styles.video,
                        this.getSizeStyles(),
                        style,
                        customStyles.video,
                    ]}
                    ref={p => {
                        this.player = p;
                    }}
                    muted={this.props.muted || this.state.isMuted}
                    paused={this.props.paused
                        ? this.props.paused || !this.state.isPlaying
                        : !this.state.isPlaying}
                    fullscreenOrientation={"all"}
                    onProgress={this.onProgress}
                    onEnd={this.onEnd}
                    onBuffer={this.onBuffer}
                    onLoad={this.onLoad}
                    source={video}
                    fullscreen={this.state.isFullscreen}
                    resizeMode={resizeMode}
                    rate={this.props.rate}
                /> :
                <View style={[this.getSizeStyles(), {backgroundColor: '#000'}]}/>
        }

        <View
            style={[
                this.getSizeStyles(),
                {marginTop: -this.getSizeStyles().height}
            ]}
        >
            <TouchableOpacity
                style={styles.overlayButton}
                onPress={() => {
                    this.showControls();
                    if (pauseOnPress)
                        this.onPlayPress();
                }}
                onLongPress={() => {
                    if (fullScreenOnLongPress && Platform.OS !== 'android')
                        this.onToggleFullScreen();
                }}
            />
            {this.state.isBuffering ? this.renderBuffer() :
                (this.state.isControlsVisible)
                    ? this.renderControls() : null}
        </View>

    </View>

这里的getStyle函数设置它的高度和宽度以及比率

getSizeStyles() {
    const {videoWidth, videoHeight} = this.props;
    const {width} = this.state;
    const ratio = videoHeight / videoWidth;

    if (this.state.isFullscreen) {
        return {
            width: Dimensions.get('window').width,
            height: Dimensions.get('window').height,
        }
    }

    return {
        height: width * ratio,
        width,
    };
}

我有创建全屏功能的方向，它将在方向改变时

onToggleFullScreen() {
console.log("PixelRatio ",PixelRatio.startDetecting)
if (this.props.onFullscreen) {
    this.props.onFullscreen(!this.state.isFullscreen);
}

this.state.isFullscreen ? Orientation.lockToPortrait() : Orientation.lockToLandscapeLeft();

if (this.player !== null) {
    this.player.presentFullscreenPlayer();
}

if (Platform.OS === 'android') {
    this.onAndroidFullScreenToggle();
}
this.setState({
    isFullscreen: !this.state.isFullscreen
});

---

}

代码在哪里？代码片段在哪里？@NishargShah请现在检查。请在codesandbox中创建代码片段/演示

onToggleFullScreen() {
console.log("PixelRatio ",PixelRatio.startDetecting)
if (this.props.onFullscreen) {
    this.props.onFullscreen(!this.state.isFullscreen);
}

this.state.isFullscreen ? Orientation.lockToPortrait() : Orientation.lockToLandscapeLeft();

if (this.player !== null) {
    this.player.presentFullscreenPlayer();
}

if (Platform.OS === 'android') {
    this.onAndroidFullScreenToggle();
}
this.setState({
    isFullscreen: !this.state.isFullscreen
});