a-aning / react-native-rn-videoplayer Goto Github PK
View Code? Open in Web Editor NEW基于react-native-video的视频播放器(上下滑动改变音量屏幕亮度,缓冲进度,双击暂停等ios Android)
基于react-native-video的视频播放器(上下滑动改变音量屏幕亮度,缓冲进度,双击暂停等ios Android)
播放正常,拖动进度条的时候。崩溃并抛出下面提示信息,滑动屏幕视频进度并没有改变,声音亮度也没有变化
Invariant Violation: [6559,"RCTView",{"width":"<>"}] is not usable as a native method argument
is:issue is:open 当全屏播放时候,左上角的“<”返回按钮退出不了 全屏,也后退不了,是否可以加一个OnBigBack的回调呢?或许自动退出全屏也行呀
WARNING: Configuration 'compile' is obsolete and has been replaced with 'implementation' and 'api'.
It will be removed in version 5.0 of the Android Gradle plugin.
For more information, see http://d.android.com/r/tools/update-dependency-configurations.html.
<=======------> 60% CONFIGURING [7m 8s]
<=======------> 60% CONFIGURING [7m 9s]e dependencies of :react-native-rn-videoplayer:classpath
<=======------> 60% CONFIGURING [7m 51s]
这个组件非常符合我的需求
1、就是差个播放速率(像短视频可能不需要),像教学课程这种一般学生都喜欢快进的看 (可能会面临大家的播放速率不一样 0.7 ,1, 1.5 ,2这种 )
2、还有个是vip展示页 有的需求是播放到几分钟(只免费几分钟) 就要求停止播放了 要求开通会员 (作者好像在里面有实现,只是把那个组件删了,其实可以提供一个自定义方法 方便自定义布局)
{(showOpenVip && this.props.VIPCONTS) ?
this.props?.showNoVipView() : null }
还有一种是播放视频个数,比如用户 一天只能免费3个视频 这一天就只能显示那个开通会员的页面了,和上面的有点不一样,上面的是播放中,后者是一开始就不给播放 只是展示个自定义界面。
作者真是用心了
可能是因为我之前装了react-native-orientation
把react-native-orientation-lock删掉换成react-native-orientation即可解决
1:视频全屏后,手势,播放按钮,进度条异常
2:增加场景:播放地址在点击播放后后才获取并且才开始播放
3:在场景2的情况下没有url的情况进度条手势必须失效,点击播放获取播放地址后才重新生效
其他问题都解决了,现在又出现新问题了。如图
https://imgchr.com/i/aOWGJH
比如当从第1集播放开始,点击切换到第3集后,当第3集还在加载中时,进度条、时间、总时长还是第1集的状态。
切换url,需要初始化播放状态(进度条,播放进度、时间、总时长)
安卓加载时尺寸是对的,播放时尺寸就不对了
全屏时,视频是侧过来了,实际上视频的宽高并没有改变,导致了横过来时时依然是小屏幕播放,只是横着的
react-native": "0.62.2无法链接这个库,直接报错找不到
Invariant Violation: [973,"RCTView",{"width":"<>"}] is not usable as a native method argument
可以提供隐藏视频左上角返回的属性吗
求助,为啥全屏后点击 退出全屏的icon没有反应,日志显示
unknown:ReactNative: Got DOWN touch before receiving UP or CANCEL from last gesture
好容易安装完了,调用直接GG
import Videoplayer from 'react-native-rn-videoplayer';
export default ({ navigation }) => {
return (
<>
<StatusBar barStyle="dark-content" hidden={false} />
<SafeAreaView>
<ScrollView
contentInsetAdjustmentBehavior="automatic"
style={styles.scrollView}>
<View style={styles.body}>
<Text style={styles.sectionTitle}>Step One</Text>
<Button
title="Jump to Video"
onPress={() => navigation.navigate('Video')}
/>
<VideoPlayer
url="https://jingdian.qincai-zuida.com/20200609/8136_0462c8a7/index.m3u8"
/>
</View>
</ScrollView>
</SafeAreaView>
</>
);
}
您好,我是原安卓原生开发了解不是很多,在yarn add react-native-rn-videoplayer加入包手,
yarn android出现以下编译错误,我了解到应该是访问编译相关的远程文件报错了,但不知道用什么办法去解决。谢谢。
FAILURE: Build failed with an exception.
Could not resolve all artifacts for configuration ':react-native-rn-videoplayer:classpath'.
Could not resolve com.android.tools.build:gradle:3.3.1.
Required by:
project :react-native-rn-videoplayer
> Could not resolve com.android.tools.build:gradle:3.3.1.
> Could not get resource 'https://jcenter.bintray.com/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'.
> Could not GET 'https://jcenter.bintray.com/com/android/tools/build/gradle/3.3.1/gradle-3.3.1.pom'. Received status code 502 from server: Bad Gateway
当导航返回手势的滑动宽度值比较大时,左右滑动视频区域手势转换成返回上一页手势效果;
导航:react-navigation
gestureResponseDistance: { horizontal: Dimensions.get('window').width };//手势返回滑动区域为屏幕宽度
Hi This library is awesome,
The only problem is i am not able to turn player into the full screen. when i am clicking on full-screen icon..
the screen is not rotating to Landscape.
even tried manually
Here is what i tried so far
const onEnterFullscreen =async () => {
if (Platform.OS === "android") {
RNOrientation.lockToLandscape()
} else {
//Orientation.lockToLandscapeRight()
await Orientation.lockToLandscape();
}
}
const onExitFullscreen = () => {
if (Platform.OS === "android") {
RNOrientation.lockToPortrait();
RNOrientation.unlockAllOrientations()
} else {
Orientation.lockToPortrait();
Orientation.unlockAllOrientations()
}
}
"react-native": "0.63.2",
中
会报错:
null is not an object (evaluating 'event.nativeEvent.pageX)
因为
onLongPress={this.speedLongTouch}
onPressOut={this.speedLongTouchOut}
var speedStartX = evt.nativeEvent.pageX
中的nativeEvent不存在。
官方文档:
https://reactnative.dev/docs/pressevent
example:
{
changedTouches: [PressEvent],
identifier: 1,
locationX: 8,
locationY: 4.5,
pageX: 24,
pageY: 49.5,
target: 1127,
timestamp: 85131876.58868201,
touches: []
}
不需要nativeEvent吧。直接pageX就行。我理解没错吧
update this on gradle
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation 'com.android.support:appcompat-v7:1.3.0'
implementation 'com.facebook.react:react-native:+'
请问下可以提供下demo吗?万分感谢!导入后报错
Error: Requiring module "node_modules/react-native-rn-videoplayer/index.js", which threw an exception: Invariant Violation: Native module cannot be null.
我又来了。。
在ScrollScoView中嵌套使用,点击全屏后,
全屏模式下手势、进度条控制失效了,上下滑动时ScrollScoView优先响应了,造成了页面的上下滚动
我是个小白,个人猜测是,是否在全屏模式中,video的手势响应优先级应该高于ScrollScoView?
autolink不会自动依赖其他的第三方库
react-native-community/cli#1347
rn版本:0.61.5
集成到IOS成功了,但加上
import VideoPlayer from 'react-native-rn-videoplayer';时就会报错Native module cannot be null.
请问这个问题有解决办法吗?
if (this.url && this.url != this.props.url) { this.onchangeUrl() }
切换视频时报错,最后排查得到onchangeUrl 这个方法里面带有this.setState
而onchangeUrl 的调用位置却是在render处 这样会到导致死循环
大佬要判断地址是否和上一次的一样 可以在生命周期componentDidUpdate 里完成哦
v2.2.5 已增加
版本信息:
"react-native": "0.63.3",
"react-native-rn-videoplayer": "^2.2.9",
已参考https://github.com/A-ANing/react-native-rn-videoplayer/issues/11#issuecomment-719136928
将react-native-rn-videoplayer中dependencies依赖手动添加到项目package.json
启动后发现视频在Android设备中无法全屏,
参考https://github.com/react-native-video/react-native-video/issues/2046 修改settings.gradle后,项目启动报错
报错日志:
> Task :app:mergeDexDebug FAILED
Deprecated Gradle features were used in this build, making it incompatible with Gradle 7.0.
Use '--warning-mode all' to show the individual deprecation warnings.
See https://docs.gradle.org/6.2/userguide/command_line_interface.html#sec:command_line_warnings
272 actionable tasks: 2 executed, 270 up-to-date
D8: Cannot fit requested classes in a single dex file (# fields: 68274 > 65536)
com.android.builder.dexing.DexArchiveMergerException: Error while merging dex archives:
The number of method references in a .dex file cannot exceed 64K.
Learn how to resolve this issue at https://developer.android.com/tools/building/multidex.html
at com.android.builder.dexing.D8DexArchiveMerger.getExceptionToRethrow(D8DexArchiveMerger.java:131)
at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:118)
at com.android.build.gradle.internal.transforms.DexMergerTransformCallable.call(DexMergerTransformCallable.java:102)
at com.android.build.gradle.internal.tasks.DexMergingTaskRunnable.run(DexMergingTask.kt:444)
at com.android.build.gradle.internal.tasks.Workers$ActionFacade.run(Workers.kt:335)
at org.gradle.workers.internal.AdapterWorkAction.execute(AdapterWorkAction.java:57)
at org.gradle.workers.internal.DefaultWorkerServer.execute(DefaultWorkerServer.java:63)
at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1.create(NoIsolationWorkerFactory.java:66)
at org.gradle.workers.internal.NoIsolationWorkerFactory$1$1.create(NoIsolationWorkerFactory.java:62)
at org.gradle.internal.classloader.ClassLoaderUtils.executeInClassloader(ClassLoaderUtils.java:98)
at org.gradle.workers.internal.NoIsolationWorkerFactory$1.lambda$execute$0(NoIsolationWorkerFactory.java:62)
at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:44)
at org.gradle.workers.internal.AbstractWorker$1.call(AbstractWorker.java:41)
at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:416)
at org.gradle.internal.operations.DefaultBuildOperationExecutor$CallableBuildOperationWorker.execute(DefaultBuildOperationExecutor.java:406)
at org.gradle.internal.operations.DefaultBuildOperationExecutor$1.execute(DefaultBuildOperationExecutor.java:165)
at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:250)
at org.gradle.internal.operations.DefaultBuildOperationExecutor.execute(DefaultBuildOperationExecutor.java:158)
at org.gradle.internal.operations.DefaultBuildOperationExecutor.call(DefaultBuildOperationExecutor.java:102)
at org.gradle.internal.operations.DelegatingBuildOperationExecutor.call(DelegatingBuildOperationExecutor.java:36)
at org.gradle.workers.internal.AbstractWorker.executeWrappedInBuildOperation(AbstractWorker.java:41)
at org.gradle.workers.internal.NoIsolationWorkerFactory$1.execute(NoIsolationWorkerFactory.java:59)
at org.gradle.workers.internal.DefaultWorkerExecutor.lambda$submitWork$2(DefaultWorkerExecutor.java:198)
at java.util.concurrent.FutureTask.run(FutureTask.java:266)
at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runExecution(DefaultConditionalExecutionQueue.java:215)
at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.runBatch(DefaultConditionalExecutionQueue.java:164)
at org.gradle.internal.work.DefaultConditionalExecutionQueue$ExecutionRunner.run(DefaultConditionalExecutionQueue.java:131)
at java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:511)
at java.util.concurrent.FutureTask.run(FutureTask.java:266)
at org.gradle.internal.concurrent.ExecutorPolicy$CatchAndRecordFailures.onExecute(ExecutorPolicy.java:64)
at org.gradle.internal.concurrent.ManagedExecutorImpl$1.run(ManagedExecutorImpl.java:48)
at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)
at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)
at org.gradle.internal.concurrent.ThreadFactoryImpl$ManagedThreadRunnable.run(ThreadFactoryImpl.java:56)
at java.lang.Thread.run(Thread.java:748)
Caused by: com.android.tools.r8.CompilationFailedException: Compilation failed to complete
at com.android.tools.r8.utils.t.a(:55)
at com.android.tools.r8.D8.run(:11)
at com.android.builder.dexing.D8DexArchiveMerger.mergeDexArchives(D8DexArchiveMerger.java:116)
... 33 more
Caused by: com.android.tools.r8.utils.AbortException: Error: null, Cannot fit requested classes in a single dex file (# fields: 68274 > 65536)
at com.android.tools.r8.utils.Reporter.a(:21)
at com.android.tools.r8.utils.Reporter.a(:7)
at com.android.tools.r8.dex.VirtualFile.a(:33)
at com.android.tools.r8.dex.VirtualFile$h.a(:5)
at com.android.tools.r8.dex.ApplicationWriter.a(:13)
at com.android.tools.r8.dex.ApplicationWriter.write(:35)
at com.android.tools.r8.D8.d(:44)
at com.android.tools.r8.D8.b(:1)
at com.android.tools.r8.utils.t.a(:23)
... 35 more
FAILURE: Build failed with an exception.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.