Add examples and refactor code

2025-12-19 13:35:11 +00:00 · 2016-01-21 23:44:38 +08:00
parent 89b52fd4a2
commit a482948b83
61 changed files with 3143 additions and 105 deletions
--- a/Example/examples/Circle.js
+++ b/Example/examples/Circle.js
@@ -0,0 +1,83 @@
+import React, {
+    Component
+} from 'react-native';
+
+import Svg, {
+    Circle
+} from 'react-native-art-svg';
+
+class CircleExample extends Component{
+    static title = 'Circle';
+    render() {
+        return <Svg
+            height="100"
+            width="100"
+        >
+            <Circle
+                cx="50"
+                cy="50"
+                r="50"
+                fill="pink"
+            />
+        </Svg>;
+    }
+}
+
+class StrokeCircle extends Component{
+    static title = 'Stroke Circle';
+    render() {
+        return <Svg
+            height="100"
+            width="100"
+        >
+            <Circle
+                cx="50"
+                cy="50"
+                r="45"
+                stroke="purple"
+                strokeWidth="2.5"
+            />
+        </Svg>;
+    }
+}
+
+class StrokeOpacityCircle extends Component{
+    static title = 'Circle with strokeOpacity';
+    render() {
+        return <Svg
+            height="100"
+            width="100"
+        >
+            <Circle
+                cx="50"
+                cy="50"
+                r="40"
+                stroke="purple"
+                strokeOpacity="0.5"
+                strokeWidth="10"
+                fill="pink"
+            />
+        </Svg>;
+    }
+}
+
+const icon = <Svg
+    height="20"
+    width="20"
+>
+    <Circle
+        cx="10"
+        cy="10"
+        r="8"
+        stroke="purple"
+        strokeWidth="1"
+        fill="pink"
+    />
+</Svg>;
+
+const samples = [CircleExample, StrokeCircle, StrokeOpacityCircle];
+
+export {
+    icon,
+    samples
+}