@aks-dev/easyui 1.0.163 → 1.1.2

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.
Files changed (173) hide show
  1. package/dist/components/AnimationModal/AnimationModal.js +151 -0
  2. package/dist/components/DottedLine/DottedLine.js +50 -0
  3. package/{lib/Echarts/EchartsView.tsx → dist/components/EchartsView/EchartsView.js} +74 -113
  4. package/{lib/Echarts/helper.tsx → dist/components/EchartsView/helper.js} +17 -24
  5. package/dist/components/Hud/AlertBottomView/AlertBottomView.js +174 -0
  6. package/dist/components/Hud/AlertSheetView/AlertSheetView.js +117 -0
  7. package/dist/components/Hud/AlertView/AlertView.js +184 -0
  8. package/dist/components/Hud/Hud.js +29 -0
  9. package/dist/components/Hud/Loading/Loading.js +66 -0
  10. package/dist/components/Hud/PopoverView/PopoverView.js +47 -0
  11. package/dist/components/Hud/Scanner/Scanner.js +301 -0
  12. package/dist/components/Hud/Toast/Toast.js +71 -0
  13. package/dist/components/MenuView/MenuView.js +184 -0
  14. package/{lib/Modal/Modal.tsx → dist/components/Modal/Modal.js} +1 -4
  15. package/dist/components/MutiPictureView/MutiPictureView.js +239 -0
  16. package/dist/components/PictureViewer/PictureViewer.js +54 -0
  17. package/dist/components/RefreshList/RefreshList.js +155 -0
  18. package/dist/components/RichText/RichText.js +56 -0
  19. package/dist/components/StickHeaderView/StickHeaderView.js +37 -0
  20. package/dist/components/TableCell/TableCell.js +97 -0
  21. package/dist/components/TextInputArea/TextInputArea.js +65 -0
  22. package/dist/components/WithLoadingContainer/WithLoadingContainer.js +77 -0
  23. package/dist/index.js +31 -0
  24. package/dist/jsbridge/RNEasyui.js +46 -0
  25. package/{jsbridge/UpgradeModule.ts → dist/jsbridge/UpgradeModule.js} +25 -23
  26. package/{jsbridge/index.ts → dist/jsbridge/index.js} +2 -2
  27. package/{screen/index.ts → dist/screen/index.js} +2 -2
  28. package/dist/screen/px2dp.js +45 -0
  29. package/{screen/px2sp.ts → dist/screen/px2sp.js} +13 -20
  30. package/{screen/text-fit.ts → dist/screen/text-fit.js} +10 -20
  31. package/{utils/index.ts → dist/utils/index.js} +2 -2
  32. package/{utils/lazy.ts → dist/utils/lazy.js} +164 -165
  33. package/dist/utils/mode.js +50 -0
  34. package/package.json +31 -19
  35. package/readme.md +3 -3
  36. package/types/components/AnimationModal/AnimationModal.d.ts +27 -0
  37. package/types/components/AnimationModal/AnimationModal.d.ts.map +1 -0
  38. package/types/components/DottedLine/DottedLine.d.ts +10 -0
  39. package/types/components/DottedLine/DottedLine.d.ts.map +1 -0
  40. package/types/components/EchartsView/EchartsView.d.ts +10 -0
  41. package/types/components/EchartsView/EchartsView.d.ts.map +1 -0
  42. package/types/components/EchartsView/helper.d.ts +10 -0
  43. package/types/components/EchartsView/helper.d.ts.map +1 -0
  44. package/types/components/Hud/AlertBottomView/AlertBottomView.d.ts +25 -0
  45. package/types/components/Hud/AlertBottomView/AlertBottomView.d.ts.map +1 -0
  46. package/types/components/Hud/AlertSheetView/AlertSheetView.d.ts +19 -0
  47. package/types/components/Hud/AlertSheetView/AlertSheetView.d.ts.map +1 -0
  48. package/types/components/Hud/AlertView/AlertView.d.ts +25 -0
  49. package/types/components/Hud/AlertView/AlertView.d.ts.map +1 -0
  50. package/types/components/Hud/Hud.d.ts +11 -0
  51. package/types/components/Hud/Hud.d.ts.map +1 -0
  52. package/types/components/Hud/Loading/Loading.d.ts +11 -0
  53. package/types/components/Hud/Loading/Loading.d.ts.map +1 -0
  54. package/types/components/Hud/PopoverView/PopoverView.d.ts +17 -0
  55. package/types/components/Hud/PopoverView/PopoverView.d.ts.map +1 -0
  56. package/types/components/Hud/Scanner/Scanner.d.ts +12 -0
  57. package/types/components/Hud/Scanner/Scanner.d.ts.map +1 -0
  58. package/types/components/Hud/Toast/Toast.d.ts +9 -0
  59. package/types/components/Hud/Toast/Toast.d.ts.map +1 -0
  60. package/types/components/MenuView/MenuView.d.ts +21 -0
  61. package/types/components/MenuView/MenuView.d.ts.map +1 -0
  62. package/types/components/Modal/Modal.d.ts +2 -0
  63. package/types/components/Modal/Modal.d.ts.map +1 -0
  64. package/{lib/MutiPictureView/index.ts → types/components/MutiPictureView/MutiPictureView.d.ts} +18 -31
  65. package/types/components/MutiPictureView/MutiPictureView.d.ts.map +1 -0
  66. package/types/components/PictureViewer/PictureViewer.d.ts +17 -0
  67. package/types/components/PictureViewer/PictureViewer.d.ts.map +1 -0
  68. package/types/components/RefreshList/RefreshList.d.ts +45 -0
  69. package/types/components/RefreshList/RefreshList.d.ts.map +1 -0
  70. package/types/components/RichText/RichText.d.ts +12 -0
  71. package/types/components/RichText/RichText.d.ts.map +1 -0
  72. package/types/components/StickHeaderView/StickHeaderView.d.ts +15 -0
  73. package/types/components/StickHeaderView/StickHeaderView.d.ts.map +1 -0
  74. package/{lib/TableCell/index.ts → types/components/TableCell/TableCell.d.ts} +8 -30
  75. package/types/components/TableCell/TableCell.d.ts.map +1 -0
  76. package/types/components/TextInputArea/TextInputArea.d.ts +17 -0
  77. package/types/components/TextInputArea/TextInputArea.d.ts.map +1 -0
  78. package/types/components/WithLoadingContainer/WithLoadingContainer.d.ts +23 -0
  79. package/types/components/WithLoadingContainer/WithLoadingContainer.d.ts.map +1 -0
  80. package/types/index.d.ts +22 -0
  81. package/types/index.d.ts.map +1 -0
  82. package/types/jsbridge/RNEasyui.d.ts +23 -0
  83. package/types/jsbridge/RNEasyui.d.ts.map +1 -0
  84. package/types/jsbridge/UpgradeModule.d.ts +26 -0
  85. package/types/jsbridge/UpgradeModule.d.ts.map +1 -0
  86. package/types/jsbridge/index.d.ts +3 -0
  87. package/types/jsbridge/index.d.ts.map +1 -0
  88. package/types/screen/index.d.ts +3 -0
  89. package/types/screen/index.d.ts.map +1 -0
  90. package/{screen/index.d.ts → types/screen/px2dp.d.ts} +6 -12
  91. package/types/screen/px2dp.d.ts.map +1 -0
  92. package/types/screen/px2sp.d.ts +2 -0
  93. package/types/screen/px2sp.d.ts.map +1 -0
  94. package/types/screen/text-fit.d.ts +5 -0
  95. package/types/screen/text-fit.d.ts.map +1 -0
  96. package/types/utils/index.d.ts +3 -0
  97. package/types/utils/index.d.ts.map +1 -0
  98. package/{utils/index.d.ts → types/utils/lazy.d.ts} +15 -53
  99. package/types/utils/lazy.d.ts.map +1 -0
  100. package/types/utils/mode.d.ts +24 -0
  101. package/types/utils/mode.d.ts.map +1 -0
  102. package/android/.DS_Store +0 -0
  103. package/android/src/.DS_Store +0 -0
  104. package/android/src/main/.DS_Store +0 -0
  105. package/android/src/main/java/.DS_Store +0 -0
  106. package/android/src/main/java/com/.DS_Store +0 -0
  107. package/android/src/main/java/com/easyui/.DS_Store +0 -0
  108. package/i.sh +0 -23
  109. package/ios/.DS_Store +0 -0
  110. package/ios/assets/.DS_Store +0 -0
  111. package/ios/views/.DS_Store +0 -0
  112. package/jsbridge/RNEasyui.ts +0 -42
  113. package/jsbridge/index.d.ts +0 -67
  114. package/lib/.DS_Store +0 -0
  115. package/lib/AnimationModal/AnimationModal.tsx +0 -201
  116. package/lib/AnimationModal/index.d.ts +0 -41
  117. package/lib/Badge/Badge.tsx +0 -40
  118. package/lib/Badge/index.ts +0 -21
  119. package/lib/DottedLine/DottedLine.tsx +0 -66
  120. package/lib/DottedLine/index.ts +0 -18
  121. package/lib/Echarts/demo.tsx +0 -235
  122. package/lib/Echarts/index.ts +0 -29
  123. package/lib/Hud/.DS_Store +0 -0
  124. package/lib/Hud/AlertBottomView/AlertBottomView.tsx +0 -228
  125. package/lib/Hud/AlertBottomView/index.d.ts +0 -42
  126. package/lib/Hud/AlertSheetView/AlertSheetView.tsx +0 -179
  127. package/lib/Hud/AlertSheetView/index.d.ts +0 -35
  128. package/lib/Hud/AlertView/AlertView.tsx +0 -234
  129. package/lib/Hud/AlertView/index.d.ts +0 -46
  130. package/lib/Hud/Hud.tsx +0 -67
  131. package/lib/Hud/Loading/Loading.tsx +0 -87
  132. package/lib/Hud/Loading/index.d.ts +0 -38
  133. package/lib/Hud/PopoverView/PopoverView.tsx +0 -66
  134. package/lib/Hud/PopoverView/index.d.ts +0 -39
  135. package/lib/Hud/Scanner/Scanner.tsx +0 -250
  136. package/lib/Hud/Scanner/index.d.ts +0 -42
  137. package/lib/Hud/Toast/Toast.tsx +0 -86
  138. package/lib/Hud/Toast/index.d.ts +0 -22
  139. package/lib/Hud/index.ts +0 -20
  140. package/lib/MenuView/MenuView.tsx +0 -252
  141. package/lib/MenuView/index.ts +0 -31
  142. package/lib/Modal/index.ts +0 -10
  143. package/lib/MutiPictureView/MutiPictureView.tsx +0 -259
  144. package/lib/PictureViewer/PictureViewer.tsx +0 -80
  145. package/lib/PictureViewer/index.ts +0 -26
  146. package/lib/RefreshList/RefreshList.tsx +0 -235
  147. package/lib/RefreshList/demo.tsx +0 -30
  148. package/lib/RefreshList/demo1.tsx +0 -60
  149. package/lib/RefreshList/demo2.tsx +0 -46
  150. package/lib/RefreshList/index.ts +0 -84
  151. package/lib/RichText/RichText.tsx +0 -82
  152. package/lib/RichText/index.ts +0 -21
  153. package/lib/StickHeaderView/StickHeaderView.tsx +0 -65
  154. package/lib/StickHeaderView/demo.tsx +0 -104
  155. package/lib/StickHeaderView/index.ts +0 -26
  156. package/lib/TableCell/TableCell.tsx +0 -118
  157. package/lib/TextInputArea/TextInputArea.tsx +0 -89
  158. package/lib/TextInputArea/index.d.ts +0 -33
  159. package/lib/WithLoadingContainer/WithLoadingContainer.tsx +0 -93
  160. package/lib/WithLoadingContainer/index.ts +0 -36
  161. package/screen/px2dp.ts +0 -51
  162. package/src/index.d.ts +0 -42
  163. package/src/index.ts +0 -54
  164. package/utils/mode.ts +0 -48
  165. /package/{lib/Hud/Scanner → dist/components/Hud/Scanner/assets}/flashlight-blue.png +0 -0
  166. /package/{lib/Hud/Scanner → dist/components/Hud/Scanner/assets}/flashlight-white.png +0 -0
  167. /package/{lib/Hud/Scanner → dist/components/Hud/Scanner/assets}/icon_back_white.png +0 -0
  168. /package/{lib/MutiPictureView → dist/components/MutiPictureView/assets}/icon_add_image.png +0 -0
  169. /package/{lib/MutiPictureView → dist/components/MutiPictureView/assets}/icon_del_image.png +0 -0
  170. /package/{lib/TableCell → dist/components/TableCell/assets}/back.png +0 -0
  171. /package/{lib/WithLoadingContainer → dist/components/WithLoadingContainer/assets}/loading.gif +0 -0
  172. /package/{lib/WithLoadingContainer → dist/components/WithLoadingContainer/assets}/loading3.gif +0 -0
  173. /package/{lib → dist/components}/index.md +0 -0
