SVGUri.js 904B

12345678910111213141516171819202122232425262728293031
  1. //@flow
  2. import React, { useState, useCallback } from 'react';
  3. import { SafeAreaView, Image } from 'react-native';
  4. import ViewShot from 'react-native-view-shot';
  5. import SvgUri from 'react-native-svg-uri';
  6. import Desc from './Desc';
  7. const dimension = { width: 300, height: 300 };
  8. const SvgUriExample = () => {
  9. const [source, setSource] = useState(null);
  10. const onCapture = useCallback(uri => setSource({ uri }), []);
  11. return (
  12. <SafeAreaView>
  13. <ViewShot onCapture={onCapture} captureMode="continuous" style={dimension}>
  14. <SvgUri width={200} height={200} source={require('./homer-simpson.svg')} />
  15. </ViewShot>
  16. <Desc desc="above is an SVG view and below is a continuous screenshot of it" />
  17. <Image source={source} style={dimension} />
  18. </SafeAreaView>
  19. );
  20. };
  21. SvgUriExample.navigationOptions = {
  22. title: 'react-native-svg-uri',
  23. };
  24. export default SvgUriExample;