@momo-kits/date-picker 0.0.43-beta.73 → 0.0.43-beta.74

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 (2) hide show
  1. package/datePicker/WheelPicker.js +80 -124
  2. package/package.json +1 -1
package/datePicker/WheelPicker.js CHANGED
@@ -1,6 +1,10 @@
1
1
  import React, { Component } from 'react';
2
- import { Dimensions, View } from 'react-native';
3
- import { LinearGradient, Text, Colors, ScaleSize } from '@momo-kits/core';
2
+ import {
3
+ Dimensions, View
4
+ } from 'react-native';
5
+ import {
6
+ LinearGradient, Text, Colors, ScaleSize
7
+ } from '@momo-kits/core';
4
8
  import ScrollCustom from './custom/ScrollCustom';
5
9
  import DatePickerHelper from './helper/DatePickerHelper';
6
10
 
@@ -11,10 +15,7 @@ export default class WheelPicker extends Component {
11
15
  constructor(props) {
12
16
  super(props);
13
17
  const {
14
- heightItem,
15
- value: valueItem,
16
- numberItem,
17
- arrayValue,
18
+ heightItem, value: valueItem, numberItem, arrayValue
18
19
  } = this.props;
19
20
  const value = valueItem === -1 ? 0 : valueItem;
20
21
  this.heightItem = heightItem;
@@ -26,7 +27,7 @@ export default class WheelPicker extends Component {
26
27
  // height: 100,
27
28
  width: widthScreen / 3,
28
29
  value,
29
- items: arrayValue,
30
+ items: arrayValue
30
31
  };
31
32
  }
32
33
 
@@ -47,30 +48,23 @@ export default class WheelPicker extends Component {
47
48
  if (this.ScrollWheelPicker && this.ScrollWheelPicker.scrollTo) {
48
49
  this.ScrollWheelPicker.scrollTo({ y: this.currentPosition });
49
50
  }
50
- }, 0);
51
+ }, 500);
51
52
  }
52
53
 
53
54
  update(param) {
54
- this.setState(
55
- {
56
- items: param.arrayValue,
57
- value: param.value,
58
- },
59
- () => {
60
- clearTimeout(this.timerUpdate);
61
- this.timerUpdate = setTimeout(() => {
62
- this.scrollToPosition(param.value);
63
- }, 100);
64
- },
65
- );
55
+ this.setState({
56
+ items: param.arrayValue,
57
+ value: param.value
58
+ }, () => {
59
+ clearTimeout(this.timerUpdate);
60
+ this.timerUpdate = setTimeout(() => {
61
+ this.scrollToPosition(param.value);
62
+ }, 100);
63
+ });
66
64
  }
67
65
 
