@@ -42,7 +42,7 @@ You can set universal styles for components in the **style** attribute or **.css
| backdrop-filter<sup>5+</sup> | string | - | Syntax: backdrop-filter: blur(px)<br>Radius of the background blur area within the component layout. If this style is not set, the default value **0** (no blur) is used. Percentage values are not supported.<br>Example:<br>- backdrop-filter: blur(10px) |
| window-filter<sup>5+</sup> | string | - | Syntax: window-filter: blur(percent), style<sup>5+</sup><br>Blur degree and style for windows within the component layout. If this style is not set, the default value **0%** (no blur area) is used. Different blur degrees and styles for multiple blur areas are not supported. Available values of **style** are as follows: small_light (default value), medium_light, large_light, xlarge_light, small_dark, medium_dark, large_dark, xlarge_dark<br>Example:<br>- window-filter: blur(50%)<br>- window-filter: blur(10%), large_light |
| opacity | number | 1 | Opacity of an element. The value ranges from **0** to **1**. The value **1** means opaque, and **0** means completely transparent. |
| display | string | flex | Type of the box containing an element. Available values are as follows:<br>- **flex**: flexible layout<br>- **none**: not rendered<br>- **grid**: grid layout (available only **div** supports the **display** style)|
| display | string | flex | Type of the box containing an element. Available values are as follows:<br>- **flex**: flexible layout<br>- **none**: not rendered<br>- **grid**: grid layout (available only for the **\<div>** component) |
| visibility | string | visible | Whether to display the box containing an element. The invisible box occupies layout space. (To remove the box, set the **display** attribute to **none**.) Available values are as follows:<br>- **visible**: The element is visible.<br>- **hidden**: The box is hidden but still takes up space.<br>If both **visibility** and **display** are set, only **display** takes effect.|
| flex | number \| string | - | How to divide available space of the parent component for each child component.<br>You can set one, two<sup>5+</sup>, or three<sup>5+</sup> values for this style.<br>Set one value in either of the following ways:<br>- A unitless number to set **flex-grow**.<br>- A valid width value<sup>5+</sup> to set **flex-basis**.<br>Set two values<sup>5+</sup> in the following ways:<br>The first value must be a unitless number used to set **flex-grow**. The second value must be either of the following:<br>- A unitless number to set **flex-shrink**.<br>- A valid width value to set **flex-basis**.<br>Set three values<sup>5+</sup> in the following ways:<br>The first value must be a unitless number used to set **flex-grow**. The second value must be a unitless number used to set **flex-shrink**. The third value must be a valid width value used to set **flex-basis**.<br>This style takes effect only when the container is any of the following components: **\<div>**, **\<list-item>**, **\<tabs>**, **\<refresh>**, and **\<stepper-item><sup>5+</sup>**.|
| flex-grow | number | 0 | How much a child component will grow. The value specifies allocation of the remaining space on the main axis of the parent component. Size of available space = Container size - Total size of all child components. Value **0** indicates that the child component does not grow.<br>This style takes effect only when the container is any of the following components: **\<div>**, **\<list-item>**, **\<tabs>**, **\<refresh>**, and **\<stepper-item><sup>5+</sup>**.|
@@ -8,7 +8,7 @@ The framework provides four pixel units, with vp as the reference data unit.
| px | Physical pixel unit of the screen. |
| vp | Pixel unit specific to the screen density. Pixels in this unit are converted into physical pixels of the screen based on the screen pixel density. This unit is used for values whose unit is not specified.|
| fp | Font pixel, which is similar to vp and varies according to the system font size. |
| lpx | Logical pixel unit of the window. It is the ratio of the actual screen width to the logical width (configured by **designWidth**. For example, if **designWidth** is set to **720** (default value), then 1lpx is equal to 2px for a screen with an actual width of 1440 physical pixels.|
| lpx | Logical pixel unit of the window. It is the ratio of the actual screen width to the logical width (configured by **designWidth**). For example, if **designWidth** is set to **720** (default value), then 1lpx is equal to 2px for a screen with an actual width of 1440 physical pixels. |
| want | [Want](../apis/js-apis-application-Want.md) | - | Information about the target application. For details, see the **want** format. |
| want | [Want](../apis/js-apis-app-ability-want.md) | - | Information about the target application. For details, see the **want** format. |
```json
{
```json
{
"data":{
"mainAbility":"xxx.xxx.xxx"
},
...
...
@@ -124,9 +124,9 @@ You can also implement redirection to the target application using a **want**, w
}
}
}
```
```
In API version 8, the [featureAbility.getWant](../apis/js-apis-featureAbility.md) API in the **onCreate** method of the **app.js** or **app.ets** file must be called for the **want** parameter to receive related parameters.
In API version 8, the [featureAbility.getWant](../apis/js-apis-ability-featureAbility.md) API in the **onCreate** method of the **app.js** or **app.ets** file must be called for the **want** parameter to receive related parameters.
@@ -28,7 +28,7 @@ Functions of the folders are as follows:
>**NOTE**
>
>- Reserved folders \(**i18n** and **resources**\) cannot be renamed.
>- The **i18n** and **resources** folders cannot be renamed.
>- If the same resource name and directory are used under the share directory and the instance \(**default**\) directory, the resource in the instance directory will be used when you reference the directory.
>- The **share** directory does not support **i18n**.
>- You should create the optional folders \(shown in the directory structure\) as needed after you create the project in DevEco Studio.
