提交 0c71edd2 编写于 作者: E ester.zhou

Update docs (21578)

Signed-off-by: Nester.zhou <ester.zhou@huawei.com>
上级 a4a070f2
......@@ -165,7 +165,7 @@ Not supported
strokeColor: '#0081ff',
fillColor: '#cce5ff',
data: [763, 550, 551, 554, 731, 654, 525, 696, 595, 628, 791, 505, 613, 575, 475, 553, 491, 680, 657, 716],
gradient: true,
gradient: false,
}
],
lineOps: {
......
......@@ -28,9 +28,9 @@ Not supported
| Name| Parameter| Description|
| -------- | -------- | -------- |
| click | - | Triggered when the component is clicked. |
| longpress | - | Triggered when the component is long pressed. |
| swipe<sup>5+</sup> | [SwipeEvent](js-common-events.md) | Triggered when a user quickly swipes on the component. |
| click | - | Triggered when the component is clicked.|
| longpress | - | Triggered when the component is long pressed.|
| swipe<sup>5+</sup> | [SwipeEvent](js-common-events.md) | Triggered when a user quickly swipes on the component.|
## Styles
......@@ -39,8 +39,8 @@ Not supported
| -------- | -------- | -------- | -------- | -------- |
| color | &lt;color&gt; | \#000000 | No| Color of the QR code.|
| background-color | &lt;color&gt; | \#ffffff | No| Background color of the QR code.|
| width | &lt;length&gt; \| &lt;percentage&gt;<sup>5+</sup> | - | No| Component width.<br>If this attribute is not set, the default value **0** is used. |
| height | &lt;length&gt; \| &lt;percentage&gt;<sup>5+</sup> | - | No| Component height.<br>If this attribute is not set, the default value **0** is used. |
| width | &lt;length&gt; \| &lt;percentage&gt;<sup>5+</sup> | - | No| Component width.<br>If this attribute is not set, the default value **0** is used.|
| height | &lt;length&gt; \| &lt;percentage&gt;<sup>5+</sup> | - | No| Component height.<br>If this attribute is not set, the default value **0** is used.|
| padding | &lt;length&gt; | 0 | No| Shorthand attribute to set the padding for all sides.<br>The attribute can have one to four values:<br>- If you set only one value, it specifies the padding for all the four sides.<br>- If you set two values, the first value specifies the top and bottom padding, and the second value specifies the left and right padding.<br>- If you set three values, the first value specifies the top padding, the second value specifies the left and right padding, and the third value specifies the bottom padding.<br>- If you set four values, they respectively specify the padding for top, right, bottom, and left sides (in clockwise order).|
| padding-[left\|top\|right\|bottom] | &lt;length&gt; | 0 | No| Left, top, right, and bottom padding.|
| margin | &lt;length&gt; \| &lt;percentage&gt;<sup>5+</sup> | 0 | No| Shorthand attribute to set the margin for all sides. The attribute can have one to four values:<br>- If you set only one value, it specifies the margin for all the four sides.<br>- If you set two values, the first value specifies the top and bottom margins, and the second value specifies the left and right margins.<br>- If you set three values, the first value specifies the top margin, the second value specifies the left and right margins, and the third value specifies the bottom margin.<br>- If you set four values, they respectively specify the margin for top, right, bottom, and left sides (in clockwise order).|
......@@ -49,7 +49,7 @@ Not supported
| border-color | &lt;color&gt; | black | No| Shorthand attribute to set the color for all borders.|
| border-radius | &lt;length&gt; | - | No| Radius of round-corner borders.|
| display | string | flex | No| How and whether to display the box containing an element. Available values are as follows:<br>- **flex**: flexible layout<br>- **none**: not rendered|
| [left\|top] | &lt;length&gt; \| &lt;percentage&gt;<sup>6+</sup> | - | No| Edge of the element.<br>- **left**: left edge position of the element. This attribute defines the offset between the left edge of the margin area of a positioned element and left edge of its containing block.<br>- **top**: top edge position of the element. This attribute defines the offset between the top edge of a positioned element and that of a block included in the element. |
| [left\|top] | &lt;length&gt; \| &lt;percentage&gt;<sup>6+</sup> | - | No| Edge of the element.<br>- **left**: left edge position of the element. This attribute defines the offset between the left edge of the margin area of a positioned element and left edge of its containing block.<br>- **top**: top edge position of the element. This attribute defines the offset between the top edge of a positioned element and that of a block included in the element.|
> **NOTE**
> - If the values of **width** and **height** are different, the smaller value is used as the length of the QR code. The generated QR code is center displayed.
......@@ -63,10 +63,10 @@ Not supported
```html
<!-- xxx.hml -->
<div class="container">
<qrcode value="{{qr_value}}" class="qrCode" style="color: {{qr_color}};background-color: {{qr_bcol}};"></qrcode>
<input type="button" onclick="changeColor" class="button">Color</input>
<input type="button" onclick="changeBackgroundColor" class="button">BackgroundColor</input>
<input type="button" onclick="changeColor" class="button">Value</input>
<qrcode value="{{qr_value}}" class="qrCode" style="color: {{qr_col}};background-color: {{qr_bcol}};"></qrcode>
<input type="button" onclick="changeColor" class="button">Color</input>
<input type="button" onclick="changeBackgroundColor" class="button">BackgroundColor</input>
<input type="button" onclick="changeValue" class="button">Value</input>
</div>
```
......@@ -93,32 +93,32 @@ Not supported
```javascript
// xxx.js
export default {
data: {
qr_col: '#87ceeb',
qr_bcol: '#f0ffff',
qr_value: 'value'
},
changeColor() {
if (this.qr_col == '#87ceeb') {
this.qr_col = '#fa8072';
} else {
this.qr_col = '#87ceeb';
data: {
qr_col: '#87ceeb',
qr_bcol: '#f0ffff',
qr_value: 'value'
},
changeColor() {
if (this.qr_col == '#87ceeb') {
this.qr_col = '#fa8072';
} else {
this.qr_col = '#87ceeb';
}
},
changeBackgroundColor() {
if (this.qr_bcol == '#f0ffff') {
this.qr_bcol = '#ffffe0';
} else {
this.qr_bcol = '#f0ffff';
}
},
changeValue() {
if (this.qr_value == 'value') {
this.qr_value = 'change';
} else {
this.qr_value = 'value';
}
}
},
changeBackgroundColor() {
if (this.qr_bcol == '#f0ffff') {
this.qr_bcol = '#ffffe0';
} else {
this.qr_bcol = '#f0ffff';
}
},
changeValue() {
if (this.qr_value == 'value') {
this.qr_value = 'change';
} else {
this.qr_value = 'value';
}
}
}
```
......
# Input Method Framework
## Introduction
The input method framework is responsible for establishing a communication channel between the application in which the edit box is located and the input method application, to ensure that the two can jointly provide text input, and also enables system applications to manage the input method application.
The input method framework has four modules:
1. Application
Path: /base/inputmethod/imf/frameworks/native/inputmethod_controller
Function: enables an application to request the use of and interaction with the input method application.
2. Input method application
Path: /base/inputmethod/imf/frameworks/native/inputmethod_ability
Function: provides an input method application implementation framework. Based on the framework, the input method application can be correctly started, and collaborates with the edit box application to complete text input.
3. Input method engine
Path: /base/inputmethod/imf/services
Function: responsible for establishing secure and reliable connections with the input method and providing features such as input method switching and query.
4. Input method JS API implementation
Path: /base/inputmethod/imf/frameworks/js
- JS API implementation provided for input method applications: /base/inputmethod/imf/frameworks/js/napi/inputmethodability
- JS API implementation provided for the self-drawing components: /base/inputmethod/imf/frameworks/js/napi/inputmethodclient.
Function: provides specific implementation for TS-related APIs.
## System Architecture
**Figure 1** Architecture
![Input method framework](./figures/input-method-framework.PNG)
## Directory Structure
```
/base/inputmethod/imf
├── figures # Architecture diagram
├── frameworks
│ └── js/napi # Native APIs of the input method framework
│ └──inputmethod_extention_ability # InputMethodExtentionAbility related APIs for input method applications
│ └──inputmethod_extention_context # InputMethodExtentionContext related APIs for input method applications
│ └──inputmethodability # APIs provided for input method applications
│ └──inputmethodclient # APIs provided by the system applications and self-drawing components
│ └── native
│ └──inputmethod_ability # APIs provided for input method applications
│ └──inputmethod_controller # APIs provided for the application
├── interfaces # APIs provided by the components for external systems
│ └── inner_api # Inner APIs
├── profile # Configuration files of system services and processes contained in the components
├── services # Input method engine
├── test # Tests
│ └── fuzztest # Fuzz test of APIs
│ └── unitest # Unit test of APIs
│ └──cpp_test # CPP unit test of APIs
│ └──napi_test # JS unit test of APIs
```
## How to Use
* [InputMethodExtentionAbility](../application-dev/application-models/inputmethodextentionability.md)
* [@ohos.inputMethod (Input Method Framework)](../application-dev/reference/apis/js-apis-inputmethod.md)
* [@ohos.inputMethodEngine (Input Method Service)](../application-dev/reference/apis/js-apis-inputmethodengine.md)
## Repositories Involved
Input method framework
[inputmethod_imf](https://gitee.com/openharmony/inputmethod_imf)
# Misc Services
## Introduction
The Misc services subsystem provides APIs for setting the system time.
**Figure 1** Subsystem architecture
![](figures/subsystem-architecture.png "subsystem-architecture")
## Directory Structure
```
/base/miscservices
└── time # Time service module
```
## Repositories Involved
**Misc services subsystem**
[time_time_service](https://gitee.com/openharmony/time_time_service)
# ArkUI Subsystem Changelog
## cl.arkui.1 Disabling of Online Images for JS Widgets in \<FormComponent>
Disabled online images for JS widgets in the **\<FormComponent>**.
**Change Impact**
After the change, JS widgets in the **\<FormComponent>** cannot load or display online images. You are advised to save online images to the memory to display them in JS widgets.
## cl.arkui.2 Behavior Change of \<TextInput>, \<TextArea>, and \<Search> Components
Changed the behavior of **\<TextInput>**, **\<TextArea>**, and **\<Search>** components so that their obtaining focus will enable the input method.
You need to adapt your application based on the following information.
**Change Impact**
The **\<TextInput>**, **\<TextArea>**, and **\<Search>** components of API version 10 are affected.
**Key API/Component Changes**
When the **\<TextInput>**, **\<TextArea>**, and **\<Search>** components obtain focus, the input method is displayed.
**Adaptation Guide**
Use **enableKeyboardOnFocus(bool)** to set whether to enable the input method when the component obtains focus. The default value of this parameter is **true**.
## cl.arkui.3 Intercepting of Invalid Component Attribute and Parameter Values
Changed invalid values to default values.
You need to adapt your application based on the following information.
**Change Impact**
All component attributes and parameters with invalid values are affected.
**Key API/Component Changes**
When an attribute value is changed from a normal value to an invalid value:
- Before change: The invalid value setting is skipped.
- After change: The invalid value is intercepted and the default value is used. For attributes that do not have default values, such as **width** and **height**, the original normal value settings are canceled.
**Adaptation Guide**
Check for Invalid values of component attributes and parameters, such as **"100abc"**, and change them to normal values.
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册