无法在react本机视频中捕获屏幕截图

Question

react原生平台：

• iOS
• Android

问题：

我正试图捕捉屏幕。当视频暂停时。但每当我试图从视频中捕捉图像时。它发出的颤音无法捕捉到；

可能未经处理的拒绝承诺(id:25(：错误：内容大小不能为零或负数。得到：(0410(

库版本：

"react-native-video": "^5.1.0-alpha8",
"react-native-view-shot": "^3.1.2",

代码：

const viewShotRef = useRef(null);
const [uri, setUri] = useState('');
<ViewShot
style={[styles.imageViewerStyleVideo, {height: 410}]}
ref={viewShotRef}
captureMode="continuous"
options={{format: 'jpg', quality: 0.9}}>
<Video
ref={(p) => {
videoRef = p;
}}
paused={isPaused}
source={getImageSource(caseViewerVideo)}
resizeMode={'contain'}
selectedVideoTrack={'auto'}
style={styles.fullScreenMode}
controls={true}
playInBackground={false}
playWhenInactive={false}
/>
</ViewShot>
<Pressable
style={{
width: 40,
height: 40,
borderWidth: 1,
borderRadius: 20,
position: 'absolute',
top: 260,
right: 80,
borderColor: Colors.pencil,
backgroundColor: Colors.shadow,
}}
onPress={() => onCapture()}
/>
const onCapture = async () => {
const uri = await viewShotRef.current.capture();
setUri(uri);
console.log(uri);
};

Answer 1

根据github页面：

"连续的"；是实验性的，这将连续捕获大量图像。用于非常具体的用例。

从您的代码中，我看到您有一个Pressable来进行屏幕截图。我建议你完全移除captureMode道具。

在常见问题上，我读到：

获取"内容大小不能为零或为负数">

确保您不会立即进行快照，您至少需要等待存在第一个onLayout事件，或者在超时之后，否则视图可能尚未准备好。(等待也应该是安全的Image onLoad(如果有(。如果您仍然有问题，请确保您的视图实际上具有宽度和高度>0.

或者，您可以使用ViewShot组件，该组件将等待第一个onLayout。

因此，也许您应该等待Video的onLoad事件，然后再进行屏幕截图(建议您删除captureMode道具的另一个原因(。

或者，您可以使用captureRef(view, options)或captureScreen()而不是capture()。