@unif/react-native-hms-scan 2.1.0 → 2.2.0
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/module/Scanner/ResultFail.js +34 -20
- package/lib/module/Scanner/ResultFail.js.map +1 -1
- package/lib/module/Scanner/ResultFocus/ResultFocus.js +8 -9
- package/lib/module/Scanner/ResultFocus/ResultFocus.js.map +1 -1
- package/lib/module/Scanner/ResultFocus/styles.js +17 -1
- package/lib/module/Scanner/ResultFocus/styles.js.map +1 -1
- package/lib/module/Scanner/ScanToolbar.js +21 -14
- package/lib/module/Scanner/ScanToolbar.js.map +1 -1
- package/lib/module/Scanner/scanChrome.js +0 -6
- package/lib/module/Scanner/scanChrome.js.map +1 -1
- package/lib/typescript/src/Scanner/ResultFail.d.ts.map +1 -1
- package/lib/typescript/src/Scanner/ResultFocus/ResultFocus.d.ts.map +1 -1
- package/lib/typescript/src/Scanner/ResultFocus/styles.d.ts +25 -2
- package/lib/typescript/src/Scanner/ResultFocus/styles.d.ts.map +1 -1
- package/lib/typescript/src/Scanner/ScanToolbar.d.ts.map +1 -1
- package/lib/typescript/src/Scanner/scanChrome.d.ts +0 -6
- package/lib/typescript/src/Scanner/scanChrome.d.ts.map +1 -1
- package/package.json +3 -3
- package/src/Scanner/ResultFail.tsx +23 -14
- package/src/Scanner/ResultFocus/ResultFocus.tsx +5 -11
- package/src/Scanner/ResultFocus/styles.ts +11 -1
- package/src/Scanner/ScanToolbar.tsx +20 -11
- package/src/Scanner/scanChrome.ts +0 -6
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import { useEffect, useRef } from 'react';
|
|
4
4
|
import { Animated, StyleSheet, View } from 'react-native';
|
|
5
|
-
import { Button, Empty, useThemedStyles, r } from '@unif/react-native-design';
|
|
5
|
+
import { Button, Empty, GlassLayer, useThemedStyles, r } from '@unif/react-native-design';
|
|
6
6
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
7
7
|
// 未识别失败的底部弹层：design 的 Empty（error-alert）+ Button（重扫）。
|
|
8
8
|
// 聚焦款不加背景遮罩，与浮层确认卡保持一致。
|
|
@@ -20,7 +20,7 @@ export function ResultFail({
|
|
|
20
20
|
useNativeDriver: true
|
|
21
21
|
}).start();
|
|
22
22
|
}, [anim]);
|
|
23
|
-
return /*#__PURE__*/
|
|
23
|
+
return /*#__PURE__*/_jsx(Animated.View, {
|
|
24
24
|
style: [s.sheet, {
|
|
25
25
|
transform: [{
|
|
26
26
|
translateY: anim.interpolate({
|
|
@@ -29,26 +29,42 @@ export function ResultFail({
|
|
|
29
29
|
})
|
|
30
30
|
}]
|
|
31
31
|
}],
|
|
32
|
-
children:
|
|
33
|
-
style:
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
32
|
+
children: /*#__PURE__*/_jsxs(View, {
|
|
33
|
+
style: styles.surface,
|
|
34
|
+
children: [/*#__PURE__*/_jsx(GlassLayer, {
|
|
35
|
+
style: styles.glass,
|
|
36
|
+
testID: "scan-failure-glass"
|
|
37
|
+
}), /*#__PURE__*/_jsx(View, {
|
|
38
|
+
style: s.grabber
|
|
39
|
+
}), /*#__PURE__*/_jsxs(View, {
|
|
40
|
+
style: [styles.inner, {
|
|
41
|
+
paddingBottom: bottomInset + r(14)
|
|
42
|
+
}],
|
|
43
|
+
children: [/*#__PURE__*/_jsx(Empty, {
|
|
44
|
+
icon: "error-alert",
|
|
45
|
+
title: failed ? '图片识别失败' : '未识别到条码',
|
|
46
|
+
desc: failed ? '无法读取或解码图片，请重试。' : '请将条码完整置于框内、保持平整并对准光线后重试。'
|
|
47
|
+
}), /*#__PURE__*/_jsx(Button, {
|
|
48
|
+
label: "\u91CD\u626B",
|
|
49
|
+
variant: "primary",
|
|
50
|
+
block: true,
|
|
51
|
+
onPress: onRescan
|
|
52
|
+
})]
|
|
47
53
|
})]
|
|
48
|
-
})
|
|
54
|
+
})
|
|
49
55
|
});
|
|
50
56
|
}
|
|
51
57
|
const styles = StyleSheet.create({
|
|
58
|
+
glass: {
|
|
59
|
+
borderTopLeftRadius: r(20),
|
|
60
|
+
borderTopRightRadius: r(20)
|
|
61
|
+
},
|
|
62
|
+
surface: {
|
|
63
|
+
borderTopLeftRadius: r(20),
|
|
64
|
+
borderTopRightRadius: r(20),
|
|
65
|
+
paddingTop: r(10),
|
|
66
|
+
overflow: 'hidden'
|
|
67
|
+
},
|
|
52
68
|
inner: {
|
|
53
69
|
paddingHorizontal: r(18),
|
|
54
70
|
paddingTop: r(8),
|
|
@@ -62,10 +78,8 @@ const makeStyles = (c, shadow) => StyleSheet.create({
|
|
|
62
78
|
right: 0,
|
|
63
79
|
bottom: 0,
|
|
64
80
|
zIndex: 50,
|
|
65
|
-
backgroundColor: c.surface,
|
|
66
81
|
borderTopLeftRadius: r(20),
|
|
67
82
|
borderTopRightRadius: r(20),
|
|
68
|
-
paddingTop: r(10),
|
|
69
83
|
...shadow.floating
|
|
70
84
|
},
|
|
71
85
|
grabber: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useRef","Animated","StyleSheet","View","Button","Empty","useThemedStyles","r","jsx","_jsx","jsxs","_jsxs","ResultFail","bottomInset","failed","onRescan","s","makeStyles","anim","Value","current","timing","toValue","duration","useNativeDriver","start","style","sheet","transform","translateY","interpolate","inputRange","outputRange","children","
|
|
1
|
+
{"version":3,"names":["useEffect","useRef","Animated","StyleSheet","View","Button","Empty","GlassLayer","useThemedStyles","r","jsx","_jsx","jsxs","_jsxs","ResultFail","bottomInset","failed","onRescan","s","makeStyles","anim","Value","current","timing","toValue","duration","useNativeDriver","start","style","sheet","transform","translateY","interpolate","inputRange","outputRange","children","styles","surface","glass","testID","grabber","inner","paddingBottom","icon","title","desc","label","variant","block","onPress","create","borderTopLeftRadius","borderTopRightRadius","paddingTop","overflow","paddingHorizontal","rowGap","c","shadow","position","left","right","bottom","zIndex","floating","width","height","borderRadius","backgroundColor","surfaceContainerHighest","alignSelf"],"sourceRoot":"../../../src","sources":["Scanner/ResultFail.tsx"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { ScrollView, Text, View } from 'react-native';
|
|
4
|
-
import { Button,
|
|
4
|
+
import { Button, GlassLayer, useThemedStyles, r } from '@unif/react-native-design';
|
|
5
5
|
import { styles, makeStyles } from "./styles.js";
|
|
6
6
|
|
|
7
7
|
/** A raw result is selected here; interpreting it belongs to the consumer. */
|
|
@@ -12,18 +12,17 @@ export function ResultFocus({
|
|
|
12
12
|
onRescan,
|
|
13
13
|
onConfirm
|
|
14
14
|
}) {
|
|
15
|
-
const colors = useColors();
|
|
16
15
|
const themed = useThemedStyles(makeStyles);
|
|
17
16
|
return /*#__PURE__*/_jsx(View, {
|
|
18
|
-
style: [styles.wrap, {
|
|
17
|
+
style: [styles.wrap, themed.shadow, {
|
|
19
18
|
bottom: bottomInset + r(18)
|
|
20
19
|
}],
|
|
21
|
-
children: /*#__PURE__*/_jsxs(
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
20
|
+
children: /*#__PURE__*/_jsxs(View, {
|
|
21
|
+
style: [styles.surface, themed.border],
|
|
22
|
+
children: [/*#__PURE__*/_jsx(GlassLayer, {
|
|
23
|
+
style: styles.glass,
|
|
24
|
+
testID: "scan-result-glass"
|
|
25
|
+
}), /*#__PURE__*/_jsx(Text, {
|
|
27
26
|
style: themed.badge,
|
|
28
27
|
children: "\u5DF2\u8BC6\u522B"
|
|
29
28
|
}), /*#__PURE__*/_jsx(Text, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["ScrollView","Text","View","Button","
|
|
1
|
+
{"version":3,"names":["ScrollView","Text","View","Button","GlassLayer","useThemedStyles","r","styles","makeStyles","jsx","_jsx","jsxs","_jsxs","ResultFocus","result","bottomInset","onRescan","onConfirm","themed","style","wrap","shadow","bottom","children","surface","border","glass","testID","badge","format","content","selectable","value","actions","label","variant","block","onPress"],"sourceRoot":"../../../../src","sources":["Scanner/ResultFocus/ResultFocus.tsx"],"mappings":";;AAAA,SAASA,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AACrD,SACEC,MAAM,EACNC,UAAU,EACVC,eAAe,EACfC,CAAC,QACI,2BAA2B;AAElC,SAASC,MAAM,EAAEC,UAAU,QAAQ,aAAU;;AAE7C;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AACA,OAAO,SAASC,WAAWA,CAAC;EAC1BC,MAAM;EACNC,WAAW;EACXC,QAAQ;EACRC;AACgB,CAAC,EAAE;EACnB,MAAMC,MAAM,GAAGb,eAAe,CAACG,UAAU,CAAC;EAC1C,oBACEE,IAAA,CAACR,IAAI;IAACiB,KAAK,EAAE,CAACZ,MAAM,CAACa,IAAI,EAAEF,MAAM,CAACG,MAAM,EAAE;MAAEC,MAAM,EAAEP,WAAW,GAAGT,CAAC,CAAC,EAAE;IAAE,CAAC,CAAE;IAAAiB,QAAA,eACzEX,KAAA,CAACV,IAAI;MAACiB,KAAK,EAAE,CAACZ,MAAM,CAACiB,OAAO,EAAEN,MAAM,CAACO,MAAM,CAAE;MAAAF,QAAA,gBAC3Cb,IAAA,CAACN,UAAU;QAACe,KAAK,EAAEZ,MAAM,CAACmB,KAAM;QAACC,MAAM,EAAC;MAAmB,CAAE,CAAC,eAC9DjB,IAAA,CAACT,IAAI;QAACkB,KAAK,EAAED,MAAM,CAACU,KAAM;QAAAL,QAAA,EAAC;MAAG,CAAM,CAAC,eACrCb,IAAA,CAACT,IAAI;QAACkB,KAAK,EAAED,MAAM,CAACW,MAAO;QAAAN,QAAA,EAAET,MAAM,CAACe;MAAM,CAAO,CAAC,eAClDnB,IAAA,CAACV,UAAU;QAACmB,KAAK,EAAEZ,MAAM,CAACuB,OAAQ;QAAAP,QAAA,eAChCb,IAAA,CAACT,IAAI;UAAC8B,UAAU;UAACZ,KAAK,EAAED,MAAM,CAACc,KAAM;UAAAT,QAAA,EAClCT,MAAM,CAACkB;QAAK,CACT;MAAC,CACG,CAAC,eACbpB,KAAA,CAACV,IAAI;QAACiB,KAAK,EAAEZ,MAAM,CAAC0B,OAAQ;QAAAV,QAAA,gBAC1Bb,IAAA,CAACP,MAAM;UAAC+B,KAAK,EAAC,cAAI;UAACC,OAAO,EAAC,WAAW;UAACC,KAAK;UAACC,OAAO,EAAErB;QAAS,CAAE,CAAC,eAClEN,IAAA,CAACP,MAAM;UAAC+B,KAAK,EAAC,cAAI;UAACC,OAAO,EAAC,SAAS;UAACC,KAAK;UAACC,OAAO,EAAEpB;QAAU,CAAE,CAAC;MAAA,CAC7D,CAAC;IAAA,CACH;EAAC,CACH,CAAC;AAEX","ignoreList":[]}
|
|
@@ -9,6 +9,15 @@ export const styles = StyleSheet.create({
|
|
|
9
9
|
right: r(16),
|
|
10
10
|
zIndex: 50
|
|
11
11
|
},
|
|
12
|
+
glass: {
|
|
13
|
+
borderRadius: r(16)
|
|
14
|
+
},
|
|
15
|
+
surface: {
|
|
16
|
+
borderRadius: r(16),
|
|
17
|
+
borderWidth: 2,
|
|
18
|
+
padding: r(14),
|
|
19
|
+
overflow: 'hidden'
|
|
20
|
+
},
|
|
12
21
|
content: {
|
|
13
22
|
maxHeight: r(220),
|
|
14
23
|
marginVertical: r(14)
|
|
@@ -18,7 +27,14 @@ export const styles = StyleSheet.create({
|
|
|
18
27
|
columnGap: r(10)
|
|
19
28
|
}
|
|
20
29
|
});
|
|
21
|
-
export const makeStyles = colors => StyleSheet.create({
|
|
30
|
+
export const makeStyles = (colors, shadow) => StyleSheet.create({
|
|
31
|
+
shadow: {
|
|
32
|
+
borderRadius: r(16),
|
|
33
|
+
...shadow.card
|
|
34
|
+
},
|
|
35
|
+
border: {
|
|
36
|
+
borderColor: colors.primary
|
|
37
|
+
},
|
|
22
38
|
badge: {
|
|
23
39
|
fontSize: rf(13),
|
|
24
40
|
fontWeight: fw.semi,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["StyleSheet","r","rf","fw","fontMono","styles","create","wrap","position","left","right","zIndex","content","maxHeight","marginVertical","actions","flexDirection","columnGap","makeStyles","colors","badge","fontSize","fontWeight","semi","color","foreground","format","foregroundMuted","fontFamily","marginTop","value","lineHeight"],"sourceRoot":"../../../../src","sources":["Scanner/ResultFocus/styles.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,cAAc;AACzC,SACEC,CAAC,EACDC,EAAE,EACFC,EAAE,EACFC,QAAQ,
|
|
1
|
+
{"version":3,"names":["StyleSheet","r","rf","fw","fontMono","styles","create","wrap","position","left","right","zIndex","glass","borderRadius","surface","borderWidth","padding","overflow","content","maxHeight","marginVertical","actions","flexDirection","columnGap","makeStyles","colors","shadow","card","border","borderColor","primary","badge","fontSize","fontWeight","semi","color","foreground","format","foregroundMuted","fontFamily","marginTop","value","lineHeight"],"sourceRoot":"../../../../src","sources":["Scanner/ResultFocus/styles.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,cAAc;AACzC,SACEC,CAAC,EACDC,EAAE,EACFC,EAAE,EACFC,QAAQ,QAGH,2BAA2B;AAElC,OAAO,MAAMC,MAAM,GAAGL,UAAU,CAACM,MAAM,CAAC;EACtCC,IAAI,EAAE;IAAEC,QAAQ,EAAE,UAAU;IAAEC,IAAI,EAAER,CAAC,CAAC,EAAE,CAAC;IAAES,KAAK,EAAET,CAAC,CAAC,EAAE,CAAC;IAAEU,MAAM,EAAE;EAAG,CAAC;EACrEC,KAAK,EAAE;IAAEC,YAAY,EAAEZ,CAAC,CAAC,EAAE;EAAE,CAAC;EAC9Ba,OAAO,EAAE;IACPD,YAAY,EAAEZ,CAAC,CAAC,EAAE,CAAC;IACnBc,WAAW,EAAE,CAAC;IACdC,OAAO,EAAEf,CAAC,CAAC,EAAE,CAAC;IACdgB,QAAQ,EAAE;EACZ,CAAC;EACDC,OAAO,EAAE;IAAEC,SAAS,EAAElB,CAAC,CAAC,GAAG,CAAC;IAAEmB,cAAc,EAAEnB,CAAC,CAAC,EAAE;EAAE,CAAC;EACrDoB,OAAO,EAAE;IAAEC,aAAa,EAAE,KAAK;IAAEC,SAAS,EAAEtB,CAAC,CAAC,EAAE;EAAE;AACpD,CAAC,CAAC;AACF,OAAO,MAAMuB,UAAU,GAAGA,CAACC,MAAmB,EAAEC,MAAoB,KAClE1B,UAAU,CAACM,MAAM,CAAC;EAChBoB,MAAM,EAAE;IAAEb,YAAY,EAAEZ,CAAC,CAAC,EAAE,CAAC;IAAE,GAAGyB,MAAM,CAACC;EAAK,CAAC;EAC/CC,MAAM,EAAE;IAAEC,WAAW,EAAEJ,MAAM,CAACK;EAAQ,CAAC;EACvCC,KAAK,EAAE;IAAEC,QAAQ,EAAE9B,EAAE,CAAC,EAAE,CAAC;IAAE+B,UAAU,EAAE9B,EAAE,CAAC+B,IAAI;IAAEC,KAAK,EAAEV,MAAM,CAACW;EAAW,CAAC;EAC1EC,MAAM,EAAE;IACNL,QAAQ,EAAE9B,EAAE,CAAC,EAAE,CAAC;IAChBiC,KAAK,EAAEV,MAAM,CAACa,eAAe;IAC7BC,UAAU,EAAEnC,QAAQ;IACpBoC,SAAS,EAAEvC,CAAC,CAAC,CAAC;EAChB,CAAC;EACDwC,KAAK,EAAE;IAAET,QAAQ,EAAE9B,EAAE,CAAC,EAAE,CAAC;IAAEwC,UAAU,EAAExC,EAAE,CAAC,EAAE,CAAC;IAAEiC,KAAK,EAAEV,MAAM,CAACW;EAAW;AAC1E,CAAC,CAAC","ignoreList":[]}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
3
|
import { Pressable, StyleSheet, Text, View } from 'react-native';
|
|
4
|
-
import { Icon, useColors, r, rf, useThemedStyles, fw } from '@unif/react-native-design';
|
|
4
|
+
import { Icon, GlassLayer, darkColors, useColors, r, rf, useThemedStyles, fw } from '@unif/react-native-design';
|
|
5
5
|
import { scanChrome } from "./scanChrome.js";
|
|
6
6
|
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
7
7
|
// 底部工具栏：返回 · 手电筒 · 相册。点亮态用主题主色。
|
|
@@ -41,6 +41,7 @@ function ToolbarItem({
|
|
|
41
41
|
onPress
|
|
42
42
|
}) {
|
|
43
43
|
const s = useThemedStyles(makeTextStyles);
|
|
44
|
+
const c = useColors();
|
|
44
45
|
return /*#__PURE__*/_jsx(Pressable, {
|
|
45
46
|
onPress: onPress,
|
|
46
47
|
style: styles.item,
|
|
@@ -49,21 +50,22 @@ function ToolbarItem({
|
|
|
49
50
|
children: ({
|
|
50
51
|
pressed
|
|
51
52
|
}) => /*#__PURE__*/_jsxs(_Fragment, {
|
|
52
|
-
children: [/*#__PURE__*/
|
|
53
|
+
children: [/*#__PURE__*/_jsxs(View, {
|
|
53
54
|
style: [styles.circle, activeColor ? {
|
|
54
|
-
backgroundColor: activeColor
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
}],
|
|
62
|
-
children: /*#__PURE__*/_jsx(Icon, {
|
|
55
|
+
backgroundColor: activeColor
|
|
56
|
+
} : undefined],
|
|
57
|
+
children: [!activeColor && /*#__PURE__*/_jsx(GlassLayer, {
|
|
58
|
+
colorScheme: "dark",
|
|
59
|
+
style: styles.glass,
|
|
60
|
+
testID: "scan-toolbar-glass"
|
|
61
|
+
}), /*#__PURE__*/_jsx(Icon, {
|
|
63
62
|
name: icon,
|
|
64
63
|
size: r(23),
|
|
65
|
-
color: scanChrome.white
|
|
66
|
-
|
|
64
|
+
color: activeColor ? c.onPrimary : scanChrome.white,
|
|
65
|
+
style: pressed && {
|
|
66
|
+
opacity: 0.7
|
|
67
|
+
}
|
|
68
|
+
})]
|
|
67
69
|
}), /*#__PURE__*/_jsx(Text, {
|
|
68
70
|
style: s.label,
|
|
69
71
|
children: label
|
|
@@ -86,13 +88,18 @@ const styles = StyleSheet.create({
|
|
|
86
88
|
alignItems: 'center',
|
|
87
89
|
rowGap: r(7)
|
|
88
90
|
},
|
|
91
|
+
glass: {
|
|
92
|
+
borderRadius: 999
|
|
93
|
+
},
|
|
89
94
|
circle: {
|
|
90
95
|
width: r(54),
|
|
91
96
|
height: r(54),
|
|
92
97
|
borderRadius: 999,
|
|
93
98
|
alignItems: 'center',
|
|
94
99
|
justifyContent: 'center',
|
|
95
|
-
borderWidth: StyleSheet.hairlineWidth
|
|
100
|
+
borderWidth: StyleSheet.hairlineWidth,
|
|
101
|
+
borderColor: darkColors.glassBorder,
|
|
102
|
+
overflow: 'hidden'
|
|
96
103
|
}
|
|
97
104
|
});
|
|
98
105
|
const makeTextStyles = () => StyleSheet.create({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["Pressable","StyleSheet","Text","View","Icon","useColors","r","rf","useThemedStyles","fw","scanChrome","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ScanToolbar","flash","bottomInset","onFlash","onAlbum","onClose","c","style","styles","bar","bottom","pointerEvents","children","ToolbarItem","icon","label","onPress","activeColor","primary","undefined","s","makeTextStyles","item","accessibilityRole","accessibilityLabel","pressed","circle","backgroundColor","
|
|
1
|
+
{"version":3,"names":["Pressable","StyleSheet","Text","View","Icon","GlassLayer","darkColors","useColors","r","rf","useThemedStyles","fw","scanChrome","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","ScanToolbar","flash","bottomInset","onFlash","onAlbum","onClose","c","style","styles","bar","bottom","pointerEvents","children","ToolbarItem","icon","label","onPress","activeColor","primary","undefined","s","makeTextStyles","item","accessibilityRole","accessibilityLabel","pressed","circle","backgroundColor","colorScheme","glass","testID","name","size","color","onPrimary","white","opacity","create","position","left","right","zIndex","flexDirection","justifyContent","columnGap","width","alignItems","rowGap","borderRadius","height","borderWidth","hairlineWidth","borderColor","glassBorder","overflow","fontSize","fontWeight","medium","toolbarLabel","textShadowColor","textShadowOffset","textShadowRadius"],"sourceRoot":"../../../src","sources":["Scanner/ScanToolbar.tsx"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AAChE,SACEC,IAAI,EACJC,UAAU,EACVC,UAAU,EACVC,SAAS,EACTC,CAAC,EACDC,EAAE,EACFC,eAAe,EACfC,EAAE,QAEG,2BAA2B;AAClC,SAASC,UAAU,QAAQ,iBAAc;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA,EAAAC,QAAA,IAAAC,SAAA;AAa1C;AACA,OAAO,SAASC,WAAWA,CAAC;EAC1BC,KAAK;EACLC,WAAW;EACXC,OAAO;EACPC,OAAO;EACPC;AACgB,CAAC,EAAE;EACnB,MAAMC,CAAC,GAAGlB,SAAS,CAAC,CAAC;EACrB,oBACES,KAAA,CAACb,IAAI;IACHuB,KAAK,EAAE,CAACC,MAAM,CAACC,GAAG,EAAE;MAAEC,MAAM,EAAER,WAAW,GAAGb,CAAC,CAAC,EAAE;IAAE,CAAC,CAAE;IACrDsB,aAAa,EAAC,UAAU;IAAAC,QAAA,GAEvBP,OAAO,iBAAIV,IAAA,CAACkB,WAAW;MAACC,IAAI,EAAC,MAAM;MAACC,KAAK,EAAC,cAAI;MAACC,OAAO,EAAEX;IAAQ,CAAE,CAAC,EACnEF,OAAO,iBACNR,IAAA,CAACkB,WAAW;MACVC,IAAI,EAAEb,KAAK,GAAG,UAAU,GAAG,WAAY;MACvCc,KAAK,EAAEd,KAAK,GAAG,KAAK,GAAG,KAAM;MAC7BgB,WAAW,EAAEhB,KAAK,GAAGK,CAAC,CAACY,OAAO,GAAGC,SAAU;MAC3CH,OAAO,EAAEb;IAAQ,CAClB,CACF,EACAC,OAAO,iBAAIT,IAAA,CAACkB,WAAW;MAACC,IAAI,EAAC,OAAO;MAACC,KAAK,EAAC,cAAI;MAACC,OAAO,EAAEZ;IAAQ,CAAE,CAAC;EAAA,CACjE,CAAC;AAEX;AAEA,SAASS,WAAWA,CAAC;EACnBC,IAAI;EACJC,KAAK;EACLE,WAAW;EACXD;AAMF,CAAC,EAAE;EACD,MAAMI,CAAC,GAAG7B,eAAe,CAAC8B,cAAc,CAAC;EACzC,MAAMf,CAAC,GAAGlB,SAAS,CAAC,CAAC;EACrB,oBACEO,IAAA,CAACd,SAAS;IACRmC,OAAO,EAAEA,OAAQ;IACjBT,KAAK,EAAEC,MAAM,CAACc,IAAK;IACnBC,iBAAiB,EAAC,QAAQ;IAC1BC,kBAAkB,EAAET,KAAM;IAAAH,QAAA,EAEzBA,CAAC;MAAEa;IAAQ,CAAC,kBACX5B,KAAA,CAAAE,SAAA;MAAAa,QAAA,gBACEf,KAAA,CAACb,IAAI;QACHuB,KAAK,EAAE,CACLC,MAAM,CAACkB,MAAM,EACbT,WAAW,GAAG;UAAEU,eAAe,EAAEV;QAAY,CAAC,GAAGE,SAAS,CAC1D;QAAAP,QAAA,GAED,CAACK,WAAW,iBACXtB,IAAA,CAACT,UAAU;UACT0C,WAAW,EAAC,MAAM;UAClBrB,KAAK,EAAEC,MAAM,CAACqB,KAAM;UACpBC,MAAM,EAAC;QAAoB,CAC5B,CACF,eACDnC,IAAA,CAACV,IAAI;UACH8C,IAAI,EAAEjB,IAAK;UACXkB,IAAI,EAAE3C,CAAC,CAAC,EAAE,CAAE;UACZ4C,KAAK,EAAEhB,WAAW,GAAGX,CAAC,CAAC4B,SAAS,GAAGzC,UAAU,CAAC0C,KAAM;UACpD5B,KAAK,EAAEkB,OAAO,IAAI;YAAEW,OAAO,EAAE;UAAI;QAAE,CACpC,CAAC;MAAA,CACE,CAAC,eACPzC,IAAA,CAACZ,IAAI;QAACwB,KAAK,EAAEa,CAAC,CAACL,KAAM;QAAAH,QAAA,EAAEG;MAAK,CAAO,CAAC;IAAA,CACpC;EACH,CACQ,CAAC;AAEhB;AAEA,MAAMP,MAAM,GAAG1B,UAAU,CAACuD,MAAM,CAAC;EAC/B5B,GAAG,EAAE;IACH6B,QAAQ,EAAE,UAAU;IACpBC,IAAI,EAAE,CAAC;IACPC,KAAK,EAAE,CAAC;IACRC,MAAM,EAAE,EAAE;IACVC,aAAa,EAAE,KAAK;IACpBC,cAAc,EAAE,QAAQ;IACxBC,SAAS,EAAEvD,CAAC,CAAC,EAAE;EACjB,CAAC;EACDiC,IAAI,EAAE;IAAEuB,KAAK,EAAExD,CAAC,CAAC,EAAE,CAAC;IAAEyD,UAAU,EAAE,QAAQ;IAAEC,MAAM,EAAE1D,CAAC,CAAC,CAAC;EAAE,CAAC;EAC1DwC,KAAK,EAAE;IAAEmB,YAAY,EAAE;EAAI,CAAC;EAC5BtB,MAAM,EAAE;IACNmB,KAAK,EAAExD,CAAC,CAAC,EAAE,CAAC;IACZ4D,MAAM,EAAE5D,CAAC,CAAC,EAAE,CAAC;IACb2D,YAAY,EAAE,GAAG;IACjBF,UAAU,EAAE,QAAQ;IACpBH,cAAc,EAAE,QAAQ;IACxBO,WAAW,EAAEpE,UAAU,CAACqE,aAAa;IACrCC,WAAW,EAAEjE,UAAU,CAACkE,WAAW;IACnCC,QAAQ,EAAE;EACZ;AACF,CAAC,CAAC;AAEF,MAAMjC,cAAc,GAAGA,CAAA,KACrBvC,UAAU,CAACuD,MAAM,CAAC;EAChBtB,KAAK,EAAE;IACLwC,QAAQ,EAAEjE,EAAE,CAAC,EAAE,CAAC;IAChBkE,UAAU,EAAEhE,EAAE,CAACiE,MAAM;IACrBxB,KAAK,EAAExC,UAAU,CAACiE,YAAY;IAC9BC,eAAe,EAAE,iBAAiB;IAClCC,gBAAgB,EAAE;MAAEf,KAAK,EAAE,CAAC;MAAEI,MAAM,EAAE;IAAE,CAAC;IACzCY,gBAAgB,EAAE;EACpB;AACF,CAAC,CAAC","ignoreList":[]}
|
|
@@ -6,12 +6,6 @@ export const scanChrome = {
|
|
|
6
6
|
/** 相机未就绪时的底色（深色实景占位）。 */
|
|
7
7
|
cameraBg: '#0c0b0a',
|
|
8
8
|
white: '#FFFFFF',
|
|
9
|
-
/** 顶栏关闭键玻璃底。 */
|
|
10
|
-
glassDisc: 'rgba(20,18,16,0.42)',
|
|
11
|
-
/** 工具栏未点亮玻璃底。 */
|
|
12
|
-
glassDisc2: 'rgba(28,26,24,0.5)',
|
|
13
|
-
glassBorder: 'rgba(255,255,255,0.16)',
|
|
14
|
-
glassBorderActive: 'rgba(255,255,255,0.25)',
|
|
15
9
|
/** 取景提示文字。 */
|
|
16
10
|
hintText: 'rgba(255,255,255,0.86)',
|
|
17
11
|
toolbarLabel: 'rgba(255,255,255,0.82)',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["scanChrome","cameraBg","white","
|
|
1
|
+
{"version":3,"names":["scanChrome","cameraBg","white","hintText","toolbarLabel","windowBorder","crosshair","textShadow"],"sourceRoot":"../../../src","sources":["Scanner/scanChrome.ts"],"mappings":";;AAAA;AACA;AACA,OAAO,MAAMA,UAAU,GAAG;EACxB;EACAC,QAAQ,EAAE,SAAS;EACnBC,KAAK,EAAE,SAAS;EAChB;EACAC,QAAQ,EAAE,wBAAwB;EAClCC,YAAY,EAAE,wBAAwB;EACtC;EACAC,YAAY,EAAE,wBAAwB;EACtCC,SAAS,EAAE,uBAAuB;EAClCC,UAAU,EAAE;AACd,CAAU","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResultFail.d.ts","sourceRoot":"","sources":["../../../../src/Scanner/ResultFail.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ResultFail.d.ts","sourceRoot":"","sources":["../../../../src/Scanner/ResultFail.tsx"],"names":[],"mappings":"AAYA,UAAU,eAAe;IACvB,WAAW,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,uCAAuC;IACvC,QAAQ,EAAE,MAAM,IAAI,CAAC;CACtB;AAID,wBAAgB,UAAU,CAAC,EAAE,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,eAAe,2CA6C5E"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ResultFocus.d.ts","sourceRoot":"","sources":["../../../../../src/Scanner/ResultFocus/ResultFocus.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ResultFocus.d.ts","sourceRoot":"","sources":["../../../../../src/Scanner/ResultFocus/ResultFocus.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAGhD,8EAA8E;AAC9E,wBAAgB,WAAW,CAAC,EAC1B,MAAM,EACN,WAAW,EACX,QAAQ,EACR,SAAS,GACV,EAAE,gBAAgB,2CAoBlB"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { type ColorTokens } from '@unif/react-native-design';
|
|
1
|
+
import { type ColorTokens, type ShadowTokens } from '@unif/react-native-design';
|
|
2
2
|
export declare const styles: {
|
|
3
3
|
wrap: {
|
|
4
4
|
position: "absolute";
|
|
@@ -6,6 +6,15 @@ export declare const styles: {
|
|
|
6
6
|
right: number;
|
|
7
7
|
zIndex: number;
|
|
8
8
|
};
|
|
9
|
+
glass: {
|
|
10
|
+
borderRadius: number;
|
|
11
|
+
};
|
|
12
|
+
surface: {
|
|
13
|
+
borderRadius: number;
|
|
14
|
+
borderWidth: number;
|
|
15
|
+
padding: number;
|
|
16
|
+
overflow: "hidden";
|
|
17
|
+
};
|
|
9
18
|
content: {
|
|
10
19
|
maxHeight: number;
|
|
11
20
|
marginVertical: number;
|
|
@@ -15,7 +24,21 @@ export declare const styles: {
|
|
|
15
24
|
columnGap: number;
|
|
16
25
|
};
|
|
17
26
|
};
|
|
18
|
-
export declare const makeStyles: (colors: ColorTokens) => {
|
|
27
|
+
export declare const makeStyles: (colors: ColorTokens, shadow: ShadowTokens) => {
|
|
28
|
+
shadow: {
|
|
29
|
+
shadowColor: string;
|
|
30
|
+
shadowOffset: {
|
|
31
|
+
readonly width: number;
|
|
32
|
+
readonly height: number;
|
|
33
|
+
};
|
|
34
|
+
shadowOpacity: number;
|
|
35
|
+
shadowRadius: number;
|
|
36
|
+
elevation: number;
|
|
37
|
+
borderRadius: number;
|
|
38
|
+
};
|
|
39
|
+
border: {
|
|
40
|
+
borderColor: string;
|
|
41
|
+
};
|
|
19
42
|
badge: {
|
|
20
43
|
fontSize: number;
|
|
21
44
|
fontWeight: "600";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/Scanner/ResultFocus/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAKL,KAAK,WAAW,
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../../../src/Scanner/ResultFocus/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAKL,KAAK,WAAW,EAChB,KAAK,YAAY,EAClB,MAAM,2BAA2B,CAAC;AAEnC,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;CAWjB,CAAC;AACH,eAAO,MAAM,UAAU,GAAI,QAAQ,WAAW,EAAE,QAAQ,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAYhE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ScanToolbar.d.ts","sourceRoot":"","sources":["../../../../src/Scanner/ScanToolbar.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ScanToolbar.d.ts","sourceRoot":"","sources":["../../../../src/Scanner/ScanToolbar.tsx"],"names":[],"mappings":"AAcA,UAAU,gBAAgB;IACxB,KAAK,EAAE,OAAO,CAAC;IACf,WAAW,EAAE,MAAM,CAAC;IACpB,mBAAmB;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,iCAAiC;IACjC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB;AAGD,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,WAAW,EACX,OAAO,EACP,OAAO,EACP,OAAO,GACR,EAAE,gBAAgB,2CAmBlB"}
|
|
@@ -2,12 +2,6 @@ export declare const scanChrome: {
|
|
|
2
2
|
/** 相机未就绪时的底色（深色实景占位）。 */
|
|
3
3
|
readonly cameraBg: "#0c0b0a";
|
|
4
4
|
readonly white: "#FFFFFF";
|
|
5
|
-
/** 顶栏关闭键玻璃底。 */
|
|
6
|
-
readonly glassDisc: "rgba(20,18,16,0.42)";
|
|
7
|
-
/** 工具栏未点亮玻璃底。 */
|
|
8
|
-
readonly glassDisc2: "rgba(28,26,24,0.5)";
|
|
9
|
-
readonly glassBorder: "rgba(255,255,255,0.16)";
|
|
10
|
-
readonly glassBorderActive: "rgba(255,255,255,0.25)";
|
|
11
5
|
/** 取景提示文字。 */
|
|
12
6
|
readonly hintText: "rgba(255,255,255,0.86)";
|
|
13
7
|
readonly toolbarLabel: "rgba(255,255,255,0.82)";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"scanChrome.d.ts","sourceRoot":"","sources":["../../../../src/Scanner/scanChrome.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;IACrB,yBAAyB;;;IAGzB,
|
|
1
|
+
{"version":3,"file":"scanChrome.d.ts","sourceRoot":"","sources":["../../../../src/Scanner/scanChrome.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;IACrB,yBAAyB;;;IAGzB,cAAc;;;IAGd,eAAe;;;;CAIP,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@unif/react-native-hms-scan",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.2.0",
|
|
4
4
|
"description": "Unif React Native 扫码：实时预览、二维码、条码和本地图片识别",
|
|
5
5
|
"main": "./lib/module/index.js",
|
|
6
6
|
"types": "./lib/typescript/src/index.d.ts",
|
|
@@ -92,7 +92,7 @@
|
|
|
92
92
|
"@types/jest": "^29.5.0",
|
|
93
93
|
"@types/react": "^19.2.0",
|
|
94
94
|
"@types/react-test-renderer": "^19",
|
|
95
|
-
"@unif/react-native-design": "0.
|
|
95
|
+
"@unif/react-native-design": ">=0.41.0",
|
|
96
96
|
"commitlint": "^20.5.0",
|
|
97
97
|
"del-cli": "^7.0.0",
|
|
98
98
|
"eslint": "^8.57.1",
|
|
@@ -118,7 +118,7 @@
|
|
|
118
118
|
},
|
|
119
119
|
"peerDependencies": {
|
|
120
120
|
"@callstack/liquid-glass": ">=0.8.2 <0.9.0",
|
|
121
|
-
"@unif/react-native-design": ">=0.
|
|
121
|
+
"@unif/react-native-design": ">=0.41.0",
|
|
122
122
|
"react": ">=19.2.3 <20.0.0",
|
|
123
123
|
"react-native": ">=0.86.0",
|
|
124
124
|
"react-native-gesture-handler": ">=3.0.0 <4.0.0",
|
|
@@ -3,6 +3,7 @@ import { Animated, StyleSheet, View } from 'react-native';
|
|
|
3
3
|
import {
|
|
4
4
|
Button,
|
|
5
5
|
Empty,
|
|
6
|
+
GlassLayer,
|
|
6
7
|
useThemedStyles,
|
|
7
8
|
r,
|
|
8
9
|
type ColorTokens,
|
|
@@ -45,24 +46,34 @@ export function ResultFail({ bottomInset, failed, onRescan }: ResultFailProps) {
|
|
|
45
46
|
},
|
|
46
47
|
]}
|
|
47
48
|
>
|
|
48
|
-
<View style={
|
|
49
|
-
|
|
50
|
-
<
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
failed
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
49
|
+
<View style={styles.surface}>
|
|
50
|
+
<GlassLayer style={styles.glass} testID="scan-failure-glass" />
|
|
51
|
+
<View style={s.grabber} />
|
|
52
|
+
<View style={[styles.inner, { paddingBottom: bottomInset + r(14) }]}>
|
|
53
|
+
<Empty
|
|
54
|
+
icon="error-alert"
|
|
55
|
+
title={failed ? '图片识别失败' : '未识别到条码'}
|
|
56
|
+
desc={
|
|
57
|
+
failed
|
|
58
|
+
? '无法读取或解码图片，请重试。'
|
|
59
|
+
: '请将条码完整置于框内、保持平整并对准光线后重试。'
|
|
60
|
+
}
|
|
61
|
+
/>
|
|
62
|
+
<Button label="重扫" variant="primary" block onPress={onRescan} />
|
|
63
|
+
</View>
|
|
60
64
|
</View>
|
|
61
65
|
</Animated.View>
|
|
62
66
|
);
|
|
63
67
|
}
|
|
64
68
|
|
|
65
69
|
const styles = StyleSheet.create({
|
|
70
|
+
glass: { borderTopLeftRadius: r(20), borderTopRightRadius: r(20) },
|
|
71
|
+
surface: {
|
|
72
|
+
borderTopLeftRadius: r(20),
|
|
73
|
+
borderTopRightRadius: r(20),
|
|
74
|
+
paddingTop: r(10),
|
|
75
|
+
overflow: 'hidden',
|
|
76
|
+
},
|
|
66
77
|
inner: { paddingHorizontal: r(18), paddingTop: r(8), rowGap: r(16) },
|
|
67
78
|
});
|
|
68
79
|
|
|
@@ -74,10 +85,8 @@ const makeStyles = (c: ColorTokens, shadow: ShadowTokens) =>
|
|
|
74
85
|
right: 0,
|
|
75
86
|
bottom: 0,
|
|
76
87
|
zIndex: 50,
|
|
77
|
-
backgroundColor: c.surface,
|
|
78
88
|
borderTopLeftRadius: r(20),
|
|
79
89
|
borderTopRightRadius: r(20),
|
|
80
|
-
paddingTop: r(10),
|
|
81
90
|
...shadow.floating,
|
|
82
91
|
},
|
|
83
92
|
grabber: {
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { ScrollView, Text, View } from 'react-native';
|
|
2
2
|
import {
|
|
3
3
|
Button,
|
|
4
|
-
|
|
5
|
-
useColors,
|
|
4
|
+
GlassLayer,
|
|
6
5
|
useThemedStyles,
|
|
7
6
|
r,
|
|
8
7
|
} from '@unif/react-native-design';
|
|
@@ -16,16 +15,11 @@ export function ResultFocus({
|
|
|
16
15
|
onRescan,
|
|
17
16
|
onConfirm,
|
|
18
17
|
}: ResultFocusProps) {
|
|
19
|
-
const colors = useColors();
|
|
20
18
|
const themed = useThemedStyles(makeStyles);
|
|
21
19
|
return (
|
|
22
|
-
<View style={[styles.wrap, { bottom: bottomInset + r(18) }]}>
|
|
23
|
-
<
|
|
24
|
-
|
|
25
|
-
borderWidth={2}
|
|
26
|
-
borderRadius={r(16)}
|
|
27
|
-
padding={r(14)}
|
|
28
|
-
>
|
|
20
|
+
<View style={[styles.wrap, themed.shadow, { bottom: bottomInset + r(18) }]}>
|
|
21
|
+
<View style={[styles.surface, themed.border]}>
|
|
22
|
+
<GlassLayer style={styles.glass} testID="scan-result-glass" />
|
|
29
23
|
<Text style={themed.badge}>已识别</Text>
|
|
30
24
|
<Text style={themed.format}>{result.format}</Text>
|
|
31
25
|
<ScrollView style={styles.content}>
|
|
@@ -37,7 +31,7 @@ export function ResultFocus({
|
|
|
37
31
|
<Button label="重扫" variant="secondary" block onPress={onRescan} />
|
|
38
32
|
<Button label="选用" variant="primary" block onPress={onConfirm} />
|
|
39
33
|
</View>
|
|
40
|
-
</
|
|
34
|
+
</View>
|
|
41
35
|
</View>
|
|
42
36
|
);
|
|
43
37
|
}
|
|
@@ -5,15 +5,25 @@ import {
|
|
|
5
5
|
fw,
|
|
6
6
|
fontMono,
|
|
7
7
|
type ColorTokens,
|
|
8
|
+
type ShadowTokens,
|
|
8
9
|
} from '@unif/react-native-design';
|
|
9
10
|
|
|
10
11
|
export const styles = StyleSheet.create({
|
|
11
12
|
wrap: { position: 'absolute', left: r(16), right: r(16), zIndex: 50 },
|
|
13
|
+
glass: { borderRadius: r(16) },
|
|
14
|
+
surface: {
|
|
15
|
+
borderRadius: r(16),
|
|
16
|
+
borderWidth: 2,
|
|
17
|
+
padding: r(14),
|
|
18
|
+
overflow: 'hidden',
|
|
19
|
+
},
|
|
12
20
|
content: { maxHeight: r(220), marginVertical: r(14) },
|
|
13
21
|
actions: { flexDirection: 'row', columnGap: r(10) },
|
|
14
22
|
});
|
|
15
|
-
export const makeStyles = (colors: ColorTokens) =>
|
|
23
|
+
export const makeStyles = (colors: ColorTokens, shadow: ShadowTokens) =>
|
|
16
24
|
StyleSheet.create({
|
|
25
|
+
shadow: { borderRadius: r(16), ...shadow.card },
|
|
26
|
+
border: { borderColor: colors.primary },
|
|
17
27
|
badge: { fontSize: rf(13), fontWeight: fw.semi, color: colors.foreground },
|
|
18
28
|
format: {
|
|
19
29
|
fontSize: rf(12),
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import { Pressable, StyleSheet, Text, View } from 'react-native';
|
|
2
2
|
import {
|
|
3
3
|
Icon,
|
|
4
|
+
GlassLayer,
|
|
5
|
+
darkColors,
|
|
4
6
|
useColors,
|
|
5
7
|
r,
|
|
6
8
|
rf,
|
|
@@ -61,6 +63,7 @@ function ToolbarItem({
|
|
|
61
63
|
onPress: () => void;
|
|
62
64
|
}) {
|
|
63
65
|
const s = useThemedStyles(makeTextStyles);
|
|
66
|
+
const c = useColors();
|
|
64
67
|
return (
|
|
65
68
|
<Pressable
|
|
66
69
|
onPress={onPress}
|
|
@@ -73,19 +76,22 @@ function ToolbarItem({
|
|
|
73
76
|
<View
|
|
74
77
|
style={[
|
|
75
78
|
styles.circle,
|
|
76
|
-
activeColor
|
|
77
|
-
? {
|
|
78
|
-
backgroundColor: activeColor,
|
|
79
|
-
borderColor: scanChrome.glassBorderActive,
|
|
80
|
-
}
|
|
81
|
-
: {
|
|
82
|
-
backgroundColor: scanChrome.glassDisc2,
|
|
83
|
-
borderColor: scanChrome.glassBorder,
|
|
84
|
-
},
|
|
85
|
-
pressed && { opacity: 0.7 },
|
|
79
|
+
activeColor ? { backgroundColor: activeColor } : undefined,
|
|
86
80
|
]}
|
|
87
81
|
>
|
|
88
|
-
|
|
82
|
+
{!activeColor && (
|
|
83
|
+
<GlassLayer
|
|
84
|
+
colorScheme="dark"
|
|
85
|
+
style={styles.glass}
|
|
86
|
+
testID="scan-toolbar-glass"
|
|
87
|
+
/>
|
|
88
|
+
)}
|
|
89
|
+
<Icon
|
|
90
|
+
name={icon}
|
|
91
|
+
size={r(23)}
|
|
92
|
+
color={activeColor ? c.onPrimary : scanChrome.white}
|
|
93
|
+
style={pressed && { opacity: 0.7 }}
|
|
94
|
+
/>
|
|
89
95
|
</View>
|
|
90
96
|
<Text style={s.label}>{label}</Text>
|
|
91
97
|
</>
|
|
@@ -105,6 +111,7 @@ const styles = StyleSheet.create({
|
|
|
105
111
|
columnGap: r(40),
|
|
106
112
|
},
|
|
107
113
|
item: { width: r(72), alignItems: 'center', rowGap: r(7) },
|
|
114
|
+
glass: { borderRadius: 999 },
|
|
108
115
|
circle: {
|
|
109
116
|
width: r(54),
|
|
110
117
|
height: r(54),
|
|
@@ -112,6 +119,8 @@ const styles = StyleSheet.create({
|
|
|
112
119
|
alignItems: 'center',
|
|
113
120
|
justifyContent: 'center',
|
|
114
121
|
borderWidth: StyleSheet.hairlineWidth,
|
|
122
|
+
borderColor: darkColors.glassBorder,
|
|
123
|
+
overflow: 'hidden',
|
|
115
124
|
},
|
|
116
125
|
});
|
|
117
126
|
|
|
@@ -4,12 +4,6 @@ export const scanChrome = {
|
|
|
4
4
|
/** 相机未就绪时的底色（深色实景占位）。 */
|
|
5
5
|
cameraBg: '#0c0b0a',
|
|
6
6
|
white: '#FFFFFF',
|
|
7
|
-
/** 顶栏关闭键玻璃底。 */
|
|
8
|
-
glassDisc: 'rgba(20,18,16,0.42)',
|
|
9
|
-
/** 工具栏未点亮玻璃底。 */
|
|
10
|
-
glassDisc2: 'rgba(28,26,24,0.5)',
|
|
11
|
-
glassBorder: 'rgba(255,255,255,0.16)',
|
|
12
|
-
glassBorderActive: 'rgba(255,255,255,0.25)',
|
|
13
7
|
/** 取景提示文字。 */
|
|
14
8
|
hintText: 'rgba(255,255,255,0.86)',
|
|
15
9
|
toolbarLabel: 'rgba(255,255,255,0.82)',
|