related-ui-components 1.6.0 → 1.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/commonjs/app.js +28 -9
- package/lib/commonjs/app.js.map +1 -1
- package/lib/commonjs/components/ScratchCard/ScratchCard.js +131 -87
- package/lib/commonjs/components/ScratchCard/ScratchCard.js.map +1 -1
- package/lib/commonjs/index.js +5 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/module/app.js +31 -12
- package/lib/module/app.js.map +1 -1
- package/lib/module/components/ScratchCard/ScratchCard.js +141 -90
- package/lib/module/components/ScratchCard/ScratchCard.js.map +1 -1
- package/lib/module/index.js +4 -7
- package/lib/module/index.js.map +1 -1
- package/lib/typescript/commonjs/app.d.ts.map +1 -1
- package/lib/typescript/commonjs/components/ScratchCard/ScratchCard.d.ts.map +1 -1
- package/lib/typescript/commonjs/index.d.ts +1 -0
- package/lib/typescript/commonjs/index.d.ts.map +1 -1
- package/lib/typescript/module/app.d.ts.map +1 -1
- package/lib/typescript/module/components/ScratchCard/ScratchCard.d.ts.map +1 -1
- package/lib/typescript/module/index.d.ts +1 -0
- package/lib/typescript/module/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/app.tsx +19 -1
- package/src/components/ScratchCard/ScratchCard.tsx +156 -93
- package/src/index.ts +4 -4
|
@@ -1,13 +1,27 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
import React, {
|
|
4
|
-
|
|
5
|
-
import {
|
|
3
|
+
import React, { useState, useEffect, useCallback // Import useCallback
|
|
4
|
+
} from "react";
|
|
5
|
+
import { Canvas, Group, Image, Mask, Path, Rect, Skia, useImage, Text, useFont, notifyChange
|
|
6
|
+
// Import SkPath type
|
|
7
|
+
// Import SkFont type
|
|
8
|
+
// Import SkImage type
|
|
9
|
+
} from "@shopify/react-native-skia";
|
|
10
|
+
import { View, StyleSheet
|
|
11
|
+
|
|
12
|
+
// Optional: for ignoring specific logs if needed
|
|
13
|
+
} from "react-native";
|
|
14
|
+
// Import runOnJS and useSharedValue
|
|
15
|
+
import { runOnJS, useSharedValue } from "react-native-reanimated";
|
|
16
|
+
import { Gesture, GestureDetector } from "react-native-gesture-handler";
|
|
17
|
+
|
|
18
|
+
// Ignore specific warning if it appears, related to path mutation - use cautiously
|
|
19
|
+
// LogBox.ignoreLogs(['Skia: SkPath.Make()']);
|
|
6
20
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
21
|
const ScratchCard = ({
|
|
8
22
|
style,
|
|
9
23
|
children,
|
|
10
|
-
image
|
|
24
|
+
image,
|
|
11
25
|
brushStrokeWidth = 50,
|
|
12
26
|
revealThreshold = 0.8,
|
|
13
27
|
width = 300,
|
|
@@ -19,45 +33,89 @@ const ScratchCard = ({
|
|
|
19
33
|
textFontSize = 16,
|
|
20
34
|
onScratched
|
|
21
35
|
}) => {
|
|
22
|
-
const
|
|
23
|
-
const
|
|
36
|
+
const loadedImg = useImage(image);
|
|
37
|
+
const loadedFont = useFont(textFont, textFontSize);
|
|
24
38
|
const [[areaWidth, areaHeight], setSize] = useState([0, 0]);
|
|
25
39
|
const [isScratched, setScratched] = useState(false);
|
|
26
|
-
const [
|
|
27
|
-
const
|
|
28
|
-
const
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
40
|
+
const [isLayoutReady, setLayoutReady] = useState(false);
|
|
41
|
+
const isThresholdReached = useSharedValue(false);
|
|
42
|
+
const path = useSharedValue(Skia.Path.Make());
|
|
43
|
+
useEffect(() => {
|
|
44
|
+
path.value = Skia.Path.Make();
|
|
45
|
+
isThresholdReached.value = false;
|
|
46
|
+
setScratched(false);
|
|
47
|
+
}, [areaWidth, areaHeight]);
|
|
48
|
+
const handleLayout = useCallback(event => {
|
|
49
|
+
const {
|
|
50
|
+
width: newWidth,
|
|
51
|
+
height: newHeight
|
|
52
|
+
} = event.nativeEvent.layout;
|
|
53
|
+
if (newWidth > 0 && newHeight > 0) {
|
|
54
|
+
if (newWidth !== areaWidth || newHeight !== areaHeight) {
|
|
55
|
+
setSize([newWidth, newHeight]);
|
|
56
|
+
}
|
|
57
|
+
if (!isLayoutReady) {
|
|
58
|
+
setLayoutReady(true);
|
|
39
59
|
}
|
|
60
|
+
} else {
|
|
61
|
+
setLayoutReady(false);
|
|
40
62
|
}
|
|
41
|
-
};
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
63
|
+
}, [areaWidth, areaHeight, isLayoutReady]);
|
|
64
|
+
const revealCardOnJS = useCallback(() => {
|
|
65
|
+
setScratched(true);
|
|
66
|
+
onScratched?.();
|
|
67
|
+
}, [onScratched]);
|
|
68
|
+
const pan = Gesture.Pan().averageTouches(true).maxPointers(1).onBegin(e => {
|
|
69
|
+
if (!isLayoutReady) return;
|
|
70
|
+
try {
|
|
71
|
+
const newPath = path.value.copy();
|
|
72
|
+
newPath.moveTo(e.x, e.y);
|
|
73
|
+
newPath.lineTo(e.x + 0.001, e.y + 0.001);
|
|
74
|
+
path.value = newPath;
|
|
75
|
+
notifyChange(path);
|
|
76
|
+
} catch (error) {
|
|
77
|
+
console.error("ScratchCard: Error in onBegin:", error);
|
|
51
78
|
}
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
79
|
+
}).onChange(e => {
|
|
80
|
+
if (!isLayoutReady || isThresholdReached.value) return;
|
|
81
|
+
try {
|
|
82
|
+
const newPath = path.value.copy();
|
|
83
|
+
newPath.lineTo(e.x, e.y);
|
|
84
|
+
path.value = newPath;
|
|
85
|
+
notifyChange(path);
|
|
86
|
+
const bounds = path.value.getBounds();
|
|
87
|
+
if (!bounds || areaWidth <= 0 || areaHeight <= 0) {
|
|
88
|
+
return;
|
|
89
|
+
}
|
|
90
|
+
const scratchedArea = bounds.width * bounds.height;
|
|
91
|
+
const totalArea = areaWidth * areaHeight;
|
|
92
|
+
if (totalArea > 0 && scratchedArea / totalArea > revealThreshold) {
|
|
93
|
+
if (!isThresholdReached.value) {
|
|
94
|
+
isThresholdReached.value = true;
|
|
95
|
+
runOnJS(revealCardOnJS)();
|
|
96
|
+
}
|
|
97
|
+
}
|
|
98
|
+
} catch (error) {
|
|
99
|
+
console.error("ScratchCard: Error in onChange (UI Thread):", error);
|
|
100
|
+
}
|
|
101
|
+
});
|
|
102
|
+
const textMetrics = React.useMemo(() => {
|
|
103
|
+
if (loadedFont && text && areaWidth > 0 && areaHeight > 0) {
|
|
104
|
+
const metrics = loadedFont.measureText(text);
|
|
105
|
+
const textX = areaWidth / 2 - metrics.width / 2;
|
|
106
|
+
const textY = areaHeight / 2 + metrics.height / 3;
|
|
107
|
+
return {
|
|
108
|
+
x: textX,
|
|
109
|
+
y: textY,
|
|
110
|
+
width: metrics.width,
|
|
111
|
+
height: metrics.height
|
|
112
|
+
};
|
|
113
|
+
}
|
|
114
|
+
return null;
|
|
115
|
+
}, [loadedFont, text, areaWidth, areaHeight]);
|
|
116
|
+
const canRenderCanvas = isLayoutReady && areaWidth > 0 && areaHeight > 0;
|
|
57
117
|
return /*#__PURE__*/_jsxs(View, {
|
|
58
|
-
onLayout:
|
|
59
|
-
setSize([e.nativeEvent.layout.width, e.nativeEvent.layout.height]);
|
|
60
|
-
},
|
|
118
|
+
onLayout: handleLayout,
|
|
61
119
|
style: [styles.container, style, {
|
|
62
120
|
width,
|
|
63
121
|
height
|
|
@@ -65,57 +123,50 @@ const ScratchCard = ({
|
|
|
65
123
|
children: [/*#__PURE__*/_jsx(View, {
|
|
66
124
|
style: styles.content,
|
|
67
125
|
children: children
|
|
68
|
-
}), !isScratched && /*#__PURE__*/_jsx(
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
}),
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
strokeJoin: "round",
|
|
94
|
-
strokeCap: "round",
|
|
95
|
-
strokeWidth: brushStrokeWidth
|
|
96
|
-
})]
|
|
97
|
-
}),
|
|
98
|
-
children: img ? /*#__PURE__*/_jsx(Image, {
|
|
99
|
-
image: img,
|
|
100
|
-
fit: "cover",
|
|
101
|
-
x: 0,
|
|
102
|
-
y: 0,
|
|
103
|
-
width: areaWidth,
|
|
104
|
-
height: areaHeight
|
|
105
|
-
}) : /*#__PURE__*/_jsxs(Group, {
|
|
106
|
-
children: [/*#__PURE__*/_jsx(Rect, {
|
|
126
|
+
}), !isScratched && canRenderCanvas && /*#__PURE__*/_jsx(GestureDetector, {
|
|
127
|
+
gesture: pan,
|
|
128
|
+
children: /*#__PURE__*/_jsx(Canvas, {
|
|
129
|
+
style: styles.canvas,
|
|
130
|
+
children: /*#__PURE__*/_jsx(Mask, {
|
|
131
|
+
mode: "luminance",
|
|
132
|
+
mask: /*#__PURE__*/_jsxs(Group, {
|
|
133
|
+
children: [/*#__PURE__*/_jsx(Rect, {
|
|
134
|
+
x: 0,
|
|
135
|
+
y: 0,
|
|
136
|
+
width: areaWidth,
|
|
137
|
+
height: areaHeight,
|
|
138
|
+
color: "white"
|
|
139
|
+
}), /*#__PURE__*/_jsx(Path, {
|
|
140
|
+
path: path,
|
|
141
|
+
color: "black",
|
|
142
|
+
style: "stroke",
|
|
143
|
+
strokeJoin: "round",
|
|
144
|
+
strokeCap: "round",
|
|
145
|
+
strokeWidth: brushStrokeWidth
|
|
146
|
+
})]
|
|
147
|
+
}),
|
|
148
|
+
children: loadedImg ? /*#__PURE__*/_jsx(Image, {
|
|
149
|
+
image: loadedImg,
|
|
150
|
+
fit: "cover",
|
|
107
151
|
x: 0,
|
|
108
152
|
y: 0,
|
|
109
153
|
width: areaWidth,
|
|
110
|
-
height: areaHeight
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
154
|
+
height: areaHeight
|
|
155
|
+
}) : /*#__PURE__*/_jsxs(Group, {
|
|
156
|
+
children: [/*#__PURE__*/_jsx(Rect, {
|
|
157
|
+
x: 0,
|
|
158
|
+
y: 0,
|
|
159
|
+
width: areaWidth,
|
|
160
|
+
height: areaHeight,
|
|
161
|
+
color: backgroundColor
|
|
162
|
+
}), loadedFont && textMetrics && text ? /*#__PURE__*/_jsx(Text, {
|
|
163
|
+
x: textMetrics.x,
|
|
164
|
+
y: textMetrics.y,
|
|
165
|
+
text: text,
|
|
166
|
+
color: textFontColor,
|
|
167
|
+
font: loadedFont
|
|
168
|
+
}) : null]
|
|
169
|
+
})
|
|
119
170
|
})
|
|
120
171
|
})
|
|
121
172
|
})]
|
|
@@ -124,23 +175,23 @@ const ScratchCard = ({
|
|
|
124
175
|
const styles = StyleSheet.create({
|
|
125
176
|
container: {
|
|
126
177
|
position: "relative",
|
|
127
|
-
overflow: "hidden"
|
|
128
|
-
width: "100%",
|
|
129
|
-
height: "100%"
|
|
178
|
+
overflow: "hidden"
|
|
130
179
|
},
|
|
131
180
|
content: {
|
|
132
181
|
position: "absolute",
|
|
133
182
|
top: 0,
|
|
134
183
|
left: 0,
|
|
135
184
|
width: "100%",
|
|
136
|
-
height: "100%"
|
|
185
|
+
height: "100%",
|
|
186
|
+
zIndex: 1
|
|
137
187
|
},
|
|
138
188
|
canvas: {
|
|
139
189
|
position: "absolute",
|
|
140
190
|
top: 0,
|
|
141
191
|
left: 0,
|
|
142
192
|
width: "100%",
|
|
143
|
-
height: "100%"
|
|
193
|
+
height: "100%",
|
|
194
|
+
zIndex: 2
|
|
144
195
|
}
|
|
145
196
|
});
|
|
146
197
|
export default ScratchCard;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","
|
|
1
|
+
{"version":3,"names":["React","useState","useEffect","useCallback","Canvas","Group","Image","Mask","Path","Rect","Skia","useImage","Text","useFont","notifyChange","View","StyleSheet","runOnJS","useSharedValue","Gesture","GestureDetector","jsx","_jsx","jsxs","_jsxs","ScratchCard","style","children","image","brushStrokeWidth","revealThreshold","width","height","backgroundColor","text","textFont","textFontColor","textFontSize","onScratched","loadedImg","loadedFont","areaWidth","areaHeight","setSize","isScratched","setScratched","isLayoutReady","setLayoutReady","isThresholdReached","path","Make","value","handleLayout","event","newWidth","newHeight","nativeEvent","layout","revealCardOnJS","pan","Pan","averageTouches","maxPointers","onBegin","e","newPath","copy","moveTo","x","y","lineTo","error","console","onChange","bounds","getBounds","scratchedArea","totalArea","textMetrics","useMemo","metrics","measureText","textX","textY","canRenderCanvas","onLayout","styles","container","content","gesture","canvas","mode","mask","color","strokeJoin","strokeCap","strokeWidth","fit","font","create","position","overflow","top","left","zIndex"],"sourceRoot":"..\\..\\..\\..\\src","sources":["components/ScratchCard/ScratchCard.tsx"],"mappings":"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","ignoreList":[]}
|
package/lib/module/index.js
CHANGED
|
@@ -1,12 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
// registerRootComponent(App);
|
|
9
|
-
|
|
3
|
+
import { registerRootComponent } from 'expo';
|
|
4
|
+
import "react-native-reanimated";
|
|
5
|
+
import App from "./app.js";
|
|
6
|
+
registerRootComponent(App);
|
|
10
7
|
export * from "./theme/index.js";
|
|
11
8
|
export * from "./components/index.js";
|
|
12
9
|
//# sourceMappingURL=index.js.map
|
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":[],"sourceRoot":"..\\..\\src","sources":["index.ts"],"mappings":";;AAAA;
|
|
1
|
+
{"version":3,"names":["registerRootComponent","App"],"sourceRoot":"..\\..\\src","sources":["index.ts"],"mappings":";;AAAA,SAASA,qBAAqB,QAAQ,MAAM;AAC5C,OAAO,yBAAyB;AAGhC,OAAOC,GAAG,MAAM,UAAO;AAEvBD,qBAAqB,CAACC,GAAG,CAAC;AAE1B,cAAc,kBAAS;AACvB,cAAc,uBAAc","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../../src/app.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAqChD,MAAM,CAAC,OAAO,UAAU,GAAG,
|
|
1
|
+
{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../../src/app.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAqChD,MAAM,CAAC,OAAO,UAAU,GAAG,sBA8L1B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScratchCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/ScratchCard/ScratchCard.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ScratchCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/ScratchCard/ScratchCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAKN,MAAM,OAAO,CAAC;AAiBf,OAAO,EACL,SAAS,EAET,SAAS,EAET,kBAAkB,EAEnB,MAAM,cAAc,CAAC;AAQtB,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA8K3C,CAAC;AAyBF,eAAe,WAAW,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,yBAAyB,CAAC;AAOjC,cAAc,SAAS,CAAA;AACvB,cAAc,cAAc,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../../src/app.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAqChD,MAAM,CAAC,OAAO,UAAU,GAAG,
|
|
1
|
+
{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../../src/app.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2B,MAAM,OAAO,CAAC;AAqChD,MAAM,CAAC,OAAO,UAAU,GAAG,sBA8L1B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScratchCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/ScratchCard/ScratchCard.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"ScratchCard.d.ts","sourceRoot":"","sources":["../../../../../src/components/ScratchCard/ScratchCard.tsx"],"names":[],"mappings":"AAAA,OAAO,KAKN,MAAM,OAAO,CAAC;AAiBf,OAAO,EACL,SAAS,EAET,SAAS,EAET,kBAAkB,EAEnB,MAAM,cAAc,CAAC;AAQtB,KAAK,gBAAgB,GAAG;IACtB,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,KAAK,CAAC,EAAE,kBAAkB,CAAC;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,kBAAkB,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;CAC1B,CAAC;AAEF,QAAA,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CA8K3C,CAAC;AAyBF,eAAe,WAAW,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,yBAAyB,CAAC;AAOjC,cAAc,SAAS,CAAA;AACvB,cAAc,cAAc,CAAC"}
|
package/package.json
CHANGED
package/src/app.tsx
CHANGED
|
@@ -192,6 +192,24 @@ export default function App() {
|
|
|
192
192
|
<SafeAreaView
|
|
193
193
|
style={{ padding: 10, flex: 1, backgroundColor: theme.background }}
|
|
194
194
|
>
|
|
195
|
+
<ScratchCard
|
|
196
|
+
backgroundColor="#8A2BE2"
|
|
197
|
+
text="Scratch to reveal your prize!"
|
|
198
|
+
textFontColor="#FFFFFF"
|
|
199
|
+
textFontSize={18}
|
|
200
|
+
width={300}
|
|
201
|
+
height={150}
|
|
202
|
+
// onScratched={() => alert("Congratulations! You won a prize!")}
|
|
203
|
+
>
|
|
204
|
+
<ScratchCardContent style={{ backgroundColor: "#FFD700" }}>
|
|
205
|
+
<Text style={{ fontSize: 24, fontWeight: "bold", color: "#000" }}>
|
|
206
|
+
50% OFF COUPON
|
|
207
|
+
</Text>
|
|
208
|
+
<Text style={{ marginTop: 8, color: "#333" }}>
|
|
209
|
+
Use code: SCRATCH50
|
|
210
|
+
</Text>
|
|
211
|
+
</ScratchCardContent>
|
|
212
|
+
</ScratchCard>
|
|
195
213
|
{/* <UnlockRewards
|
|
196
214
|
title="Your Rewards"
|
|
197
215
|
description="Complete tasks to unlock special benefits"
|
|
@@ -202,7 +220,7 @@ export default function App() {
|
|
|
202
220
|
topBackgroundHeight={200}
|
|
203
221
|
customCloseIcon={<Ionicons name="close-circle" size={28} color={theme.primary} />}
|
|
204
222
|
/> */}
|
|
205
|
-
<Popup title="TEST" content="TEST" visible onClose={()=>{}} backgroundImage={require("@/assets/images/namshi-banner.png")} containerStyle={{height: 300}}></Popup>
|
|
223
|
+
{/* <Popup title="TEST" content="TEST" visible onClose={()=>{}} backgroundImage={require("@/assets/images/namshi-banner.png")} containerStyle={{height: 300}}></Popup> */}
|
|
206
224
|
</SafeAreaView>
|
|
207
225
|
</RelatedProvider>
|
|
208
226
|
</GestureHandlerRootView>
|