Как сделать видео вписывающимся в React Native? - PullRequest
Новая
       9

Как сделать видео вписывающимся в React Native?

0 голосов
/ 29 января 2019

Я использую react-native-video

<View style={styles.videoView}>
     <Video 
         source={{ uri: strings.sourceUri+"posts/"+this.state.videoSrc }} 
         ref={(ref) => { this.player = ref }}           
         repeat={true}
         resizeMode="contain"                    
         style={styles.videoStyle}
     />
</View>

Стили 

videoView: {
  justifyContent:'center', 
  alignItems: 'center', 
  flex: 1,
  flexDirection: 'column',
},
videoStyle: {
  position: 'absolute',
  top: 0,
  left: 0,
  bottom: 0,
  right: 0,
},

Итак, я загружаю видео из API.И я хочу показать это в моем плоском списке.Но видео или становится маленьким, если я использую resizeMode="contain", или размер становится больше, если я использую resizeMode="cover".Может кто-нибудь, пожалуйста, скажите мне, как я могу масштабировать моего видео, чтобы оно вписывалось в вид.

Я использую react-native-camera.Пожалуйста, помогите мне, я застрял на нем со вчерашнего дня.

1 Ответ

0 голосов
/ 29 января 2019

Вы можете попробовать следующую настройку: может помочь определение высоты видео относительно родительского вида. 

videoView: {
    flex: 1,
    flexDirection: 'column',
    justifyContent: 'center',
    alignItems: 'center',
},
videoStyle: {
    alignSelf: 'center',
    height: '80%',
    resizeMode: 'contain'
    },

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

РЕДАКТИРОВАТЬ: , так как я пока не могу отвечать на комментарии.Проверьте эту подробную статью об использовании видео с реагировать родной.Это очень подробная информация.https://medium.com/quick-code/react-native-video-component-68262bcbc21f

...