@@ -1,40 +0,0 @@
1
- /*
2
- * @Author: shiguo
3
- * @Date: 2022-04-21 14:40:29
4
- * @LastEditors: shiguo
5
- * @LastEditTime: 2022-07-08 15:40:21
6
- * @FilePath: /@aks-dev/easyui/lib/Badge/Badge.tsx
7
- */
8
- import React from 'react'
9
- import { View, Text, } from 'react-native'
10
- import { px2dp } from '../../screen/px2dp'
11
- import { px2sp } from '../../screen/px2sp'
12
-
13
-
14
- import type { BadgeProps } from '.'
15
-
16
-
17
-
18
- export const Badge: React.FC<BadgeProps>
19
- = (props) => {
20
- if (isNaN(+props.count) || Number(props.count) == 0) return <View />
21
- return (
22
-
23
- <View style={
24
- [
25
- {
26
- flexGrow: 0, flexShrink: 1, zIndex: 1,
27
- // paddingHorizontal: px2dp(0),
28
- height: px2dp(16), minWidth: px2dp(16), borderRadius: px2dp(8),
29
- justifyContent: 'center', alignItems: 'center',
30
- backgroundColor: 'red'
31
- },
32
- props.style
33
- ]
34
- } >
35
- <Text style={{ fontSize: px2sp(12), color: 'white', textAlign: 'center' }}> {props.count > 99 ? '+99' : props.count} </Text>
36
-
37
- </View>
38
- )
39
- }
40
-
@@ -1,21 +0,0 @@
1
- /*
2
- * @Author: shiguo
3
- * @Date: 2022-04-21 14:43:14
4
- * @LastEditors: shiguo
5
- * @LastEditTime: 2022-07-08 15:40:30
6
- * @FilePath: /@aks-dev/easyui/lib/Badge/index.ts
7
- */
8
- import * as React from 'react'
9
- import { StyleProp, ViewStyle } from 'react-native'
10
-
11
-
12
-
13
-
14
-
15
- export declare type BadgeProps = {
16
- count: number | string;
17
- style?: StyleProp<ViewStyle>
18
- }
19
-
20
- export declare const Badge: React.FC<BadgeProps>
21
-
@@ -1,66 +0,0 @@
1
- /*
2
- * @Author: shiguo
3
- * @Date: 2022-07-12 15:30:19
4
- * @LastEditors: shiguo
5
- * @LastEditTime: 2022-07-12 15:33:06
6
- * @FilePath: /@aks-dev/easyui/lib/DottedLine/DottedLine.tsx
7
- */
8
- import React from 'react'
9
- import { StyleSheet, View } from 'react-native'
10
- import type { DottedLineProps } from '.'
11
- export default (props: DottedLineProps) => {
12
- const {
13
- vertical = false,
14
- dottedColor,
15
- dottedCount = 200,
16
- ...rest
17
- } = props
18
- const arrs = Array.from({ length: dottedCount }, (k, v) => v)
19
- return (
20
- <View style={{ ...styles.container, flexDirection: vertical ? 'column' : 'row', ...rest.style as any }}>
21
- {
22
- arrs.map((item, index) => {
23
- return <View
24
- key={`dotted-${index}`}
25
- style={{
26
- ...(vertical ? styles.dotted_vertical : styles.dotted_horizontal),
27
- ...(dottedColor && { backgroundColor: dottedColor })
28
- }} />
29
- })
30
- }
31
- </View>
32
- )
33
-
34
- }
35
-
36
-
37
-
38
-
39
-
40
- const styles = StyleSheet.create({
41
- container: {
42
- display: 'flex',
43
- flexGrow: 1,
44
- overflow: 'hidden',
45
- flexDirection: 'row',
46
- flexWrap: 'nowrap',
47
- },
48
-
49
- dotted_horizontal: {
50
- flexGrow: 0,
51
- flexShrink: 0,
52
- width: 2,
53
- height: 1,
54
- marginRight: 2,
55
- backgroundColor: '#cccccc',
56
- },
57
- dotted_vertical: {
58
- flexGrow: 0,
59
- flexShrink: 0,
60
- width: 1,
61
- height: 2,
62
- marginBottom: 2,
63
- backgroundColor: '#cccccc',
64
- }
65
-
66
- })
@@ -1,18 +0,0 @@
1
- /*
2
- * @Author: shiguo
3
- * @Date: 2022-07-12 15:30:28
4
- * @LastEditors: shiguo
5
- * @LastEditTime: 2022-07-12 15:31:31
6
- * @FilePath: /@aks-dev/easyui/lib/DottedLine/index.ts
7
- */
8
- import React from 'react'
9
- import { ViewProps } from 'react-native'
10
-
11
- export type DottedLineProps = {
12
- vertical?: boolean,
13
- dottedColor?: string,
14
- dottedCount?: number
15
- } & ViewProps
16
-
17
-
18
- export declare const DottedLine: React.FC<DottedLineProps>
@@ -1,235 +0,0 @@
1
- /*
2
- * @Author: shiguo
3
- * @Date: 2022-05-06 12:05:42
4
- * @LastEditors: shiguo
5
- * @LastEditTime: 2022-05-06 12:07:58
6
- * @FilePath: /@aks/easyui/lib/Echarts/demo.tsx
7
- */
8
-
9
-
10
-
11
- import * as React from 'react'
12
- import { View, StyleSheet, } from 'react-native';
13
-
14
- import EchartsView from './EchartsView'
15
- import {echarts} from '.'
16
-
17
-
18
-
19
- export default () => {
20
-
21
-
22
-
23
- let option = {
24
- color: ['#80FFA5', '#00DDFF', '#37A2FF', '#FF0087', '#FFBF00'],
25
- title: {
26
- text: 'Gradient Stacked Area Chart'
27
- },
28
- tooltip: {
29
- trigger: 'axis',
30
- axisPointer: {
31
- type: 'cross',
32
- label: {
33
- backgroundColor: '#6a7985'
34
- }
35
- }
36
- },
37
- legend: {
38
- data: ['Line 1', 'Line 2', 'Line 3', 'Line 4', 'Line 5']
39
- },
40
- toolbox: {
41
- feature: {
42
- saveAsImage: {}
43
- }
44
- },
45
- grid: {
46
- left: '3%',
47
- right: '4%',
48
- bottom: '3%',
49
- containLabel: true
50
- },
51
- xAxis: [
52
- {
53
- type: 'category',
54
- boundaryGap: false,
55
- data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
56
- }
57
- ],
58
- yAxis: [
59
- {
60
- type: 'value'
61
- }
62
- ],
63
- series: [
64
- {
65
- name: 'Line 1',
66
- type: 'line',
67
- stack: 'Total',
68
- smooth: true,
69
- lineStyle: {
70
- width: 0
71
- },
72
- showSymbol: false,
73
- areaStyle: {
74
- opacity: 0.8,
75
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
76
- {
77
- offset: 0,
78
- color: 'rgb(128, 255, 165)'
79
- },
80
- {
81
- offset: 1,
82
- color: 'rgb(1, 191, 236)'
83
- }
84
- ])
85
- },
86
- emphasis: {
87
- focus: 'series'
88
- },
89
- data: [140, 232, 101, 264, 90, 340, 250]
90
- },
91
- {
92
- name: 'Line 2',
93
- type: 'line',
94
- stack: 'Total',
95
- smooth: true,
96
- lineStyle: {
97
- width: 0
98
- },
99
- showSymbol: false,
100
- areaStyle: {
101
- opacity: 0.8,
102
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
103
- {
104
- offset: 0,
105
- color: 'rgb(0, 221, 255)'
106
- },
107
- {
108
- offset: 1,
109
- color: 'rgb(77, 119, 255)'
110
- }
111
- ])
112
- },
113
- emphasis: {
114
- focus: 'series'
115
- },
116
- data: [120, 282, 111, 234, 220, 340, 310]
117
- },
118
- {
119
- name: 'Line 3',
120
- type: 'line',
121
- stack: 'Total',
122
- smooth: true,
123
- lineStyle: {
124
- width: 0
125
- },
126
- showSymbol: false,
127
- areaStyle: {
128
- opacity: 0.8,
129
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
130
- {
131
- offset: 0,
132
- color: 'rgb(55, 162, 255)'
133
- },
134
- {
135
- offset: 1,
136
- color: 'rgb(116, 21, 219)'
137
- }
138
- ])
139
- },
140
- emphasis: {
141
- focus: 'series'
142
- },
143
- data: [320, 132, 201, 334, 190, 130, 220]
144
- },
145
- {
146
- name: 'Line 4',
147
- type: 'line',
148
- stack: 'Total',
149
- smooth: true,
150
- lineStyle: {
151
- width: 0
152
- },
153
- showSymbol: false,
154
- areaStyle: {
155
- opacity: 0.8,
156
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
157
- {
158
- offset: 0,
159
- color: 'rgb(255, 0, 135)'
160
- },
161
- {
162
- offset: 1,
163
- color: 'rgb(135, 0, 157)'
164
- }
165
- ])
166
- },
167
- emphasis: {
168
- focus: 'series'
169
- },
170
- data: [220, 402, 231, 134, 190, 230, 120]
171
- },
172
- {
173
- name: 'Line 5',
174
- type: 'line',
175
- stack: 'Total',
176
- smooth: true,
177
- lineStyle: {
178
- width: 0
179
- },
180
- showSymbol: false,
181
- label: {
182
- show: true,
183
- position: 'top'
184
- },
185
- areaStyle: {
186
- opacity: 0.8,
187
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
188
- {
189
- offset: 0,
190
- color: 'rgb(255, 191, 0)'
191
- },
192
- {
193
- offset: 1,
194
- color: 'rgb(224, 62, 76)'
195
- }
196
- ])
197
- },
198
- emphasis: {
199
- focus: 'series'
200
- },
201
- data: [220, 302, 181, 234, 210, 290, 150]
202
- }
203
- ]
204
- };
205
-
206
-
207
-
208
-
209
-
210
- return (
211
- <View style={styles.container}>
212
-
213
- <View style={{ width: 100, height: 100, backgroundColor: 'pink' }} />
214
- <EchartsView
215
- option={option}
216
- style={{
217
- marginTop: 100,
218
- marginHorizontal: 20,
219
- height: 200,
220
- // backgroundColor: 'red'
221
- }}
222
- />
223
-
224
- </View>
225
- )
226
- }
227
-
228
-
229
- const styles = StyleSheet.create({
230
- container: {
231
- flexGrow: 1,
232
- display: 'flex',
233
- },
234
-
235
- })
@@ -1,29 +0,0 @@
1
- /*
2
- * @Author: shiguo
3
- * @Date: 2022-05-05 14:52:22
4
- * @LastEditors: shiguo
5
- * @LastEditTime: 2022-05-06 10:10:43
6
- * @FilePath: /@aks/easyui/lib/Echarts/index.ts
7
- */
8
-
9
- import * as React from 'react'
10
- import { StyleProp, ViewStyle } from 'react-native'
11
-
12
- export type EchartsViewProps = {
13
- option: any;
14
- style?: StyleProp<ViewStyle>;
15
- renderLoading?: () => React.ReactElement;
16
- }
17
-
18
-
19
-
20
- export declare const EchartsView: React.FC<EchartsViewProps>;
21
-
22
-
23
-
24
- import * as echarts from 'echarts/core'
25
-
26
-
27
- export {
28
- echarts
29
- }
package/lib/Hud/.DS_Store DELETED
Binary file
@@ -1,228 +0,0 @@
1
- import * as React from 'react'
2
- import { View, Text, StyleSheet, Platform, StatusBar, TouchableOpacity,Dimensions } from 'react-native'
3
- import Modal from 'react-native-modal'
4
-
5
- import { px2dp, deviceWidth } from '../../../screen/px2dp'
6
- import { px2sp } from '../../../screen/px2sp'
7
-
8
- import { AlertBottomOptions } from '.'
9
-
10
-
11
-
12
- type State = {
13
- visible: boolean;
14
-
15
- } & Omit<AlertBottomOptions, 'cancel' | 'confirm'>
16
-
17
-
18
-
19
-
20
-
21
- export default React.forwardRef<AlertBottomOptions.RefAttributes, {}>((_, ref) => {
22
-
23
-
24
- const defaultState: Partial<State> = {
25
- visible: false,
26
- cancelText: '取消',
27
- confirmText: '确定',
28
- }
29
- const [state, setState] = React.useState<Partial<State>>(defaultState)
30
- const cancelCallbackRef = React.useRef<Function>();
31
- const confirmCallbackRef = React.useRef<Function>();
32
-
33
-
34
-
35
- React.useImperativeHandle<unknown, AlertBottomOptions.RefAttributes>(ref, () => ({
36
- show: async (options: Partial<AlertBottomOptions>) => {
37
-
38
- setState(Object.assign({}, defaultState, { visible: true }, options))
39
- cancelCallbackRef.current = options.cancel;
40
- confirmCallbackRef.current = options.confirm;
41
-
42
- },
43
- hide
44
- }), [])
45
-
46
-
47
- const hide = async () => {
48
- setState(defaultState)
49
- }
50
-
51
-
52
- React.useEffect(() => {
53
- if (Platform.OS == 'android') {
54
- if (state.visible) {
55
- StatusBar.setBackgroundColor('black')
56
- StatusBar.setBarStyle('light-content')
57
- } else {
58
- StatusBar.setBackgroundColor('transparent')
59
- StatusBar.setBarStyle('dark-content')
60
- }
61
- }
62
-
63
- }, [state.visible])
64
- return (
65
- <Modal
66
- hideModalContentWhileAnimating={true}//通过隐藏模态内容直到动画完成来增强性能
67
- useNativeDriver={true}//定义动画是否应使用本机驱动程序
68
- animationIn='slideInUp'
69
- animationOut='slideOutDown'
70
- onBackButtonPress={() => {
71
- //按下Android后退按钮时调用
72
- hide()
73
- }}
74
- onBackdropPress={() => {
75
- //按下背景时调用
76
- hide()
77
- }}
78
- isVisible={state.visible}
79
- style={{ margin: 0 }}
80
- deviceHeight={Dimensions.get('screen').height}
81
- >
82
- <View style={styles.container}>
83
- <View style={[styles.wrapper, state.wrapperStyle]}>
84
- {state.title && <Text style={styles.titleText}>{state.title}</Text>}
85
- <View style={[state.contentContainerStyle]}>
86
- {(() => {
87
- if (typeof state.content == 'string') return <Text style={styles.contentText}>{state.content}</Text>
88
- if (React.isValidElement(state.content)) return state.content;
89
- return <View />
90
- })()}
91
- </View>
92
- {
93
- (state.cancelText || state.confirmText) &&
94
- <View style={styles.action}>
95
- {state.cancelText &&
96
- <TouchableOpacity
97
- style={[styles.cancel, { marginRight: state.confirmText ? px2dp(15) : 0 }, state.cancelContainerStyle]}
98
- activeOpacity={0.8}
99
- onPress={() => {
100
- hide()
101
- cancelCallbackRef.current && cancelCallbackRef.current()
102
- cancelCallbackRef.current = undefined;
103
-
104
- }}>
105
- <Text style={[styles.cancelText, state.cancelTextStyle]}>{state.cancelText}</Text>
106
- </TouchableOpacity>
107
- }
108
-
109
- {state.confirmText &&
110
- <TouchableOpacity
111
- style={[styles.confirm, { marginLeft: state.cancelText ? px2dp(15) : 0 }, state.confirmContainerStyle]}
112
- activeOpacity={0.8}
113
- onPress={() => {
114
- hide()
115
- confirmCallbackRef.current && confirmCallbackRef.current()
116
- confirmCallbackRef.current = undefined;
117
- }}>
118
- <Text style={[styles.confirmText, state.confirmTextStyle]}>{state.confirmText}</Text>
119
- </TouchableOpacity>
120
- }
121
- </View>
122
- }
123
-
124
- </View>
125
-
126
- </View>
127
- </Modal>
128
- )
129
- })
130
-
131
-
132
-
133
- export const alertBottomViewRef = React.createRef<AlertBottomOptions.RefAttributes>();
134
-
135
-
136
-
137
- export const showAlertBottomModal = (props: Partial<AlertBottomOptions>) => {
138
- alertBottomViewRef.current?.show(props)
139
- }
140
-
141
-
142
-
143
- // const sleep = (msec?: number) => {
144
- // return new Promise(resolve => {
145
- // setTimeout(resolve, msec || 350);
146
- // });
147
- // }
148
-
149
-
150
-
151
- const styles = StyleSheet.create({
152
- container: {
153
- display: 'flex',
154
- flexGrow: 1,
155
- justifyContent: 'flex-end',
156
- alignItems: 'center',
157
-
158
- },
159
-
160
- wrapper: {
161
- flexGrow: 0,
162
- flexShrink: 0,
163
- width: '100%',
164
- backgroundColor: 'white',
165
- overflow: 'hidden',
166
- borderTopLeftRadius: px2dp(10),
167
- borderTopRightRadius: px2dp(10),
168
- display: 'flex',
169
- padding: px2dp(15),
170
- },
171
- titleText: {
172
- maxWidth: deviceWidth - px2dp(30),
173
- fontSize: px2sp(18),
174
- marginBottom: px2dp(20),
175
- // backgroundColor: 'red',
176
- textAlign: 'center',
177
- fontWeight: 'bold',
178
- color: '#1A1A1A'
179
- },
180
- contentText: {
181
- maxWidth: deviceWidth - px2dp(30),
182
- marginBottom: px2dp(20),
183
- minHeight: px2dp(40),
184
- flexGrow: 0,
185
- flexShrink: 1,
186
- width: undefined,
187
- fontSize: px2sp(15),
188
- // backgroundColor: 'red',
189
- color: '#1A1A1A',
190
- textAlign: 'center'
191
- },
192
- action: {
193
- display: 'flex',
194
- flexDirection: 'row',
195
- justifyContent: 'space-between',
196
- alignItems: 'center',
197
- // backgroundColor:"red"
198
- },
199
- cancel: {
200
- width: '40%',
201
- height: px2dp(44),
202
- display: 'flex',
203
- justifyContent: 'center',
204
- alignItems: 'center',
205
- borderRadius: px2dp(10),
206
- borderWidth: px2dp(1),
207
- borderColor: '#A3A9CC'
208
- },
209
-
210
- confirm: {
211
- width: '40%',
212
- height: px2dp(44),
213
- display: 'flex',
214
- justifyContent: 'center',
215
- alignItems: 'center',
216
- backgroundColor: '#2763FF',
217
- borderRadius: px2dp(10)
218
- },
219
- cancelText: {
220
- fontSize: px2sp(15),
221
- color: '#A3A9CC',
222
-
223
- },
224
- confirmText: {
225
- fontSize: px2sp(15),
226
- color: 'white'
227
- },
228
- })
@@ -1,42 +0,0 @@
1
- /*
2
- * @Author: shiguo
3
- * @Date: 2022-04-22 17:30:32
4
- * @LastEditors: shiguo
5
- * @LastEditTime: 2022-09-09 10:52:55
6
- * @FilePath: /@aks-dev/easyui/lib/Hud/AlertBottomView/index.d.ts
7
- */
8
- import * as React from 'react'
9
-
10
-
11
- import { StyleProp, ViewStyle, TextStyle } from 'react-native'
12
-
13
-
14
- export declare type AlertBottomOptions = {
15
- title: string;
16
- wrapperStyle: StyleProp<ViewStyle>;
17
- content: string | React.ReactElement;
18
- contentContainerStyle:StyleProp<ViewStyle>;
19
- cancelText: string;
20
- cancelContainerStyle: StyleProp<ViewStyle>;
21
- cancelTextStyle: StyleProp<TextStyle>;
22
- cancel: () => void;
23
- confirmText: string;
24
- confirmContainerStyle: StyleProp<ViewStyle>;
25
- confirmTextStyle: StyleProp<TextStyle>;
26
- confirm: () => void;
27
- }
28
-
29
-
30
- export declare const showAlertBottomModal: (props: Partial<AlertBottomOptions>) => void;
31
-
32
- declare namespace AlertBottomOptions {
33
- type RefAttributes = {
34
- show: (options: Partial<AlertBottomOptions>) => void;
35
- hide: () => void;
36
- }
37
- }
38
-
39
-
40
- export declare const AlertBottomView: React.ForwardRefExoticComponent<React.PropsWithoutRef<{}> & React.RefAttributes<AlertBottomOptions.RefAttributes>>;
41
-
42
- export declare const AlertBottomViewRef: React.RefObject<AlertBottomOptions.RefAttributes>