未验证 提交 0ac4e49f 编写于 作者: O openharmony_ci 提交者: Gitee

!11525 翻译完成 11393/10987/10352

Merge pull request !11525 from ester.zhou/C1-1117
# Setting the System Time # System Time and Time Zone
This module is used to set and obtain the current system date, time, and time zone. The **systemTime** module provides system time and time zone features. You can use the APIs of this module to set and obtain the system time and time zone.
> **NOTE**<br>The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version.
> **NOTE**
>
> The initial APIs of this module are supported since API version 7. Newly added APIs will be marked with a superscript to indicate their earliest API version.
## Modules to Import ## Modules to Import
```js
```
import systemTime from '@ohos.systemTime'; import systemTime from '@ohos.systemTime';
``` ```
## systemTime.setTime ## systemTime.setTime
setTime(time : number, callback : AsyncCallback&lt;void&gt;) : void setTime(time : number, callback : AsyncCallback&lt;void&gt;) : void
...@@ -25,25 +24,24 @@ Sets the system time. This API uses an asynchronous callback to return the resul ...@@ -25,25 +24,24 @@ Sets the system time. This API uses an asynchronous callback to return the resul
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | ----------- | ---- | ---------------- |
| time | number | Yes| Timestamp to set, in milliseconds.| | time | number | Yes | Timestamp to set, in milliseconds. |
| callback | AsyncCallback&lt;void&gt; | Yes| Callback used to process the received return value.| | callback | AsyncCallback&lt;void&gt; | Yes | Callback used to return the result.|
**Example** **Example**
```js ```js
// Set the system time to 2021-01-20 02:36:25. // Set the system time to 2021-01-20 02:36:25.
var time = 1611081385000; let time = 1611081385000;
systemTime.setTime(time, (error, data) => { systemTime.setTime(time, (error) => {
if (error) { if (error) {
console.error(`failed to systemTime.setTime because ` + JSON.stringify(error)); console.error(`Failed to set systemTime. Cause:` + JSON.stringify(error));
return; return;
} }
console.log(`systemTime.setTime success data : ` + JSON.stringify(data)); console.log('Succeeded in setting systemTime.');
}); });
``` ```
## systemTime.setTime ## systemTime.setTime
...@@ -57,28 +55,27 @@ Sets the system time. This API uses a promise to return the result. ...@@ -57,28 +55,27 @@ Sets the system time. This API uses a promise to return the result.
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name| Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | ------ | ------ | ---- | ------------------ |
| time | number | Yes| Timestamp to set, in milliseconds.| | time | number | Yes | Timestamp to set, in milliseconds.|
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | ------------------- | ------------------------- |
| Promise&lt;void&gt; | Promise used to return the result.| | Promise&lt;void&gt; | Promise that returns no value.|
**Example** **Example**
```js ```js
// Set the system time to 2021-01-20 02:36:25. // Set the system time to 2021-01-20 02:36:25.
var time = 1611081385000; let time = 1611081385000;
systemTime.setTime(time).then((data) => { systemTime.setTime(time).then(() => {
console.log(`systemTime.setTime success data : ` + JSON.stringify(data)); console.log('Succeeded in setting systemTime.');
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.setTime because ` + JSON.stringify(error)); console.error(`Failed to set systemTime. Cause:` + JSON.stringify(error));
}); });
``` ```
## systemTime.getCurrentTime<sup>8+</sup> ## systemTime.getCurrentTime<sup>8+</sup>
...@@ -90,23 +87,22 @@ Obtains the time elapsed since the Unix epoch. This API uses an asynchronous cal ...@@ -90,23 +87,22 @@ Obtains the time elapsed since the Unix epoch. This API uses an asynchronous cal
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | -------------- | ---- | ------------------ |
| isNano | boolean | No| Whether nanoseconds or milliseconds will be returned. If the value is **true**, nanoseconds will be returned. Otherwise, milliseconds will be returned.| | isNano | boolean | No | Whether the time to return is in nanoseconds.<br>- **true**: in nanoseconds (ns).<br>- **false**: in milliseconds (ms).|
| callback | AsyncCallback&lt;number&gt; | Yes| Callback used to return the time.| | callback | AsyncCallback&lt;number&gt; | Yes | Callback used to return the time elapsed since the Unix epoch. |
**Example** **Example**
```js ```js
systemTime.getCurrentTime(true, (error, data) => { systemTime.getCurrentTime(true, (error, data) => {
if (error) { if (error) {
console.error(`failed to systemTime.getCurrentTime because ` + JSON.stringify(error)); console.error(`Failed to get systemTime. Cause:` + JSON.stringify(error));
return; return;
} }
console.log(`systemTime.getCurrentTime success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting systemTime.Data: ` + JSON.stringify(data));
}); });
``` ```
## systemTime.getCurrentTime<sup>8+</sup> ## systemTime.getCurrentTime<sup>8+</sup>
...@@ -118,144 +114,139 @@ Obtains the time elapsed since the Unix epoch. This API uses a promise to return ...@@ -118,144 +114,139 @@ Obtains the time elapsed since the Unix epoch. This API uses a promise to return
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name| Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | ------ | ------- | ---- | ------------------------- |
| isNano | boolean | No| Whether nanoseconds or milliseconds will be returned. If the value is **true**, nanoseconds will be returned. Otherwise, milliseconds will be returned.| | isNano | boolean | No | Whether the time to return is in nanoseconds.<br>- **true**: in nanoseconds (ns).<br>- **false**: in milliseconds (ms).|
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | --------------------- | --------------------------- |
| Promise&lt;number&gt; | Promise used to return the time.| | Promise&lt;number&gt; | Promise used to return the time elapsed since the Unix epoch.|
**Example** **Example**
```js ```js
systemTime.getCurrentTime().then((data) => { systemTime.getCurrentTime().then((data) => {
console.log(`systemTime.getCurrentTime success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting systemTime.Data: ` + JSON.stringify(data));
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.getCurrentTime because ` + JSON.stringify(error)); console.error(`Failed to get systemTime. Cause:` + JSON.stringify(error));
}); });
``` ```
## systemTime.getRealActiveTime<sup>8+</sup> ## systemTime.getRealActiveTime<sup>8+</sup>
getRealActiveTime(isNano?: boolean, callback: AsyncCallback&lt;number&gt;): void getRealActiveTime(isNano?: boolean, callback: AsyncCallback&lt;number&gt;): void
Obtains the time elapsed since system start, excluding the deep sleep time. This API uses an asynchronous callback to return the result. Obtains the time elapsed since system startup, excluding the deep sleep time. This API uses an asynchronous callback to return the result.
**System capability**: SystemCapability.MiscServices.Time **System capability**: SystemCapability.MiscServices.Time
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | ---------- | ---- | -------------------------- |
| isNano | boolean | No| Whether nanoseconds or milliseconds will be returned. If the value is **true**, nanoseconds will be returned. Otherwise, milliseconds will be returned.| | isNano | boolean | No | Whether the time to return is in nanoseconds.<br>- **true**: in nanoseconds (ns).<br>- **false**: in milliseconds (ms).|
| callback | AsyncCallback&lt;number&gt; | Yes| Callback used to return the time.| | callback | AsyncCallback&lt;number&gt; | Yes | Callback used to return the time.|
**Example** **Example**
```js ```js
systemTime.getRealActiveTime(true, (error, data) => { systemTime.getRealActiveTime(true, (error, data) => {
if (error) { if (error) {
console.error(`failed to systemTime.getRealActiveTimebecause ` + JSON.stringify(error)); console.error(`Failed to get real active systemTime. Cause:` + JSON.stringify(error));
return; return;
} }
console.log(`systemTime.getRealActiveTime success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting real active systemTime. Data: ` + JSON.stringify(data));
}); });
``` ```
## systemTime.getRealActiveTime<sup>8+</sup> ## systemTime.getRealActiveTime<sup>8+</sup>
getRealActiveTime(isNano?: boolean): Promise&lt;number&gt; getRealActiveTime(isNano?: boolean): Promise&lt;number&gt;
Obtains the time elapsed since system start, excluding the deep sleep time. This API uses a promise to return the result. Obtains the time elapsed since system startup, excluding the deep sleep time. This API uses a promise to return the result.
**System capability**: SystemCapability.MiscServices.Time **System capability**: SystemCapability.MiscServices.Time
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name| Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | ------ | ------- | ---- | ----------------------------------- |
| isNano | boolean | No| Whether nanoseconds or milliseconds will be returned. If the value is **true**, nanoseconds will be returned. Otherwise, milliseconds will be returned.| | isNano | boolean | No | Whether the time to return is in nanoseconds.<br>- **true**: in nanoseconds (ns).<br>- **false**: in milliseconds (ms).|
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | -------------- | -------------------------------- |
| Promise&lt;number&gt; | Promise used to return the time.| | Promise&lt;number&gt; | Promise used to return the time elapsed since system startup, excluding the deep sleep time.|
**Example** **Example**
```js ```js
systemTime.getRealActiveTime().then((data) => { systemTime.getRealActiveTime().then((data) => {
console.log(`systemTime.getRealActiveTime success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting real active systemTime. Data: ` + JSON.stringify(data));
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.getRealActiveTime because ` + JSON.stringify(error)); console.error(`Failed to get real active systemTime. Cause:` + JSON.stringify(error));
}); });
``` ```
## systemTime.getRealTime<sup>8+</sup> ## systemTime.getRealTime<sup>8+</sup>
getRealTime(isNano?: boolean, callback: AsyncCallback&lt;number&gt;): void getRealTime(isNano?: boolean, callback: AsyncCallback&lt;number&gt;): void
Obtains the time elapsed since system start, including the deep sleep time. This API uses an asynchronous callback to return the result. Obtains the time elapsed since system startup, including the deep sleep time. This API uses an asynchronous callback to return the result.
**System capability**: SystemCapability.MiscServices.Time **System capability**: SystemCapability.MiscServices.Time
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | --------------- | ---- | ------------------------------- |
| isNano | boolean | No| Whether nanoseconds or milliseconds will be returned. If the value is **true**, nanoseconds will be returned. Otherwise, milliseconds will be returned.| | isNano | boolean | No | Whether the time to return is in nanoseconds.<br>- **true**: in nanoseconds (ns).<br>- **false**: in milliseconds (ms).|
| callback | AsyncCallback&lt;number&gt; | Yes| Callback used to return the time.| | callback | AsyncCallback&lt;number&gt; | Yes | Callback used to return the time. |
**Example** **Example**
```js ```js
systemTime.getRealTime(true, (error, data) => { systemTime.getRealTime(true, (error, data) => {
if (error) { if (error) {
console.error(`failed to systemTime.getRealTime because ` + JSON.stringify(error)); console.error(`Failed to get real systemTime. Cause:` + JSON.stringify(error));
return; return;
} }
console.log(`systemTime.getRealTime success data: ` + JSON.stringify(data)); console.log(`Succeeded in getting real active systemTime. Data: ` + JSON.stringify(data));
}); });
``` ```
## systemTime.getRealTime<sup>8+</sup> ## systemTime.getRealTime<sup>8+</sup>
getRealTime(isNano?: boolean): Promise&lt;number&gt; getRealTime(isNano?: boolean): Promise&lt;number&gt;
Obtains the time elapsed since system start, including the deep sleep time. This API uses a promise to return the result. Obtains the time elapsed since system startup, including the deep sleep time. This API uses a promise to return the result.
**System capability**: SystemCapability.MiscServices.Time **System capability**: SystemCapability.MiscServices.Time
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name| Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | ------ | ------- | ---- | ------------------------------- |
| isNano | boolean | No| Whether nanoseconds or milliseconds will be returned. If the value is **true**, nanoseconds will be returned. Otherwise, milliseconds will be returned.| | isNano | boolean | No | Whether the time to return is in nanoseconds.<<br>- **true**: in nanoseconds (ns).<br>- **false**: in milliseconds (ms).|
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | --------------------- | ------------------------------- |
| Promise&lt;number&gt; | Promise used to return the time.| | Promise&lt;number&gt; | Promise used to return the time elapsed since system startup, including the deep sleep time.|
**Example** **Example**
```js ```js
systemTime.getRealTime().then((data) => { systemTime.getRealTime().then((data) => {
console.log(`systemTime.getRealTime success data: ` + JSON.stringify(data)); console.log(`Succeeded in getting real active systemTime. Data: ` + JSON.stringify(data));
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.getRealTime because ` + JSON.stringify(error)); console.error(`Failed to get real systemTime. Cause:` + JSON.stringify(error));
}); });
``` ```
## systemTime.setDate ## systemTime.setDate
...@@ -269,24 +260,23 @@ Sets the system date. This API uses an asynchronous callback to return the resul ...@@ -269,24 +260,23 @@ Sets the system date. This API uses an asynchronous callback to return the resul
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | ------------- | ---- | --------------------- |
| date | Date | Yes| Target date to set.| | date | Date | Yes | Target date to set. |
| callback | AsyncCallback&lt;void&gt; | Yes| Callback used to process the received return value.| | callback | AsyncCallback&lt;void&gt; | Yes | Callback used to return the result.|
**Example** **Example**
```js ```js
var data = new Date("October 13, 2020 11:13:00"); let data = new Date("October 13, 2020 11:13:00");
systemTime.setDate(data,(error, data) => { systemTime.setDate(data,(error) => {
if (error) { if (error) {
console.error('failed to systemTime.setDate because ' + JSON.stringify(error)); console.error('Failed to set systemDate. Cause: ' + JSON.stringify(error));
return; return;
} }
console.info('systemTime.setDate success data : ' + JSON.stringify(data)); console.info('Succeeded in setting systemDate.');
}); });
``` ```
## systemTime.setDate ## systemTime.setDate
...@@ -300,27 +290,26 @@ Sets the system date. This API uses a promise to return the result. ...@@ -300,27 +290,26 @@ Sets the system date. This API uses a promise to return the result.
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name| Type| Mandatory| Description |
| -------- | -------- | -------- | -------- | | ------ | ---- | ---- | ---------- |
| date | Date | Yes| Target date to set.| | date | Date | Yes | Target date to set.|
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | ------------------- | -------------------- |
| Promise&lt;void&gt; | Promise used to return the result.| | Promise&lt;void&gt; | Promise that returns no value.|
**Example** **Example**
```js ```js
var data = new Date("October 13, 2020 11:13:00"); let data = new Date("October 13, 2020 11:13:00");
systemTime.setDate(data).then((value) => { systemTime.setDate(data).then(() => {
console.log(`systemTime.setDate success data : ` + JSON.stringify(value)); console.log('Succeeded in setting systemDate.');
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.setDate because: ` + JSON.stringify(error)); console.error(`Failed to set systemDate. Cause: ` + JSON.stringify(error));
}); });
``` ```
## systemTime.getDate<sup>8+</sup> ## systemTime.getDate<sup>8+</sup>
...@@ -332,47 +321,45 @@ Obtains the current system date. This API uses an asynchronous callback to retur ...@@ -332,47 +321,45 @@ Obtains the current system date. This API uses an asynchronous callback to retur
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | -------------- | ---- | --------------------- |
| callback | AsyncCallback&lt;Date&gt; | Yes| Callback used to return the current system date.| | callback | AsyncCallback&lt;Date&gt; | Yes | Callback used to return the current system date.|
**Example** **Example**
```js ```js
systemTime.getDate((error, data) => { systemTime.getDate((error, data) => {
if (error) { if (error) {
console.error(`failed to systemTime.getDate because ` + JSON.stringify(error)); console.error(`Failed to get systemDate. Cause: ` + JSON.stringify(error));
return; return;
} }
console.log(`systemTime.getDate success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting systemDate. Data: ` + JSON.stringify(data));
}); });
``` ```
## systemTime.getDate<sup>8+</sup> ## systemTime.getDate<sup>8+</sup>
getDate(): Promise&lt;Date&gt; getDate(): Promise&lt;Date&gt;
Obtains the current system date. This API uses a promise to return the result. Obtains the current system date. This API uses a promise to return the result.
**System capability**: SystemCapability.MiscServices.Time **System capability**: SystemCapability.MiscServices.Time
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | ------------------- | ----------------------------------------- |
| Promise&lt;Date&gt; | Promise used to return the current system date.| | Promise&lt;Date&gt; | Promise used to return the current system date.|
**Example** **Example**
```js ```js
systemTime.getDate().then((data) => { systemTime.getDate().then((data) => {
console.log(`systemTime.getDate success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting systemDate. Data: ` + JSON.stringify(data));
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.getDate because ` + JSON.stringify(error)); console.error(`Failed to get systemDate. Cause: ` + JSON.stringify(error));
}); });
``` ```
## systemTime.setTimezone ## systemTime.setTimezone
...@@ -386,23 +373,22 @@ Sets the system time zone. This API uses an asynchronous callback to return the ...@@ -386,23 +373,22 @@ Sets the system time zone. This API uses an asynchronous callback to return the
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | ------------- | ---- | -------------------------- |
| timezone | string | Yes| System time zone to set.| | timezone | string | Yes | System time zone to set. |
| callback | AsyncCallback&lt;void&gt; | Yes| Callback used to process the received return value.| | callback | AsyncCallback&lt;void&gt; | Yes | Callback used to return the result.|
**Example** **Example**
```js ```js
systemTime.setTimezone('Asia/Shanghai', (error, data) => { systemTime.setTimezone('Asia/Shanghai', (error) => {
if (error) { if (error) {
console.error('failed to systemTime.setTimezone because ' + JSON.stringify(error)); console.error('Failed to set systemTimeZone. Cause: ' + JSON.stringify(error));
return; return;
} }
console.info('SystemTimePlugin systemTime.setTimezone success data : ' + JSON.stringify(data)); console.info('Succeeded in setting systemTimeZone.');
}); });
``` ```
## systemTime.setTimezone ## systemTime.setTimezone
...@@ -416,26 +402,25 @@ Sets the system time zone. This API uses a promise to return the result. ...@@ -416,26 +402,25 @@ Sets the system time zone. This API uses a promise to return the result.
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | ------ | ---- | ---------- |
| timezone | string | Yes| System time zone to set.| | timezone | string | Yes | System time zone to set.|
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | ------------------- | -------------------- |
| Promise&lt;void&gt; | Promise used to return the result.| | Promise&lt;void&gt; | Promise that returns no value.|
**Example** **Example**
```js ```js
systemTime.setTimezone('Asia/Shanghai').then((data) => { systemTime.setTimezone('Asia/Shanghai').then(() => {
console.log(`systemTime.setTimezone success data : ` + JSON.stringify(data)); console.log('Succeeded in setting systemTimeZone.');
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.setTimezone because: ` + JSON.stringify(error)); console.error(`Failed to set systemTimeZone. Cause: ` + JSON.stringify(error));
}); });
``` ```
## systemTime.getTimezone<sup>8+</sup> ## systemTime.getTimezone<sup>8+</sup>
...@@ -447,22 +432,21 @@ Obtains the system time zone. This API uses an asynchronous callback to return t ...@@ -447,22 +432,21 @@ Obtains the system time zone. This API uses an asynchronous callback to return t
**Parameters** **Parameters**
| Name| Type| Mandatory| Description| | Name | Type | Mandatory| Description |
| -------- | -------- | -------- | -------- | | -------- | --------- | ---- | ------------------------ |
| callback | AsyncCallback&lt;string&gt; | Yes| Callback used to return the system time zone.| | callback | AsyncCallback&lt;string&gt; | Yes | Callback used to return the system time zone.|
**Example** **Example**
```js ```js
systemTime.getTimezone((error, data) => { systemTime.getTimezone((error, data) => {
if (error) { if (error) {
console.error(`failed to systemTime.getTimezone because ` + JSON.stringify(error)); console.error(`Failed to get systemTimeZone. Cause: ` + JSON.stringify(error));
return; return;
} }
console.log(`systemTime.getTimezone success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting systemTimeZone. Data: ` + JSON.stringify(data));
}); });
``` ```
## systemTime.getTimezone<sup>8+</sup> ## systemTime.getTimezone<sup>8+</sup>
...@@ -474,16 +458,16 @@ Obtains the system time zone. This API uses a promise to return the result. ...@@ -474,16 +458,16 @@ Obtains the system time zone. This API uses a promise to return the result.
**Return value** **Return value**
| Type| Description| | Type | Description |
| -------- | -------- | | --------------------- | ------------------------------------- |
| Promise&lt;string&gt; | Promise used to return the system time zone.| | Promise&lt;string&gt; | Promise used to return the system time zone.|
**Example** **Example**
```js ```js
systemTime.getTimezone().then((data) => { systemTime.getTimezone().then((data) => {
console.log(`systemTime.getTimezone success data : ` + JSON.stringify(data)); console.log(`Succeeded in getting systemTimeZone. Data: ` + JSON.stringify(data));
}).catch((error) => { }).catch((error) => {
console.error(`failed to systemTime.getTimezone because ` + JSON.stringify(error)); console.error(`Failed to get systemTimeZone. Cause: ` + JSON.stringify(error));
}); });
``` ```
# dialog # dialog
The **&lt;dialog&gt;** component is a custom pop-up container. > **NOTE**
>
> This component is supported since API version 4. Updates will be marked with a superscript to indicate their earliest API version.
The **\<dialog>** component is a custom dialog box.
## Required Permissions ## Required Permissions
None None
## Child Components
A single child component is supported. ## Child Components
## Attributes This component supports only one child component.
In addition to the attributes in [Universal Attributes](js-components-common-attributes.md), the following attributes are supported.
## Attributes
In addition to the [universal attributes](../arkui-js/js-components-common-attributes.md), the following attributes are supported.
| Name | Type | Default Value | Mandatory | Description | | Name | Type | Default Value | Mandatory | Description |
| --------------------- | ------- | ------------- | --------- | ---------------------------------- | | --------------------- | ------- | ----- | ---- | ------------ |
| dragable<sup>7+</sup> | boolean | false | No | Whether the pop-up can be dragged. | | dragable<sup>7+</sup> | boolean | false | No | Whether the dialog box can be dragged.|
> ![img](https://gitee.com/openharmony/docs/raw/master/en/application-dev/public_sys-resources/icon-note.gif) **NOTE:** > **NOTE**
> >
> - The **&lt;dialog&gt;** component does not support the **focusable** and **click-effect** attributes. > The **\<dialog>** component does not support the **focusable** and **click-effect** attributes.
## Styles ## Styles
Only the **width**, **height**, **margin**, **margin-[left|top|right|bottom]**, and **margin-[start|end]** styles in [Universal Styles](js-components-common-styles.md) are supported. Only the **width**, **height**, **margin**, **margin-[left|top|right|bottom]**, and **margin-[start|end]** styles in [Universal Styles](../arkui-js/js-components-common-styles.md) are supported.
## Events
Events in [Universal Events](js-components-common-events.md) are not supported. The following table lists the supported event. ## Events
The following events are supported. The [universal events](../arkui-js/js-components-common-events.md) are not supported.
| Name | Parameter | Description |
| ------------------ | ---- | -------------------------- |
| cancel | - | Triggered when a user touches an area outside the dialog box to cancel the dialog box.|
| show<sup>7+</sup> | - | Triggered when the dialog box is displayed. |
| close<sup>7+</sup> | - | Triggered when the dialog box is closed. |
| Name | Parameter | Description |
| ------- | --------- | ------------------------------------------------------------ |
| cancel | - | Triggered when a user taps a non-dialog area to cancel the pop-up. |
| show7+ | - | Triggered when the pop-up is displayed. |
| close7+ | - | Triggered when the pop-up is closed. |
## Methods ## Methods
Methods in [Universal Methods](js-components-common-methods.md) are not supported. The following table lists the supported methods. The following methods are supported. The [universal methods](../arkui-js/js-components-common-methods.md) are not supported.
| Name | Parameter | Description |
| ----- | ---- | ------ |
| show | - | Shows a dialog box.|
| close | - | Close the dialog box.|
| Name | Parameter | Description | > **NOTE**
| ----- | --------- | -------------------- | >
| show | - | Shows a dialog box. | > Attributes and styles of a **\<dialog>** component cannot be dynamically updated.
| close | - | Closes a dialog box. |
> ![img](https://gitee.com/openharmony/docs/raw/master/en/application-dev/public_sys-resources/icon-note.gif) **NOTE:** Attributes and styles of a **\<dialog>** component cannot be dynamically updated.
## Example Code ## Example
``` ```html
<!-- xxx.hml --> <!-- xxx.hml -->
<div class="doc-page"> <div class="doc-page">
<div class="btn-div"> <div class="btn-div">
...@@ -73,6 +79,9 @@ Methods in [Universal Methods](js-components-common-methods.md) are not supporte ...@@ -73,6 +79,9 @@ Methods in [Universal Methods](js-components-common-methods.md) are not supporte
</div> </div>
</dialog> </dialog>
</div> </div>
```
```css
/* xxx.css */ /* xxx.css */
.doc-page { .doc-page {
flex-direction: column; flex-direction: column;
...@@ -119,30 +128,33 @@ Methods in [Universal Methods](js-components-common-methods.md) are not supporte ...@@ -119,30 +128,33 @@ Methods in [Universal Methods](js-components-common-methods.md) are not supporte
background-color: #F2F2F2; background-color: #F2F2F2;
text-color: #0D81F2; text-color: #0D81F2;
} }
```
```js
// xxx.js // xxx.js
import prompt from '@system.prompt'; import prompt from '@system.prompt';
export default { export default {
showDialog(e) { showDialog() {
this.$element('simpledialog').show() this.$element('simpledialog').show()
}, },
cancelDialog(e) { cancelDialog() {
prompt.showToast({ prompt.showToast({
message: 'Dialog cancelled' message: 'Dialog cancelled'
}) })
}, },
cancelSchedule(e) { cancelSchedule() {
this.$element('simpledialog').close() this.$element('simpledialog').close()
prompt.showToast({ prompt.showToast({
message: 'Successfully cancelled' message: 'Successfully cancelled'
}) })
}, },
setSchedule(e) { setSchedule() {
this.$element('simpledialog').close() this.$element('simpledialog').close()
prompt.showToast({ prompt.showToast({
message: 'Successfully confirmed' message: 'Successfully confirmed'
}) })
}, },
doubleclick(e){ doubleclick(){
prompt.showToast({ prompt.showToast({
message: 'doubleclick' message: 'doubleclick'
}) })
...@@ -150,4 +162,4 @@ export default { ...@@ -150,4 +162,4 @@ export default {
} }
``` ```
![img](figures/4.gif) ![4](figures/4.gif)
\ No newline at end of file
...@@ -24,7 +24,7 @@ Create a badge. ...@@ -24,7 +24,7 @@ Create a badge.
| count | number | Yes| - | Number of notifications.| | count | number | Yes| - | Number of notifications.|
| position | [BadgePosition](#badgeposition) | No| BadgePosition.RightTop | Position to display the badge relative to the parent component.| | position | [BadgePosition](#badgeposition) | No| BadgePosition.RightTop | Position to display the badge relative to the parent component.|
| maxCount | number | No| 99 | Maximum number of notifications. When the maximum number is reached, only **maxCount+** is displayed.| | maxCount | number | No| 99 | Maximum number of notifications. When the maximum number is reached, only **maxCount+** is displayed.|
| style | [BadgeStyle](#badgestyle) | Yes| - | Style of the badge, including the font color, font size, badge color, and badge size. | | style | [BadgeStyle](#badgestyle) | Yes| - | Style of the badge, including the font color, font size, badge color, and badge size.|
**Method 2**: Badge(value: {value: string, position?: BadgePosition, style: BadgeStyle}) **Method 2**: Badge(value: {value: string, position?: BadgePosition, style: BadgeStyle})
...@@ -36,7 +36,7 @@ Creates a badge based on the given string. ...@@ -36,7 +36,7 @@ Creates a badge based on the given string.
| -------- | -------- | -------- | -------- | -------- | | -------- | -------- | -------- | -------- | -------- |
| value | string | Yes| - | Prompt content.| | value | string | Yes| - | Prompt content.|
| position | [BadgePosition](#badgeposition) | No| BadgePosition.RightTop | Position to display the badge relative to the parent component.| | position | [BadgePosition](#badgeposition) | No| BadgePosition.RightTop | Position to display the badge relative to the parent component.|
| style | [BadgeStyle](#badgestyle) | Yes| - | Style of the badge, including the font color, font size, badge color, and badge size. | | style | [BadgeStyle](#badgestyle) | Yes| - | Style of the badge, including the font color, font size, badge color, and badge size.|
## BadgePosition ## BadgePosition
...@@ -47,12 +47,13 @@ Creates a badge based on the given string. ...@@ -47,12 +47,13 @@ Creates a badge based on the given string.
| Left | The badge is vertically centered on the left of the parent component.| | Left | The badge is vertically centered on the left of the parent component.|
## BadgeStyle ## BadgeStyle
| Name| Type| Mandatory| Default Value| Description|
| -------- | -------- | -------- | -------- | -------- | | Name | Type | Mandatory| Default Value | Description |
| color | [ResourceColor](ts-types.md#resourcecolor) | No| Color.White | Font color. | | ---------- | ------------------------------------------ | ---- | ----------- | ------------------------------------------- |
| fontSize | number&nbsp;\|&nbsp;string | No| 10 | Font size. | | color | [ResourceColor](ts-types.md#resourcecolor) | No | Color.White | Font color. |
| badgeSize | number&nbsp;\|&nbsp;string | Yes| - | Badge size.| | fontSize | number \| string | No | 10 | Font size, in vp. |
| badgeColor | [ResourceColor](ts-types.md#resourcecolor) | No| Color.Red | Badge color.| | badgeSize | number \| string | No | 16 | Badge size, in vp. This parameter cannot be set in percentage. If it is set to an invalid value, the default value is used.|
| badgeColor | [ResourceColor](ts-types.md#resourcecolor) | No | Color.Red | Badge color. |
## Example ## Example
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册