react-native-view-shot
react-native-view-shot copied to clipboard
android The screenshot cannot be opened
feature request
The pictures taken from the view shot screen can be opened or displayed normally
bug report
nothing
Version & Platform
"react-native": "0.62.2", "react-native-view-shot": "^3.1.2" Platform: Android Using the simulator simulator android version:5.1.1
Expected behavior
show screenshot
Actual behavior
- picture cannot be displayed normally
- result setting tmpfile,The file in the file manager also cannot be displayed
Steps to reproduce the behavior
- npx react-native init shotdemo
- yarn add react-native-view-shot
- App.js Amend to read
/* eslint-disable react-native/no-inline-styles */
/* eslint-disable react/no-string-refs */
/*
* @Author: 刘利军
* @Date: 2020-05-01 14:37:17
* @LastEditors: 刘利军
* @LastEditTime: 2020-05-01 18:55:13
*/
/**
* Sample React Native App
* https://github.com/facebook/react-native
*
* @format
* @flow strict-local
*/
import {ScrollView, Button, View, Text, Image} from 'react-native';
import React, {Component} from 'react';
import ViewShot from 'react-native-view-shot';
export default class App extends Component {
constructor(props) {
super(props);
this.state = {
uri:
'https://lh3.googleusercontent.com/proxy/Zb-tfSce9XpDg5mFwUZIJuhGHTo3TzsGuujy7JOnHhT41IrUSOUbD24ZaCVn52LWst8KdhPATKO_Ekz83kZ3VBvoZqab5NIfeTVOK_XOeg',
};
}
render() {
const demo = () => {
this.refs.viewShot.capture().then(uri => {
console.log('do something with ', uri);
this.setState({uri});
});
};
return (
<ScrollView>
<Text style={{marginBottom: 50}}>~~~~~~~~~~~~~~~~~~~~</Text>
<ViewShot
ref="viewShot"
options={{format: 'jpg', result: 'data-uri', quality: 1.0}}>
<View style={{marginBottom: 50, color: 'black'}}>
<Text>五一快乐呀!!!</Text>
<Text>...someing...shot...</Text>
</View>
</ViewShot>
<Button title="shot" onPress={demo} />
<Image
style={{
width: 300,
margin: 20,
backgroundColor: '#fff',
height: 200,
}}
source={{uri: this.state.uri}}
/>
</ScrollView>
);
}
}
- yarn android
- click the shot button