mirror of
https://github.com/zoriya/react-native-svg.git
synced 2025-12-05 22:56:11 +00:00
# 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.
29 lines
769 B
TypeScript
29 lines
769 B
TypeScript
import React from 'react';
|
|
import {Button, Text, View} from 'react-native';
|
|
import {Rect, Svg} from 'react-native-svg';
|
|
|
|
export default () => {
|
|
const [show, setShow] = React.useState(true);
|
|
return (
|
|
<View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
|
|
<Text>Blue rect is mounted: {show ? 'true' : 'false'}</Text>
|
|
|
|
<Svg height="300" width="300">
|
|
<Rect
|
|
x="0"
|
|
y="0"
|
|
width="300"
|
|
height="300"
|
|
fill="transparent"
|
|
stroke="red"
|
|
strokeWidth={3}
|
|
/>
|
|
{show ? (
|
|
<Rect x="100" y="100" width="100" height="100" fill="blue" />
|
|
) : null}
|
|
</Svg>
|
|
<Button title="Toggle" onPress={() => setShow(!show)} />
|
|
</View>
|
|
);
|
|
};
|