Skip to content

Commit 0b6132a

Browse files
sunnylqmsunnylqm
committed
add date and time picker
1 parent 1d996d3 commit 0b6132a

File tree

3 files changed

+116
-0
lines changed

3 files changed

+116
-0
lines changed

‎docs/datepickerandroid.md‎

Lines changed: 55 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
本组件会打开一个标准的Android日期选择器的对话框。
2+
3+
### 示例
4+
```js
5+
try {
6+
const {action, year, month, day} = await DatePickerAndroid.open({
7+
// 要设置默认值为今天的话，使用`new Date()`即可。
8+
// 下面显示的会是2020年5月25日。月份是从0开始算的。
9+
date: new Date(2020, 4, 25)
10+
});
11+
if (action !== DatePickerAndroid.dismissedAction) {
12+
// 这里开始可以处理用户选好的年月日三个参数：year, month (0-11), day
13+
}
14+
} catch ({code, message}) {
15+
console.warn('Cannot open date picker', message);
16+
}
17+
```
18+
19+
### 方法
20+
21+
<div class="props">
22+
<div class="prop"><h4 class="propTitle"><a class="anchor" name="open"></a><span
23+
class="propType">static </span>open<span class="propType">(options: Object)</span> <a class="hash-link"
24+
href="#open">#</a>
25+
</h4>
26+
<div><p>Opens the standard Android date picker dialog.</p>
27+
<p>The available keys for the <code>options</code> object are:
28+
<em> <code>date</code> (<code>Date</code> object or timestamp in milliseconds) - date to show by default
29+
</em> <code>minDate</code> (<code>Date</code> or timestamp in milliseconds) - minimum date that can be
30+
selected
31+
* <code>maxDate</code> (<code>Date</code> object or timestamp in milliseconds) - minimum date that can
32+
be selected</p>
33+
<p>Returns a Promise which will be invoked an object containing <code>action</code>, <code>year</code>,
34+
<code>month</code> (0-11),
35+
<code>day</code> if the user picked a date. If the user dismissed the dialog, the Promise will
36+
still be resolved with action being <code>DatePickerAndroid.dismissedAction</code> and all the other
37+
keys
38+
being undefined. <strong>Always</strong> check whether the <code>action</code> before reading the
39+
values.</p>
40+
<p>Note the native date picker dialog has some UI glitches on Android 4 and lower
41+
when using the <code>minDate</code> and <code>maxDate</code> options.</p></div>
42+
</div>
43+
<div class="prop"><h4 class="propTitle"><a class="anchor" name="datesetaction"></a><span
44+
class="propType">static </span>dateSetAction<span class="propType">()</span> <a class="hash-link"
45+
href="#datesetaction">#</a>
46+
</h4>
47+
<div><p>A date has been selected.</p></div>
48+
</div>
49+
<div class="prop"><h4 class="propTitle"><a class="anchor" name="dismissedaction"></a><span
50+
class="propType">static </span>dismissedAction<span class="propType">()</span> <a class="hash-link"
51+
href="#dismissedaction">#</a>
52+
</h4>
53+
<div><p>The dialog has been dismissed.</p></div>
54+
</div>
55+
</div>

‎docs/indexes.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -320,6 +320,10 @@
320320
"subject": "CameraRoll",
321321
"mdlink": "cameraroll"
322322
},
323+
{
324+
"subject": "DatePickerAndroid",
325+
"mdlink": "datepickerandroid"
326+
},
323327
{
324328
"subject": "Dimensions",
325329
"mdlink": "dimensions"
@@ -372,6 +376,10 @@
372376
"subject": "StyleSheet",
373377
"mdlink": "stylesheet"
374378
},
379+
{
380+
"subject": "TimePickerAndroid",
381+
"mdlink": "timepickerandroid"
382+
},
375383
{
376384
"subject": "ToastAndroid",
377385
"mdlink": "toastandroid"

‎docs/timepickerandroid.md‎

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
本组件会打开一个标准的Android时间选择器的对话框。
2+
3+
### 示例
4+
```js
5+
try {
6+
const {action, hour, minute} = await TimePickerAndroid.open({
7+
hour: 14,
8+
minute: 0,
9+
is24Hour: false, // 会显示为'2 PM'或'下午2点'
10+
});
11+
if (action !== DatePickerAndroid.dismissedAction) {
12+
// 这里开始可以处理用户选好的时分两个参数：hour (0-23), minute (0-59)
13+
}
14+
} catch ({code, message}) {
15+
console.warn('Cannot open time picker', message);
16+
}
17+
```
18+
19+
### 方法
20+
21+
<div class="props">
22+
<div class="prop"><h4 class="propTitle"><a class="anchor" name="open"></a><span
23+
class="propType">static </span>open<span class="propType">(options: Object)</span> <a class="hash-link"
24+
href="#open">#</a>
25+
</h4>
26+
<div><p>Opens the standard Android time picker dialog.</p>
27+
<p>The available keys for the <code>options</code> object are:
28+
<em> <code>hour</code> (0-23) - the hour to show, defaults to the current time
29+
</em> <code>minute</code> (0-59) - the minute to show, defaults to the current time
30+
* <code>is24Hour</code> (boolean) - If <code>true</code>, the picker uses the 24-hour format. If <code>false</code>,
31+
the picker shows an AM/PM chooser. If undefined, the default for the current locale
32+
is used.</p>
33+
<p>Returns a Promise which will be invoked an object containing <code>action</code>, <code>hour</code>
34+
(0-23),
35+
<code>minute</code> (0-59) if the user picked a time. If the user dismissed the dialog, the Promise will
36+
still be resolved with action being <code>TimePickerAndroid.dismissedAction</code> and all the other
37+
keys
38+
being undefined. <strong>Always</strong> check whether the <code>action</code> before reading the
39+
values.</p></div>
40+
</div>
41+
<div class="prop"><h4 class="propTitle"><a class="anchor" name="timesetaction"></a><span
42+
class="propType">static </span>timeSetAction<span class="propType">()</span> <a class="hash-link"
43+
href="#timesetaction">#</a>
44+
</h4>
45+
<div><p>A time has been selected.</p></div>
46+
</div>
47+
<div class="prop"><h4 class="propTitle"><a class="anchor" name="dismissedaction"></a><span
48+
class="propType">static </span>dismissedAction<span class="propType">()</span> <a class="hash-link"
49+
href="#dismissedaction">#</a>
50+
</h4>
51+
<div><p>The dialog has been dismissed.</p></div>
52+
</div>
53+
</div>

0 commit comments

Comments
 (0)