68
66
  setScrollEnabled(enable) {
69
- if (
70
- this.ScrollWheelPicker &&
71
- this.ScrollWheelPicker.setScrollEnabled &&
72
- !this.isDragging
73
- ) {
67
+ if (this.ScrollWheelPicker && this.ScrollWheelPicker.setScrollEnabled && !this.isDragging) {
74
68
  this.ScrollWheelPicker.setScrollEnabled(enable);
75
69
  }
76
70
  }
@@ -79,18 +73,13 @@ export default class WheelPicker extends Component {
79
73
  if (this.currentPosition != null) {
80
74
  const { value } = this.state;
81
75
  const { onValueChange, onEndDrag, refName } = this.props;
82
- const position = this.parseInteger(
83
- this.currentPosition / this.heightItem,
84
- );
76
+ const position = this.parseInteger(this.currentPosition / this.heightItem);
85
77
  if (position !== value) {
86
- this.setState(
87
- {
88
- value: position,
89
- },
90
- () => {
91
- this.scrollToPosition(position);
92
- },
93
- );
78
+ this.setState({
79
+ value: position
80
+ }, () => {
81
+ this.scrollToPosition(position);
82
+ });
94
83
  }
95
84
  if (onValueChange) {
96
85
  onValueChange(position);
@@ -131,15 +120,13 @@ export default class WheelPicker extends Component {
131
120
  const view = [];
132
121
  // eslint-disable-next-line no-plusplus
133
122
  for (let i = 0; i < numberItemTop; i++) {
134
- view.push(
135
- <View
136
- key={`itemTop${i}`}
137
- style={{
138
- flex: 1,
139
- height: heightItem,
140
- }}
141
- />,
142
- );
123
+ view.push(<View
124
+ key={`itemTop${i}`}
125
+ style={{
126
+ flex: 1,
127
+ height: heightItem,
128
+ }}
129
+ />);
143
130
  }
144
131
 
145
132
  return view;
@@ -187,13 +174,10 @@ export default class WheelPicker extends Component {
187
174
  const { preFix, bottomOffset } = this.props;
188
175
  return (
189
176
  <View style={{ flex: 1, height: heightContain + 40 }}>
190
- <Text.SubTitle
191
- weight="bold"
192
- style={{
193
- color: Colors.black_17,
194
- marginLeft: 6,
195
- marginBottom: 3,
196
- }}>
177
+ <Text.SubTitle weight='bold' style={{
178
+ color: Colors.black_17, marginLeft: 6, marginBottom: 3
179
+ }}
180
+ >
197
181
  {DatePickerHelper.capitalizeFirstLetter(preFix || '')}
198
182
  </Text.SubTitle>
199
183
  <View
@@ -206,31 +190,26 @@ export default class WheelPicker extends Component {
206
190
  borderWidth: 1,
207
191
  borderColor: Colors.black_04,
208
192
  borderRadius: 8,
209
- overflow: 'hidden',
193
+ overflow: 'hidden'
210
194
  }}
211
195
  onLayout={(event) => {
212
- if (
213
- event &&
214
- event.nativeEvent &&
215
- event.nativeEvent.layout &&
216
- event.nativeEvent.layout.height &&
217
- event.nativeEvent.layout.width
218
- ) {
196
+ if (event && event.nativeEvent && event.nativeEvent.layout
197
+ && event.nativeEvent.layout.height && event.nativeEvent.layout.width) {
219
198
  this.setState({
220
199
  // height: event.nativeEvent.layout.height,
221
- width: event.nativeEvent.layout.width,
200
+ width: event.nativeEvent.layout.width
222
201
  });
223
202
  }
224
- }}>
225
- <View
226
- style={{
227
- position: 'absolute',
228
- top: positionCenter,
229
- left: 0,
230
- height: this.heightItem, // + 12,
231
- width,
232
- backgroundColor: '#f2f8ff',
233
- }}
203
+ }}
204
+ >
205
+ <View style={{
206
+ position: 'absolute',
207
+ top: positionCenter,
208
+ left: 0,
209
+ height: this.heightItem, // + 12,
210
+ width,
211
+ backgroundColor: '#f2f8ff',
212
+ }}
234
213
  />
235
214
 
236
215
  <ScrollCustom
@@ -238,33 +217,22 @@ export default class WheelPicker extends Component {
238
217
  this.ScrollWheelPicker = refName;
239
218
  }}
240
219
  onScrollEndDrag={(event) => {
241
- if (
242
- event &&
243
- event.nativeEvent &&
244
- event.nativeEvent.contentOffset &&
245
- event.nativeEvent.contentOffset.y != null &&
246
- !this.isDragging
247
- ) {
248
- this.onStartDrag(
249
- event.nativeEvent.contentOffset.y,
250
- );
220
+ if (event && event.nativeEvent && event.nativeEvent.contentOffset
221
+ && event.nativeEvent.contentOffset.y != null && !this.isDragging) {
222
+ this.onStartDrag(event.nativeEvent.contentOffset.y);
251
223
  }
252
224
  }}
253
225
  onScroll={(event) => {
254
- if (
255
- event &&
256
- event.nativeEvent &&
257
- event.nativeEvent.contentOffset &&
258
- event.nativeEvent.contentOffset.y != null
259
- ) {
260
- this.currentPosition =
261
- event.nativeEvent.contentOffset.y;
226
+ if (event && event.nativeEvent && event.nativeEvent.contentOffset
227
+ && event.nativeEvent.contentOffset.y != null) {
228
+ this.currentPosition = event.nativeEvent.contentOffset.y;
262
229
  }
263
- }}>
264
- {this.renderHiddenItem(
265
- this.numberItem,
266
- this.heightItem,
267
- )}
230
+ }}
231
+ >
232
+
233
+ {
234
+ this.renderHiddenItem(this.numberItem, this.heightItem)
235
+ }
268
236
  {items.map((valueItem, index) => (
269
237
  <View
270
238
  // eslint-disable-next-line react/no-array-index-key
@@ -274,63 +242,51 @@ export default class WheelPicker extends Component {
274
242
  height: this.heightItem,
275
243
  justifyContent: 'center',
276
244
  alignItems: 'center',
277
- }}>
278
- <Text
279
- style={{
280
- color:
281
- value === index
282
- ? Colors.black_17
283
- : '#909090',
284
- fontWeight:
285
- value === index ? 'bold' : '700',
286
- fontSize:
287
- value === index
288
- ? ScaleSize(20)
289
- : ScaleSize(16),
290
- }}>
245
+ }}
246
+ >
247
+ <Text style={{
248
+ color: value === index ? Colors.black_17 : '#909090',
249
+ fontWeight: value === index ? 'bold' : '700',
250
+ fontSize: value === index ? ScaleSize(20) : ScaleSize(16),
251
+ }}
252
+ >
291
253
  {valueItem}
292
254
  {/* {reversePreFix ? `${valueItem} ${preFix}` : `${preFix} ${valueItem}`} */}
293
255
  </Text>
294
256
  </View>
295
257
  ))}
296
- {this.renderHiddenItem(
297
- this.numberItem,
298
- this.heightItem,
299
- bottomOffset,
300
- )}
258
+ {
259
+ this.renderHiddenItem(this.numberItem, this.heightItem, bottomOffset)
260
+ }
301
261
  </ScrollCustom>
302
262
  <LinearGradient
303
263
  pointerEvents="none"
304
264
  locations={[0.2, 0.85]}
305
- colors={[
306
- 'rgba(255, 255, 255, 1)',
307
- 'rgba(255, 255, 255, 0)',
308
- ]}
265
+ colors={['rgba(255, 255, 255, 1)', 'rgba(255, 255, 255, 0)']}
309
266
  style={{
310
267
  height: this.heightItem * 2,
311
268
  width,
312
269
  position: 'absolute',
313
270
  top: 0,
314
- overflow: 'hidden',
271
+ overflow: 'hidden'
272
+
315
273
  }}
316
274
  />
317
275
  <LinearGradient
318
276
  pointerEvents="none"
319
277
  locations={[0, 0.85]}
320
- colors={[
321
- 'rgba(255, 255, 255, 0)',
322
- 'rgba(255, 255, 255, 1)',
323
- ]}
278
+ colors={['rgba(255, 255, 255, 0)', 'rgba(255, 255, 255, 1)']}
324
279
  style={{
325
280
  height: this.heightItem * 2,
326
281
  width,
327
282
  position: 'absolute',
328
283
  bottom: 0,
329
- overflow: 'hidden',
284
+ overflow: 'hidden'
330
285
  }}
331
286
  />
332
287
  </View>
333
288
  </View>
289
+
334
290
  );
335
291
  }
336
292
  }
@@ -341,7 +297,7 @@ WheelPicker.defaultProps = {
341
297
  value: 0,
342
298
  heightItem: 42,
343
299
  numberItem: 5,
344
- bottomOffset: 0,
300
+ bottomOffset: 0
345
301
  };
346
302
 
347
303
  module.exports = WheelPicker;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@momo-kits/date-picker",
3
- "version": "0.0.43-beta.73",
3
+ "version": "0.0.43-beta.74",
4
4
  "private": false,
5
5
  "main": "index.js",
6
6
  "dependencies": {},