| reason | string | Yes| Reason for delayed transition to the suspended state.|
| reason | string | Yes | Reason for delayed transition to the suspended state. |
| callback | Callback<void> | Yes| Invoked when a delay is about to time out. Generally, this callback is used to notify the application 6 seconds before the delay times out.|
| callback | Callback<void> | Yes | Invoked when a delay is about to time out. Generally, this callback is used to notify the application 6 seconds before the delay times out. |
| requestId | number | Yes| ID of the suspension delay request.|
| requestId | number | Yes | ID of the suspension delay request. |
| callback | AsyncCallback<number> | Yes| Callback used to return the remaining duration before the application is suspended, in milliseconds.|
| callback | AsyncCallback<number> | Yes | Callback used to return the remaining duration before the application is suspended, in milliseconds. |
**Example**
**Example**
...
@@ -78,14 +78,14 @@ Obtains the remaining duration before the application is suspended. This API use
...
@@ -78,14 +78,14 @@ Obtains the remaining duration before the application is suspended. This API use
| wantAgent | [WantAgent](js-apis-wantAgent.md)| Yes| Notification parameter, which is used to specify the target page that is redirected to when a continuous task notification is clicked.|
| wantAgent | [WantAgent](js-apis-wantAgent.md) | Yes | Notification parameter, which is used to specify the target page that is redirected to when a continuous task notification is clicked. |
| callback | AsyncCallback<void> | Yes| Callback used to return the result.|
| callback | AsyncCallback<void> | Yes | Callback used to return the result. |
**Example**
**Example**
```js
```js
...
@@ -180,16 +180,16 @@ Requests a continuous task from the system. This API uses a promise to return th
...
@@ -180,16 +180,16 @@ Requests a continuous task from the system. This API uses a promise to return th
| wantAgent | [WantAgent](js-apis-wantAgent.md)| Yes| Notification parameter, which is used to specify the target page when a continuous task notification is clicked.|
| wantAgent | [WantAgent](js-apis-wantAgent.md) | Yes | Notification parameter, which is used to specify the target page when a continuous task notification is clicked. |
| requestId | number | Yes| ID of the suspension delay request.|
| requestId | number | Yes | ID of the suspension delay request. |
| actualDelayTime | number | Yes| Actual suspension delay duration of the application, in milliseconds.<br>The default duration is 180000 when the battery level is higher than or equal to the broadcast low battery level and 60000 when the battery level is lower than the broadcast low battery level.|
| actualDelayTime | number | Yes | Actual suspension delay duration of the application, in milliseconds.<br>The default duration is 180000 when the battery level is higher than or equal to the broadcast low battery level and 60000 when the battery level is lower than the broadcast low battery level. |
| interval | string | Yes| Execution frequency of the callback for returning the acceleration sensor data.<br>The default value is **normal**. The options are as follows:<br>- **game**: called at an interval of 20 ms, which is applicable to gaming scenarios.<br>- **ui**: called at an interval of 60 ms, which is applicable to UI updating scenarios.<br>- **normal**: called at an interval of 200 ms, which is applicable to power-saving scenarios.|
| interval | string | Yes | Execution frequency of the callback for returning the acceleration sensor data.<br>The default value is **normal**. The options are as follows:<br>- **game**: called at an interval of 20 ms, which is applicable to gaming scenarios.<br>- **ui**: called at an interval of 60 ms, which is applicable to UI updating scenarios.<br>- **normal**: called at an interval of 200 ms, which is applicable to power-saving scenarios. |
| success | Function | Yes| Called when the acceleration sensor data changes.|
| success | Function | Yes | Called when the acceleration sensor data changes. |
| fail | Function | No| Callback upon failure.|
| fail | Function | No | Callback upon failure. |
Return values of the success callback
Return values of the success callback
| Name| Type| Description|
| Name | Type | Description |
| -------- | -------- | -------- |
| ---- | ------ | --------------------------- |
| x | number | Acceleration on the x-axis.|
| x | number | Acceleration on the x-axis. |
| y | number | Acceleration on the y-axis.|
| y | number | Acceleration on the y-axis. |
| z | number | Acceleration on the z-axis.|
| z | number | Acceleration on the z-axis. |
**Example**
**Example**
...
@@ -92,16 +92,16 @@ Subscribes to data changes of the compass sensor. If this API is called multiple
...
@@ -92,16 +92,16 @@ Subscribes to data changes of the compass sensor. If this API is called multiple
| interval | string | Yes| Interval at which the callback is invoked to return the device orientation sensor data.<br>The default value is **normal**. The options are as follows:<br>- **game**: called at an interval of 20 ms, which is applicable to gaming scenarios.<br>- **ui**: called at an interval of 60 ms, which is applicable to UI updating scenarios.<br>- **normal**: called at an interval of 200 ms, which is applicable to power-saving scenarios.|
| interval | string | Yes | Interval at which the callback is invoked to return the device orientation sensor data.<br>The default value is **normal**. The options are as follows:<br>- **game**: called at an interval of 20 ms, which is applicable to gaming scenarios.<br>- **ui**: called at an interval of 60 ms, which is applicable to UI updating scenarios.<br>- **normal**: called at an interval of 200 ms, which is applicable to power-saving scenarios. |
| success | Function | Yes| Called when the device orientation sensor data changes.|
| success | Function | Yes | Called when the device orientation sensor data changes. |
| interval | string | Yes| Interval at which the callback is invoked to return the gyroscope sensor data.<br>The default value is **normal**. The options are as follows:<br>- **game**: called at an interval of 20 ms, which is applicable to gaming scenarios.<br>- **ui**: called at an interval of 60 ms, which is applicable to UI updating scenarios.<br>- **normal**: called at an interval of 200 ms, which is applicable to power-saving scenarios.|
| interval | string | Yes | Interval at which the callback is invoked to return the gyroscope sensor data.<br>The default value is **normal**. The options are as follows:<br>- **game**: called at an interval of 20 ms, which is applicable to gaming scenarios.<br>- **ui**: called at an interval of 60 ms, which is applicable to UI updating scenarios.<br>- **normal**: called at an interval of 200 ms, which is applicable to power-saving scenarios. |
| success | Function | Yes| Called when the gyroscope sensor data changes.|
| success | Function | Yes | Called when the gyroscope sensor data changes. |
@@ -8,7 +8,7 @@ The Update module applies to updates throughout the entire system, including bui
...
@@ -8,7 +8,7 @@ The Update module applies to updates throughout the entire system, including bui
There are two types of updates: SD card update and over the air (OTA) update.
There are two types of updates: SD card update and over the air (OTA) update.
- The SD card update depends on the update packages and SD cards.
- The SD card update depends on the update packages and SD cards.
- The OTA update depends on the server deployed by the phone manufacturer for managing update packages. The OTA server IP address is passed by the caller. The request interface is fixed and developed by the phone manufacturer.
- The OTA update depends on the server deployed by the device manufacturer for managing update packages. The OTA server IP address is passed by the caller. The request interface is fixed and developed by the device manufacturer.
## Modules to Import
## Modules to Import
...
@@ -31,15 +31,15 @@ Obtains the **Updater** object for local update.
...
@@ -31,15 +31,15 @@ Obtains the **Updater** object for local update.
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p196974598338"><aname="p196974598338"></a><aname="p196974598338"></a>Dynamic modification is not supported. If this attribute is not set, capsule-like buttons are displayed. Different from the capsule button, the four rounded corners of a capsule-like button can be configured using <strongid="b14306174652119"><aname="b14306174652119"></a><aname="b14306174652119"></a>border-radius</strong>. Available button types are as follows:</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p196974598338"><aname="p196974598338"></a><aname="p196974598338"></a>Dynamic modification is not supported. If this attribute is not set, capsule-like buttons are displayed. Different from the capsule button, the four rounded corners of a capsule-like button can be configured using <strongid="b14306174652119"><aname="b14306174652119"></a><aname="b14306174652119"></a>border-radius</strong>. Available button types are as follows:</p>
<aname="ul16971659103317"></a><aname="ul16971659103317"></a><ulid="ul16971659103317"><li><strongid="b2068317502142"><aname="b2068317502142"></a><aname="b2068317502142"></a>capsule</strong>: a capsule button with fillets, background color, and text</li><li><strongid="b13498122171611"><aname="b13498122171611"></a><aname="b13498122171611"></a>circle</strong>: a circle button which can be used to place icons</li><li><strongid="b17405113184910"><aname="b17405113184910"></a><aname="b17405113184910"></a>text</strong>: a text button which displays the text only</li><li><strongid="b1654481619215"><aname="b1654481619215"></a><aname="b1654481619215"></a>arc</strong>: an arc button. This value is applicable to wearables only.</li><li><strongid="b49041951132"><aname="b49041951132"></a><aname="b49041951132"></a>download</strong>: a download button. The download progress bar is added. This value is applicable to smart TVs and smartphones.</li></ul>
<aname="ul16971659103317"></a><aname="ul16971659103317"></a><ulid="ul16971659103317"><li><strongid="b2068317502142"><aname="b2068317502142"></a><aname="b2068317502142"></a>capsule</strong>: a capsule button with fillets, background color, and text</li><li><strongid="b13498122171611"><aname="b13498122171611"></a><aname="b13498122171611"></a>circle</strong>: a circle button which can be used to place icons</li><li><strongid="b17405113184910"><aname="b17405113184910"></a><aname="b17405113184910"></a>text</strong>: a text button which displays the text only</li><li><strongid="b1654481619215"><aname="b1654481619215"></a><aname="b1654481619215"></a>arc</strong>: an arc button. This value is applicable to wearables only.</li><li><strongid="b49041951132"><aname="b49041951132"></a><aname="b49041951132"></a>download</strong>: a download button. The download progress bar is added. </li></ul>
@@ -72,7 +72,7 @@ In addition to the attributes in [Universal Attributes](js-components-common-at
...
@@ -72,7 +72,7 @@ In addition to the attributes in [Universal Attributes](js-components-common-at
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p1455632813277"><aname="p1455632813277"></a><aname="p1455632813277"></a>Data structures used by <strongid="b1997913981710"><aname="b1997913981710"></a><aname="b1997913981710"></a>progress</strong>, <strongid="b991191118176"><aname="b991191118176"></a><aname="b991191118176"></a>loading</strong>, and <strongid="b962820295179"><aname="b962820295179"></a><aname="b962820295179"></a>rainbow</strong> charts.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p1455632813277"><aname="p1455632813277"></a><aname="p1455632813277"></a>Data structures used by <strongid="b1997913981710"><aname="b1997913981710"></a><aname="b1997913981710"></a>progress</strong>, <strongid="b991191118176"><aname="b991191118176"></a><aname="b991191118176"></a>loading</strong>, and <strongid="b962820295179"><aname="b962820295179"></a><aname="b962820295179"></a>rainbow</strong> charts.</p>
<pid="p19327195813510"><aname="p19327195813510"></a><aname="p19327195813510"></a><strongid="b196601530164710"><aname="b196601530164710"></a><aname="b196601530164710"></a>DataSegment</strong> is available for <strongid="b1066083012472"><aname="b1066083012472"></a><aname="b1066083012472"></a>progress</strong> and <strongid="b16660143054719"><aname="b16660143054719"></a><aname="b16660143054719"></a>loading</strong> charts.</p>
<pid="p19327195813510"><aname="p19327195813510"></a><aname="p19327195813510"></a><strongid="b196601530164710"><aname="b196601530164710"></a><aname="b196601530164710"></a>DataSegment</strong> is available for <strongid="b1066083012472"><aname="b1066083012472"></a><aname="b1066083012472"></a>progress</strong> and <strongid="b16660143054719"><aname="b16660143054719"></a><aname="b16660143054719"></a>loading</strong> charts.</p>
<pid="p14326258457"><aname="p14326258457"></a><aname="p14326258457"></a><strongid="b1044023344716"><aname="b1044023344716"></a><aname="b1044023344716"></a>Array<<ahref="#table2596183616210">DataSegment</a>></strong> is available for <strongid="b194405335477"><aname="b194405335477"></a><aname="b194405335477"></a>rainbow</strong> charts. A maximum of nine <strongid="b15441133114716"><aname="b15441133114716"></a><aname="b15441133114716"></a>DataSegment</strong> are supported in the array.</p>
<pid="p14326258457"><aname="p14326258457"></a><aname="p14326258457"></a><strongid="b1044023344716"><aname="b1044023344716"></a><aname="b1044023344716"></a>Array<<ahref="#table2596183616210">DataSegment</a>></strong> is available for <strongid="b194405335477"><aname="b194405335477"></a><aname="b194405335477"></a>rainbow</strong> charts. A maximum of nine <strongid="b15441133114716"><aname="b15441133114716"></a><aname="b15441133114716"></a>DataSegment</strong> are supported in the array.</p>
<divclass="note"id="note74451328478"><aname="note74451328478"></a><aname="note74451328478"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p1744552174711"><aname="p1744552174711"></a><aname="p1744552174711"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p92085712225"><aname="p92085712225"></a><aname="p92085712225"></a>Whether to enable the effects for <strongid="b7262163754711"><aname="b7262163754711"></a><aname="b7262163754711"></a>progress</strong> and <strongid="b12263437134715"><aname="b12263437134715"></a><aname="b12263437134715"></a>rainbow</strong> charts.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p92085712225"><aname="p92085712225"></a><aname="p92085712225"></a>Whether to enable the effects for <strongid="b7262163754711"><aname="b7262163754711"></a><aname="b7262163754711"></a>progress</strong> and <strongid="b12263437134715"><aname="b12263437134715"></a><aname="b12263437134715"></a>rainbow</strong> charts.</p>
<divclass="note"id="note15640931164717"><aname="note15640931164717"></a><aname="note15640931164717"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p2064014318476"><aname="p2064014318476"></a><aname="p2064014318476"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p181331564408"><aname="p181331564408"></a><aname="p181331564408"></a>Animation duration for expanding a <strongid="b538918433184"><aname="b538918433184"></a><aname="b538918433184"></a>rainbow</strong> chart, in milliseconds.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p181331564408"><aname="p181331564408"></a><aname="p181331564408"></a>Animation duration for expanding a <strongid="b538918433184"><aname="b538918433184"></a><aname="b538918433184"></a>rainbow</strong> chart, in milliseconds.</p>
<divclass="note"id="note12117134774716"><aname="note12117134774716"></a><aname="note12117134774716"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p12117124720471"><aname="p12117124720471"></a><aname="p12117124720471"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p781663212178"><aname="p781663212178"></a><aname="p781663212178"></a>Whether to display the lunar calendar switch in the date selector. When this switch is displayed, you can switch between the lunar calendar and Gregorian calendar. Turn on the switch to display the lunar calendar, and turn off the switch to hide the lunar calendar. This attribute is available for smartphones.</p>
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p781663212178"><aname="p781663212178"></a><aname="p781663212178"></a>Whether to display the lunar calendar switch in the date selector. When this switch is displayed, you can switch between the lunar calendar and Gregorian calendar. Turn on the switch to display the lunar calendar, and turn off the switch to hide the lunar calendar. </p>
<divclass="note"id="note1688512355211"><aname="note1688512355211"></a><aname="note1688512355211"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p488582345212"><aname="p488582345212"></a><aname="p488582345212"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p12203111510184"><aname="p12203111510184"></a><aname="p12203111510184"></a>Whether to display the lunar calendar switch in the date and time selector. When this switch is displayed, you can switch between the lunar calendar and Gregorian calendar. Turn on the switch to display the lunar calendar, and turn off the switch to hide the lunar calendar. This attribute is available for smartphones.</p>
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p12203111510184"><aname="p12203111510184"></a><aname="p12203111510184"></a>Whether to display the lunar calendar switch in the date and time selector. When this switch is displayed, you can switch between the lunar calendar and Gregorian calendar. Turn on the switch to display the lunar calendar, and turn off the switch to hide the lunar calendar. </p>
<divclass="note"id="note11541837195218"><aname="note11541837195218"></a><aname="note11541837195218"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p454119371529"><aname="p454119371529"></a><aname="p454119371529"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="40.01599840015999%"headers="mcps1.1.6.1.5 "><pid="p20494323144012"><aname="p20494323144012"></a><aname="p20494323144012"></a>Font color of the items that gradually disappear. Disappearing items are the top option and bottom option of a column containing five options in total.</p>
<tdclass="cellrowborder"valign="top"width="40.01599840015999%"headers="mcps1.1.6.1.5 "><pid="p20494323144012"><aname="p20494323144012"></a><aname="p20494323144012"></a>Font color of the items that gradually disappear. Disappearing items are the top option and bottom option of a column containing five options in total.</p>
<divclass="note"id="note682125718522"><aname="note682125718522"></a><aname="note682125718522"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p17821185711521"><aname="p17821185711521"></a><aname="p17821185711521"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="40.01599840015999%"headers="mcps1.1.6.1.5 "><pid="p1549532364020"><aname="p1549532364020"></a><aname="p1549532364020"></a>Font size of the items that gradually disappear. Disappearing items are the top option and bottom option of a column containing five options in total.</p>
<tdclass="cellrowborder"valign="top"width="40.01599840015999%"headers="mcps1.1.6.1.5 "><pid="p1549532364020"><aname="p1549532364020"></a><aname="p1549532364020"></a>Font size of the items that gradually disappear. Disappearing items are the top option and bottom option of a column containing five options in total.</p>
<divclass="note"id="note17211975317"><aname="note17211975317"></a><aname="note17211975317"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p1821895535"><aname="p1821895535"></a><aname="p1821895535"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p9878910132617"><aname="p9878910132617"></a><aname="p9878910132617"></a>Whether the date selector displays the lunar calendar switch, which is used to switch between the Gregorian calendar and lunar calendar. The value <strongid="b1242195251513"><aname="b1242195251513"></a><aname="b1242195251513"></a>true</strong> means to display the lunar calendar switch for users to switch between the Gregorian calendar and lunar calendar. The value <strongid="b729391317186"><aname="b729391317186"></a><aname="b729391317186"></a>false</strong> means not to display the lunar calendar switch.</p>
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p9878910132617"><aname="p9878910132617"></a><aname="p9878910132617"></a>Whether the date selector displays the lunar calendar switch, which is used to switch between the Gregorian calendar and lunar calendar. The value <strongid="b1242195251513"><aname="b1242195251513"></a><aname="b1242195251513"></a>true</strong> means to display the lunar calendar switch for users to switch between the Gregorian calendar and lunar calendar. The value <strongid="b729391317186"><aname="b729391317186"></a><aname="b729391317186"></a>false</strong> means not to display the lunar calendar switch.</p>
<divclass="note"id="note799016359510"><aname="note799016359510"></a><aname="note799016359510"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p49901135165115"><aname="p49901135165115"></a><aname="p49901135165115"></a>This attribute is only supported on phones and tablets. When both <strongid="b66411209185"><aname="b66411209185"></a><aname="b66411209185"></a>lunarswitch</strong> and <strongid="b1364102010185"><aname="b1364102010185"></a><aname="b1364102010185"></a>lunar</strong> are set to <strongid="b665102015187"><aname="b665102015187"></a><aname="b665102015187"></a>true</strong>, the switch is selected.</p>
<divclass="note"id="note799016359510"><aname="note799016359510"></a><aname="note799016359510"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p49901135165115"><aname="p49901135165115"></a><aname="p49901135165115"></a> When both <strongid="b66411209185"><aname="b66411209185"></a><aname="b66411209185"></a>lunarswitch</strong> and <strongid="b1364102010185"><aname="b1364102010185"></a><aname="b1364102010185"></a>lunar</strong> are set to <strongid="b665102015187"><aname="b665102015187"></a><aname="b665102015187"></a>true</strong>, the switch is selected.</p>
</div></div>
</div></div>
</td>
</td>
</tr>
</tr>
...
@@ -329,7 +329,7 @@ When **type** is set to **datetime**, a date and time selector is used.
...
@@ -329,7 +329,7 @@ When **type** is set to **datetime**, a date and time selector is used.
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p134738505123"><aname="p134738505123"></a><aname="p134738505123"></a>Whether the date selector displays the lunar calendar switch, which is used to switch between the Gregorian calendar and lunar calendar. The value <strongid="b11888837151819"><aname="b11888837151819"></a><aname="b11888837151819"></a>true</strong> means to display the lunar calendar switch for users to switch between the Gregorian calendar and lunar calendar. The value <strongid="b454518384186"><aname="b454518384186"></a><aname="b454518384186"></a>false</strong> means not to display the lunar calendar switch.</p>
<tdclass="cellrowborder"valign="top"width="49.410000000000004%"headers="mcps1.1.6.1.5 "><pid="p134738505123"><aname="p134738505123"></a><aname="p134738505123"></a>Whether the date selector displays the lunar calendar switch, which is used to switch between the Gregorian calendar and lunar calendar. The value <strongid="b11888837151819"><aname="b11888837151819"></a><aname="b11888837151819"></a>true</strong> means to display the lunar calendar switch for users to switch between the Gregorian calendar and lunar calendar. The value <strongid="b454518384186"><aname="b454518384186"></a><aname="b454518384186"></a>false</strong> means not to display the lunar calendar switch.</p>
<divclass="note"id="note5428114735118"><aname="note5428114735118"></a><aname="note5428114735118"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p1342819474512"><aname="p1342819474512"></a><aname="p1342819474512"></a>This attribute is only supported on phones and tablets. When both <strongid="b57802039111819"><aname="b57802039111819"></a><aname="b57802039111819"></a>lunarswitch</strong> and <strongid="b18781153991810"><aname="b18781153991810"></a><aname="b18781153991810"></a>lunar</strong> are set to <strongid="b4781173931813"><aname="b4781173931813"></a><aname="b4781173931813"></a>true</strong>, the switch is selected.</p>
<divclass="note"id="note5428114735118"><aname="note5428114735118"></a><aname="note5428114735118"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p1342819474512"><aname="p1342819474512"></a><aname="p1342819474512"></a>When both <strongid="b57802039111819"><aname="b57802039111819"></a><aname="b57802039111819"></a>lunarswitch</strong> and <strongid="b18781153991810"><aname="b18781153991810"></a><aname="b18781153991810"></a>lunar</strong> are set to <strongid="b4781173931813"><aname="b4781173931813"></a><aname="b4781173931813"></a>true</strong>, the switch is selected.</p>
</div></div>
</div></div>
</td>
</td>
</tr>
</tr>
...
@@ -529,7 +529,7 @@ In addition to the styles in [Universal Styles](js-components-common-styles.md)
...
@@ -529,7 +529,7 @@ In addition to the styles in [Universal Styles](js-components-common-styles.md)
<tdclass="cellrowborder"valign="top"width="52.274772522747725%"headers="mcps1.1.6.1.5 "><pid="p116215526369"><aname="p116215526369"></a><aname="p116215526369"></a>Height of the selector option list.</p>
<tdclass="cellrowborder"valign="top"width="52.274772522747725%"headers="mcps1.1.6.1.5 "><pid="p116215526369"><aname="p116215526369"></a><aname="p116215526369"></a>Height of the selector option list.</p>
<divclass="note"id="note769381335220"><aname="note769381335220"></a><aname="note769381335220"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p18693101311524"><aname="p18693101311524"></a><aname="p18693101311524"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p27381813364"><aname="p27381813364"></a><aname="p27381813364"></a>Step to increment the rating value.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p27381813364"><aname="p27381813364"></a><aname="p27381813364"></a>Step to increment the rating value.</p>
<divclass="note"id="note1249472985312"><aname="note1249472985312"></a><aname="note1249472985312"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p749462910531"><aname="p749462910531"></a><aname="p749462910531"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p83958323527"><aname="p83958323527"></a><aname="p83958323527"></a>Slider style. Available values are as follows:</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p83958323527"><aname="p83958323527"></a><aname="p83958323527"></a>Slider style. Available values are as follows:</p>
<aname="ul742810911538"></a><aname="ul742810911538"></a><ulid="ul742810911538"><li><strongid="b6310165918435"><aname="b6310165918435"></a><aname="b6310165918435"></a>outset</strong>: The slider is on the sliding bar.</li><li><strongid="b144297112440"><aname="b144297112440"></a><aname="b144297112440"></a>inset</strong>: The slider is inside the sliding bar.<divclass="note"id="note10509152215419"><aname="note10509152215419"></a><aname="note10509152215419"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p14509172218549"><aname="p14509172218549"></a><aname="p14509172218549"></a>This attribute is only supported on phones and tablets.</p>
<aname="ul742810911538"></a><aname="ul742810911538"></a><ulid="ul742810911538"><li><strongid="b6310165918435"><aname="b6310165918435"></a><aname="b6310165918435"></a>outset</strong>: The slider is on the sliding bar.</li><li><strongid="b144297112440"><aname="b144297112440"></a><aname="b144297112440"></a>inset</strong>: The slider is inside the sliding bar.<divclass="note"id="note10509152215419"><aname="note10509152215419"></a><aname="note10509152215419"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p14509172218549"><aname="p14509172218549"></a><aname="p14509172218549"></a></p>
</div></div>
</div></div>
</li></ul>
</li></ul>
</td>
</td>
...
@@ -90,7 +90,7 @@ In addition to the attributes in [Universal Attributes](js-components-common-at
...
@@ -90,7 +90,7 @@ In addition to the attributes in [Universal Attributes](js-components-common-at
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p639683265217"><aname="p639683265217"></a><aname="p639683265217"></a>Whether to display slider scales.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p639683265217"><aname="p639683265217"></a><aname="p639683265217"></a>Whether to display slider scales.</p>
<divclass="note"id="note8765635135413"><aname="note8765635135413"></a><aname="note8765635135413"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p576523535418"><aname="p576523535418"></a><aname="p576523535418"></a>This attribute is only supported on phones and tablets.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p16396133212520"><aname="p16396133212520"></a><aname="p16396133212520"></a>Whether a pop-up is displayed to show the percentage value on the slider.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p16396133212520"><aname="p16396133212520"></a><aname="p16396133212520"></a>Whether a pop-up is displayed to show the percentage value on the slider.</p>
<divclass="note"id="note0708645135419"><aname="note0708645135419"></a><aname="note0708645135419"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p4708154510548"><aname="p4708154510548"></a><aname="p4708154510548"></a>This attribute is only supported on phones and tablets.</p>
<divclass="note"id="note29562075516"><aname="note29562075516"></a><aname="note29562075516"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p7956203555"><aname="p7956203555"></a><aname="p7956203555"></a>This attribute is only supported on phones, tablets, and wearables.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p118021351362"><aname="p118021351362"></a><aname="p118021351362"></a>Pull-down friction coefficient. The value ranges from <strongid="b7887020335"><aname="b7887020335"></a><aname="b7887020335"></a>0</strong> to <strongid="b81365257313"><aname="b81365257313"></a><aname="b81365257313"></a>100</strong>. A larger value indicates a more responsive component. For example, if a user pulls the component down 100 px, it will actually move 100 *<strongid="b2130757132018"><aname="b2130757132018"></a><aname="b2130757132018"></a>friction</strong>% px.</p>
<tdclass="cellrowborder"valign="top"width="35.76%"headers="mcps1.1.6.1.5 "><pid="p118021351362"><aname="p118021351362"></a><aname="p118021351362"></a>Pull-down friction coefficient. The value ranges from <strongid="b7887020335"><aname="b7887020335"></a><aname="b7887020335"></a>0</strong> to <strongid="b81365257313"><aname="b81365257313"></a><aname="b81365257313"></a>100</strong>. A larger value indicates a more responsive component. For example, if a user pulls the component down 100 px, it will actually move 100 *<strongid="b2130757132018"><aname="b2130757132018"></a><aname="b2130757132018"></a>friction</strong>% px.</p>
<divclass="note"id="note204304260349"><aname="note204304260349"></a><aname="note204304260349"></a><spanclass="notetitle"> NOTE: </span><divclass="notebody"><pid="p1343012264345"><aname="p1343012264345"></a><aname="p1343012264345"></a>This attribute is only supported on phones, tablets, and wearables.</p>
| domStorageAccess | boolean | false | Whether to enable the DOM Storage API permission. By default, the permission is disabled.|
| domStorageAccess | boolean | false | Whether to enable the DOM Storage API permission. By default, the permission is disabled. |
| fileAccess | boolean | true | Whether to enable in-application rawfile access through [$rawfile(filepath/filename)](../../ui/ts-application-resource-access.md). By default, this feature is enabled.|
| fileAccess | boolean | true | Whether to enable in-application rawfile access through [$rawfile(filepath/filename)](../../ui/ts-application-resource-access.md). By default, this feature is enabled. |
| imageAccess | boolean | true | Whether to enable automatic image loading. By default, this feature is enabled. |
| imageAccess | boolean | true | Whether to enable automatic image loading. By default, this feature is enabled. |
| javaScriptProxy | { <br> object: object, <br> name: string, <br> methodList: Array\<string\>, <br> controller: WebController <br>} | - | JavaScript object to be injected into the window. Methods of this object can be invoked in the window. The parameters in this attribute cannot be updated.<br>**object** indicates the object to be registered. Methods can be declared, but not attributes. The parameters and return value can only be of the string, number, or Boolean type.<br>**name** indicates the name of the object to be registered, which is the same as that invoked in the window. After registration, the window can use this name to access the JavaScript object at the application side.<br>**methodList** indicates the methods of the JavaScript object to be registered at the application side.<br>**controller** indicates the controller.|
| javaScriptProxy | { <br> object: object, <br> name: string, <br> methodList: Array\<string\>, <br> controller: WebController <br>} | - | JavaScript object to be injected into the window. Methods of this object can be invoked in the window. The parameters in this attribute cannot be updated.<br>**object** indicates the object to be registered. Methods can be declared, but not attributes. The parameters and return value can only be of the string, number, or Boolean type.<br>**name** indicates the name of the object to be registered, which is the same as that invoked in the window. After registration, the window can use this name to access the JavaScript object at the application side.<br>**methodList** indicates the methods of the JavaScript object to be registered at the application side.<br>**controller** indicates the controller.|
| javaScriptAccess | boolean | true | Whether JavaScript scripts can be executed. By default, JavaScript scripts can be executed. |
| javaScriptAccess | boolean | true | Whether JavaScript scripts can be executed. By default, JavaScript scripts can be executed. |
| mixedMode | MixedMode | MixedMode.None | Whether to enable loading of HTTP and HTTPS hybrid content can be loaded. By default, this feature is disabled.|
| mixedMode | MixedMode | MixedMode.None | Whether to enable loading of HTTP and HTTPS hybrid content can be loaded. By default, this feature is disabled. |
| onlineImageAccess | boolean | true | Whether to enable access to online images through HTTP and HTTPS. By default, this feature is enabled.|
| onlineImageAccess | boolean | true | Whether to enable access to online images through HTTP and HTTPS. By default, this feature is enabled. |
| zoomAccess | boolean | true | Whether to enable zoom gestures. By default, zoom gestures are enabled. |
| zoomAccess | boolean | true | Whether to enable zoom gestures. By default, zoom gestures are enabled. |
| onAlert(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult) }) => boolean) | <p>Triggered when **alert()** is invoked to display an alert dialog box on the web page.<br>If the callback returns **false**, the default dialog box is displayed. If the callback returns **true**, a system application can invoke the system dialog box capability (allows only the confirm operation) and invoke the **JsResult** API to notify the **\<Web>** component of the user's operation.<br>**url**: URL of the web page where the dialog box is displayed.<br>**message**: information displayed in the dialog box.<br>**JsResult**: notifies the **\<Web>** component of the user's operation.</p> |
| onAlert(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult) }) => boolean) | <p>Triggered when **alert()** is invoked to display an alert dialog box on the web page.<br>If the callback returns **false**, the default dialog box is displayed. If the callback returns **true**, a system application can invoke the system dialog box capability (allows only the confirm operation) and invoke the **JsResult** API to notify the **\<Web>** component of the user's operation.<br>**url**: URL of the web page where the dialog box is displayed.<br>**message**: information displayed in the dialog box.<br>**JsResult**: notifies the **\<Web>** component of the user's operation.</p> |
| onBeforeUnload(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult) }) => boolean) | <p>Triggered when the current page is about to exit after the user refreshes or closes the page.<br>If the callback returns **false**, the default dialog box is displayed. If the callback returns **true**, a system application can invoke the system dialog box capability (allows the confirm and cancel operations) and invoke the **JsResult** API to notify the **\<Web>** component of the user's operation.<br>**url**: URL of the web page where the dialog box is displayed.<br>**message**: information displayed in the dialog box.<br>**JsResult**: notifies the **\<Web>** component of the user's operation.</p> |
| onBeforeUnload(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult) }) => boolean) | <p>Triggered when the current page is about to exit after the user refreshes or closes the page.<br>If the callback returns **false**, the default dialog box is displayed. If the callback returns **true**, a system application can invoke the system dialog box capability (allows the confirm and cancel operations) and invoke the **JsResult** API to notify the **\<Web>** component of the user's operation.<br>**url**: URL of the web page where the dialog box is displayed.<br>**message**: information displayed in the dialog box.<br>**JsResult**: notifies the **\<Web>** component of the user's operation.</p> |
| onConfirm(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult) }) => boolean) | <p>Triggered when **confirm()** is invoked to display a confirmation dialog box on the web page.<br>If the callback returns **false**, the default dialog box is displayed. If the callback returns **true**, a system application can invoke the system dialog box capability (allows the confirm and cancel operations) and invoke the **JsResult** API to notify the **\<Web>** component of the user's operation.<br>**url**: URL of the web page where the dialog box is displayed.<br>**message**: information displayed in the dialog box.<br>**JsResult**: notifies the **\<Web>** component of the user's operation.</p> |
| onConfirm(callback: (event?: { url: string; message: string; result: [JsResult](#jsresult) }) => boolean) | <p>Triggered when **confirm()** is invoked to display a confirmation dialog box on the web page.<br>If the callback returns **false**, the default dialog box is displayed. If the callback returns **true**, a system application can invoke the system dialog box capability (allows the confirm and cancel operations) and invoke the **JsResult** API to notify the **\<Web>** component of the user's operation.<br>**url**: URL of the web page where the dialog box is displayed.<br>**message**: information displayed in the dialog box.<br>**JsResult**: notifies the **\<Web>** component of the user's operation.</p> |
| onConsole(callback: (event?: { message: [ConsoleMessage](#consolemessage) }) => boolean) | <p>Triggered when the host application is notified of a JavaScript console message.<br>**message**: console message.</p> |
| onConsole(callback: (event?: { message: [ConsoleMessage](#consolemessage) }) => boolean) | <p>Triggered when the host application is notified of a JavaScript console message.<br>**message**: console message.</p> |
| onDownloadStart(callback: (event?: { url: string, userAgent: string, contentDisposition: string, mimetype: string, contentLength: number }) => void) | <p>Triggered when a download task starts on the web page.<br>**url**: URL for the download task.<br>**userAgent**: name of the user agent (UA) for the download task.<br>**contentDisposition**: Content-Disposition response header returned by the server, which may be empty.<br>**mimetype**: content media type (MIME) returned by the server.<br>**contentLength**: length of the file returned by the server.</p> |
| onDownloadStart(callback: (event?: { url: string, userAgent: string, contentDisposition: string, mimetype: string, contentLength: number }) => void) | <p>Triggered when a download task starts on the web page.<br>**url**: URL for the download task.<br>**userAgent**: name of the user agent (UA) for the download task.<br>**contentDisposition**: Content-Disposition response header returned by the server, which may be empty.<br>**mimetype**: content media type (MIME) returned by the server.<br>**contentLength**: length of the file returned by the server.</p> |
| onErrorReceive(callback: (event?: { request: [WebResourceRequest](#webresourceerror), error: [WebResourceError](#webresourceerror) }) => void) | <p>Triggered when an error occurs during web page loading.<br>For better results, simplify the implementation logic in the callback.<br>**request**: encapsulation of a web page request.<br>**error**: encapsulation of a web page resource loading error.</p> |
| onErrorReceive(callback: (event?: { request: [WebResourceRequest](#webresourceerror), error: [WebResourceError](#webresourceerror) }) => void) | <p>Triggered when an error occurs during web page loading.<br>For better results, simplify the implementation logic in the callback.<br>**request**: encapsulation of a web page request.<br>**error**: encapsulation of a web page resource loading error.</p> |
| onHttpErrorReceive(callback: (event?: { request: [WebResourceRequest](#webresourceerror), response: [WebResourceResponse](#webresourceresponse) }) => void) | <p>Triggered when an HTTP error (the response code is greater than or equal to 400) occurs during web page resource loading.<br>**request**: encapsulation of a web page request.<br>**response**: encapsulation of a web page response.</p>|
| onHttpErrorReceive(callback: (event?: { request: [WebResourceRequest](#webresourceerror), response: [WebResourceResponse](#webresourceresponse) }) => void) | <p>Triggered when an HTTP error (the response code is greater than or equal to 400) occurs during web page resource loading.<br>**request**: encapsulation of a web page request.<br>**response**: encapsulation of a web page response.</p>|
| onPageBegin(callback: (event?: { url: string }) => void) | <p>Triggered when the web page starts to be loaded. This API is triggered only for the main frame content, and not for the iframe or frameset content.<br>**url**: URL of the page.</p> |
| onPageBegin(callback: (event?: { url: string }) => void) | <p>Triggered when the web page starts to be loaded. This API is triggered only for the main frame content, and not for the iframe or frameset content.<br>**url**: URL of the page.</p> |
| onPageEnd(callback: (event?: { url: string }) => void) | <p>Triggered when the web page loading is complete. This API is triggered only for the main frame content.<br>**url**: URL of the page.</p> |
| onPageEnd(callback: (event?: { url: string }) => void) | <p>Triggered when the web page loading is complete. This API is triggered only for the main frame content.<br>**url**: URL of the page.</p> |
| onProgressChange(callback: (event?: { newProgress: number }) => void) | <p>Triggered when the web page loading progress changes.<br>**newProgress**: new loading progress. The value is an integer ranging from 0 to 100.</p> |
| onProgressChange(callback: (event?: { newProgress: number }) => void) | <p>Triggered when the web page loading progress changes.<br>**newProgress**: new loading progress. The value is an integer ranging from 0 to 100.</p> |
...
@@ -76,20 +76,20 @@ Universal events are not supported.
...
@@ -76,20 +76,20 @@ Universal events are not supported.
| name | string | Yes | - | Name of the registered JavaScript object, which can be used to invoke the corresponding object on the application side from the web side.|
| name | string | Yes | - | Name of the registered JavaScript object, which can be used to invoke the corresponding object on the application side from the web side. |
### forward
### forward
...
@@ -222,14 +222,14 @@ Obtains the element type of the area being clicked.
...
@@ -222,14 +222,14 @@ Obtains the element type of the area being clicked.
| data | string | Yes | - | Character string obtained after being Base64 or URL encoded. |
| data | string | Yes | - | Character string obtained after being Base64 or URL encoded. |
| mimeType | string | Yes | - | Media type (MIME). |
| mimeType | string | Yes | - | Media type (MIME). |
| encoding | string | Yes | - | Encoding type, which can be Base64 or URL. |
| encoding | string | Yes | - | Encoding type, which can be Base64 or URL. |
| baseUrl | string | No | - | URL (HTTP/HTTPS/data compliant), which is assigned by the **\<Web>** component to **window.origin**.|
| baseUrl | string | No | - | URL (HTTP/HTTPS/data compliant), which is assigned by the **\<Web>** component to **window.origin**. |
| historyUrl | string | No | - | Historical record URL. If this parameter is not empty, it can be managed in historical records to implement page going backward and forward. This parameter is invalid when **baseUrl** is left empty.|
| historyUrl | string | No | - | Historical record URL. If this parameter is not empty, it can be managed in historical records to implement page going backward and forward. This parameter is invalid when **baseUrl** is left empty. |
### loadUrl
### loadUrl
...
@@ -264,10 +264,10 @@ Objects injected through **registerJavaScriptProxy** are still valid on a new pa
...
@@ -264,10 +264,10 @@ Objects injected through **registerJavaScriptProxy** are still valid on a new pa
- options
- options
| Name | Type | Mandatory| Default Value| Description |
| Name | Type | Mandatory | Default Value | Description |
| object | object | Yes | - | Application-side JavaScript object to be registered. Methods can be declared, but not attributes. The parameters and return value can only be of the string, number, or Boolean type.|
| object | object | Yes | - | Application-side JavaScript object to be registered. Methods can be declared, but not attributes. The parameters and return value can only be of the string, number, or Boolean type. |
| name | string | Yes | - | Name of the object to be registered, which is the same as that invoked in the window. After registration, the window can use this name to access the JavaScript object at the application side.|
| name | string | Yes | - | Name of the object to be registered, which is the same as that invoked in the window. After registration, the window can use this name to access the JavaScript object at the application side. |
| methodList | Array\<string\> | Yes | - | Methods of the JavaScript object to be registered at the application side. |
| methodList | Array\<string\> | Yes | - | Methods of the JavaScript object to be registered at the application side. |
### runJavaScript
### runJavaScript
...
@@ -309,10 +309,10 @@ Asynchronously executes a JavaScript script. This API uses a callback to return
...
@@ -309,10 +309,10 @@ Asynchronously executes a JavaScript script. This API uses a callback to return
- options
- options
| Name | Type | Mandatory| Default Value| Description |
| Name | Type | Mandatory | Default Value | Description |
| callback | (result: string) => void | No | - | Callback used to return the result. Returns **null** if the JavaScript script fails to be executed or no value is returned.|
| callback | (result: string) => void | No | - | Callback used to return the result. Returns **null** if the JavaScript script fails to be executed or no value is returned. |
On the page for selecting an ability template, select [Standard]Empty Ability.
On the page for selecting an ability template, select [Standard]Empty Ability.
...
@@ -56,14 +56,14 @@ Before creating a project, you need to install DevEco Studio.
...
@@ -56,14 +56,14 @@ Before creating a project, you need to install DevEco Studio.
}
}
```
```
7. Click Previewer on the right to open the Previewer window. In the Previewer window of the phone type, Hello World is displayed in the middle and in bold.
7. Click Previewer on the right to open the Previewer window. Hello World is displayed in the middle and in bold.
If the Previewer button is unavailable, choose Settings > SDK Manager >OpenHarmony SDK > Tools to check whether the Previewer is installed.
If the Previewer button is unavailable, choose Settings > SDK Manager >OpenHarmony SDK > Tools to check whether the Previewer is installed.
8. Install the application on the phone and run the application. Connect the phone to the computer. After the IDE identifies the phone, click Run'entry'.
8. Install the application and run the application. Connect the device to the computer. After the IDE identifies the device, click Run'entry'.
Before the installation, you must configure an application signature. For details, see [Configuring the OpenHarmony App Signature](../quick-start/configuring-the-openharmony-app-signature.md). After the installation is complete, click the Run icon on the screen to open the application. Hello World is displayed in the center of the screen.
Before the installation, you must configure an application signature. For details, see Configuring the OpenHarmony App Signature. After the installation is complete, click the Run icon on the screen to open the application. Hello World is displayed in the center of the screen.
In addition to specifying the image path, you can also use the media resource symbol $r to reference resources based on the resource qualifier rules in the resources folder. Right-click the resources folder, choose New > Resource Directory, set Resource Type to Media (image resource), and set the resource qualifier to Device-Phone (currently, phones are used).
In addition to specifying the image path, you can also use the media resource symbol $r to reference resources based on the resource qualifier rules in the resources folder. Right-click the resources folder, choose New > Resource Directory, set Resource Type to Media (image resource).Place Tomato.png in the media folder.
3. Add the icon for returning from the FoodDetail page to the food list page. Save the Back.png file to the resources > phone > media directory. Create a custom component PageTitle, which contains the back icon and Food Detail text. Call the router.back() API of the router to display the top page of the route stack, that is, the upper-level page.
3. Add the icon for returning from the FoodDetail page to the food list page. Save the Back.png file to the resources > base > media directory. Create a custom component PageTitle, which contains the back icon and Food Detail text. Call the router.back() API of the router to display the top page of the route stack, that is, the upper-level page.
