react-native-rn-videoplayer icon indicating copy to clipboard operation
react-native-rn-videoplayer copied to clipboard

如果能在加个播放速率,那就简直完美了

Open wulaizi opened this issue 5 years ago • 8 comments

这个组件非常符合我的需求 1、就是差个播放速率(像短视频可能不需要),像教学课程这种一般学生都喜欢快进的看 (可能会面临大家的播放速率不一样 0.7 ,1, 1.5 ,2这种 ) 2、还有个是vip展示页 有的需求是播放到几分钟(只免费几分钟) 就要求停止播放了 要求开通会员 (作者好像在里面有实现,只是把那个组件删了,其实可以提供一个自定义方法 方便自定义布局) {(showOpenVip && this.props.VIPCONTS) ? this.props?.showNoVipView() : null } 还有一种是播放视频个数,比如用户 一天只能免费3个视频 这一天就只能显示那个开通会员的页面了,和上面的有点不一样,上面的是播放中,后者是一开始就不给播放 只是展示个自定义界面。 作者真是用心了

wulaizi avatar Nov 18 '20 07:11 wulaizi

你这些需求其实我在做项目的时候都考虑到了的; 我也是自己的项目需要播放器,做着做着发现一个播放器的代码量比较大,我才搞了个包,方便以后使用;

1,2我不忙了给搞出来吧 最近在学习flutter;

视频播放个数限制那个很简单,我的app也有这个功能,当播放次数已用完,可以不显示video组件,给一个图放那,图上左上角放一个返回按钮,我就是这样做的,至于图的大小,你可以看我这个视频分辨率大小来设置

A-ANing avatar Nov 18 '20 08:11 A-ANing

你这些需求其实我在做项目的时候都考虑到了的; 我也是自己的项目需要播放器,做着做着发现一个播放器的代码量比较大,我才搞了个包,方便以后使用;

1,2我不忙了给搞出来吧 最近在学习flutter;

视频播放个数限制那个很简单,我的app也有这个功能,当播放次数已用完,可以不显示video组件,给一个图放那,图上左上角放一个返回按钮,我就是这样做的,至于图的大小,你可以看我这个视频分辨率大小来设置

嗯 图片哪个我这边解决了,播放速率,我之前的播放器是有的,项目上线了也很久了,这次是重构,看到播放器代码很多,所以还是打算找一个,你的封装就非常的符合我的需求,这样省去了很多的代码,这边打算把你的fork一个,加个播放速率

wulaizi avatar Nov 18 '20 08:11 wulaizi

可以,我这边代码质量不行,勉强看下,赶项目进度,业余时间少,又没mac,只能在公司的时候写一写

A-ANing avatar Nov 18 '20 09:11 A-ANing

需要这样的功能+1

orzhtml avatar Dec 22 '20 08:12 orzhtml

可以,我这边代码质量不行,勉强看下,赶项目进度,业余时间少,又没mac,只能在公司的时候写一写

需要这样的功能+1

这个需求我做了的 其实作者已经起了个好头 哪个视频 选集 就已经给 播放速率给出了方案 模仿着 加一个遮罩即可 选择的速率赋值给播放器即可

wulaizi avatar Dec 22 '20 08:12 wulaizi

@wulaizi pr一波? 我又忙起来了 在做一个rn项目

A-ANing avatar Dec 22 '20 08:12 A-ANing

@wulaizi pr一波? 我又忙起来了 在做一个rn项目 我把依赖拉倒本地了 不好推过来 我用的自己的组件 在 renderAllSeenList 下面添加 { this.state.showVideoRateModal ? <RateModal {...this.state} ref={(ref) => this.RateModalRef = ref} callBack={(videoRate: any) => { this.setState({ videoRate }) }} /> : null } 在 RNVideoPlayerComponent里面加个类 `export class RateModal extends Component { constructor(props) { super(props) this.state = { currentSelected: this.props.videoRate || 1 } } render() { const { callBack } = this.props; const SPEED_OPTIONS = [ { title: '0.7X', value: 0.7 }, { title: '1.0X', value: 1 }, { title: '1.5X', value: 1.5 }, { title: '2.0X', value: 2 }] return (<View style={{ width: deviceHeight / 4, backgroundColor: 'rgba(0,0,0,.6)', position: "absolute", top: 0, bottom: 0, right: 0, paddingHorizontal: 30, }}

    >
        {
            SPEED_OPTIONS.map(item => (
                <Row center fill key={item?.title} onPress={() => {
                    this.setState({
                        currentSelected: item?.value
                    }, () => {
                        callBack && callBack(item.value)
                    })
                }}>
                    <Label
                        fontSize={18}
                        type={item.value == this.state?.currentSelected ? "orange" : "white"}>
                        {item.title}
                    </Label>
                </Row>)
            )
        }
    </View >)
}

}` 把选中的数据传出去 赋值 给video 加个 rate={this.state.videoRate} 没有仔细测试过,不知道有没有问题 其他的 涉及到关闭 功能栏哪些 和 showChangeList 他的即可

wulaizi avatar Dec 22 '20 09:12 wulaizi

v2.2.10 新增了 长按左右两边 快进 快退 返回按钮旁边展示视频名称等

A-ANing avatar Jan 07 '21 10:01 A-ANing