react-native-af-video-player icon indicating copy to clipboard operation
react-native-af-video-player copied to clipboard

Video goes off its intended screen area

Open hossamnasser938 opened this issue 5 years ago • 1 comments

  • [x] react-native-af-video-player version: ^0.2.1

  • [x] React Native version: 0.59.8

  • [x] OS: Mac. Building for IOS

  • [x] Has this issue already been raised? No

  • [x] Have you clearly read and understood the Readme? Yes

  • [x] Code and explanation to replicate this issue: I 'm trying to render a video within a Post component that is rendered in a FlatList. I have followed the basic example and I'm getting the video goes off of the area it should be rendered in. Here is my Video component.

import React, { PureComponent } from 'react';
import { View } from 'react-native';
import Video from 'react-native-af-video-player';
import PropTypes from 'prop-types';
import { POST_FILES_URL_PATH } from '../../../utils/constants';

export default class PostVideo extends PureComponent {
    static propTypes = {
        video: PropTypes.object.isRequired
    };

    render() {
        const { video } = this.props;

        return(
            <Video 
              url = { POST_FILES_URL_PATH +  video.url }
              style = { {height: 250, width: 250} }
            />
        );
    }
}

I also tried to render the Video inside a View like this but also experiencing the same issue.

render() {
        const { video } = this.props;

        return(
            <View style ={{height: 250, width: 250}}>
                <Video 
                  url = { POST_FILES_URL_PATH +  video.url }
                />
            </View>
        );
    }

Also tried giving the video flex: 1 like this:

render() {
        const { video } = this.props;

        return(
            <View style ={{height: 250, width: 250}}>
                <Video 
                  url = { POST_FILES_URL_PATH +  video.url }
                  style = { {flex: 1} }
                />
            </View>
        );
    }
  • [x] Are there any console logs? No

  • [x] Include Screeshots / Video: Screen Shot 2019-09-10 at 6 59 27 PM

hossamnasser938 avatar Sep 10 '19 17:09 hossamnasser938

I guess that the default value of resizeMode which is contain does not work for some reason. It does not work even if I passed it explicitly rather than depending on the default value.

hossamnasser938 avatar Sep 11 '19 08:09 hossamnasser938