美文网首页程序员
react native video player (一)

react native video player (一)

作者: reedthinking | 来源:发表于2017-06-13 16:58 被阅读0次

使用react-native-video库做一个react native的视频播放器。

首先是接入react-native-video库

npm i -S react-native-video
react-native link

然后在一个组件中将它跑起来

import React from 'react';
import {View} from 'react-native';
import styles from '../sytles/demostyle';
import Video from 'react-native-video';

export default class PlayerScreen extends React.Component {

    video;

    render() {
        return (
            <View style={styles.container}>
                <Video
                    ref={(ref) => {
                    this.video = ref
                }}
                    //来自本地的MP4视频
                    source={require('../../assets/dcw.mp4')}
                    //1.0表示默认速率
                    rate={1.0}
                    //图片等比例缩放
                    resizeMode='contain'
                    //不重复播放
                    repeat={false}
                    //默认音量
                    volume={1.0}
                    //样式
                    style={styles.backgroundVideo}/>
            </View>
        );
    }
}

效果如下

image.png

相关文章

网友评论

    本文标题:react native video player (一)

    本文链接:https://www.haomeiwen.com/subject/klzdqxtx.html