mirror of
https://github.com/zoriya/react-native-svg.git
synced 2025-12-05 22:56:11 +00:00
b3b175a7fb
# Summary Due to the large number of example apps in the repository, I decided to change the structure and move all applications into an "apps" folder to maintain a clear structure.
37 lines
859 B
TypeScript
37 lines
859 B
TypeScript
import React from 'react';
|
|
import {SvgUri, Circle, Svg} from 'react-native-svg';
|
|
import {Button, View} from 'react-native';
|
|
|
|
export default () => {
|
|
const [uri, setUri] = React.useState<string | null>(null);
|
|
|
|
return (
|
|
<View style={{flex: 1, paddingTop: 100}}>
|
|
<Svg width={200} height={200}>
|
|
<Circle
|
|
cx={60}
|
|
cy={60}
|
|
r={50}
|
|
stroke="black"
|
|
strokeWidth={5}
|
|
fill="none"
|
|
/>
|
|
{uri && <SvgUri uri={uri} width={80} height={80} />}
|
|
</Svg>
|
|
<Button
|
|
color={'#000000'}
|
|
title="Toggle image"
|
|
onPress={() => {
|
|
if (!uri) {
|
|
setUri(
|
|
'https://dev.w3.org/SVG/tools/svgweb/samples/svg-files/ruby.svg',
|
|
);
|
|
} else {
|
|
setUri(null);
|
|
}
|
|
}}
|
|
/>
|
|
</View>
|
|
);
|
|
};
|