Expo ReactNative Project中视频ResizeMode属性没有调整视频大小我正在使用expo-av包显示视频

a8jjtwal 于 2022-12-04 发布在 React

关注(0)|答案(1)|浏览(139)

顺便说一句，这是用于Web开发的，而不是用于iOS或Android
这就是我的观点

<View style={styles.fullView}>
   <Video shouldPlay isLooping resizeMode="cover" source={require("./res/bg.mp4")} style={{flex: 1}}/>     
</View>

这是我的样式表

fullView: {
    flex: 1,
  },

  container: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },

  heading: {
    color: 'white',
    marginBottom: 100,
    fontSize: 35,
  },

  input: {
    padding: 6,
    fontSize: 16,
    width: 200,
    textAlign: 'center',
    color: 'white',
  },

  bgcolor: {
    backgroundColor: '#33373861',
    borderRadius: 15,
    margin: 10,
  },

  button: {
    alignItems: 'center',
    backgroundColor: '#FBC1F0',
    margin: 30,
    borderRadius: 15,
    padding: 10,
    height: 45,
    width: 200,
  },

  image: {
    flex: 1,

  }

我得到的是

我需要的是整个视频在屏幕上

我试过使用resizeMode与封面，包含，伸展，重复没有一个工作
就像resizeMode本身无法识别一样。
但当我在样式表中更改高度和宽度时，视频帧会调整大小但视频不会
视频分辨率为3840 x 2160。
我希望它将视频大小调整为屏幕大小或进行相应调整
先谢谢你了。

react-native

来源：https://stackoverflow.com/questions/74123932/resizemode-prop-for-video-in-expo-reactnative-project-is-not-resizing-my-video

1条答案

按热度按时间

1qczuiv01#

我发现这种情况只发生在Web上，因为Video html元素是绝对位置。
如果您在onReadyForDisplay函数中添加以下行，它将修复此问题：

import { Video } from 'expo-av';

<Video
  style={styles.video}
  source={{
    uri: 'http://path/to/file',
  }}
  useNativeControls={true}
  resizeMode="contain"
  onReadyForDisplay={videoData => {
    videoData.path[0].style.position = "initial"
  }}
/>

赞(0）回复(0）举报 2022-12-04

我来回答

Expo ReactNative Project中视频ResizeMode属性没有调整视频大小我正在使用expo-av包显示视频

1条答案

相关问题

热门标签

最新问答