From 1fc7f271ff4702c345d512e4b9a9065cb384c7fc Mon Sep 17 00:00:00 2001 From: "ester.zhou" Date: Thu, 12 May 2022 18:10:28 +0800 Subject: [PATCH 1/2] update doc Signed-off-by: ester.zhou --- .../reference/arkui-ts/ts-container-panel.md | 45 ++++++++++--------- 1 file changed, 23 insertions(+), 22 deletions(-) diff --git a/en/application-dev/reference/arkui-ts/ts-container-panel.md b/en/application-dev/reference/arkui-ts/ts-container-panel.md index a73447518e4..1d66f2c0636 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-panel.md +++ b/en/application-dev/reference/arkui-ts/ts-container-panel.md @@ -2,6 +2,7 @@ > ![icon-note.gif](public_sys-resources/icon-note.gif) **NOTE** +> > This component is supported since API version 7. Updates will be marked with a superscript to indicate their earliest API version. @@ -22,43 +23,43 @@ This component can contain child components. Panel(value:{show:boolean}) -- Parameter - | Name | Type | Mandatory | Default Value | Description | +- Parameters + | Name | Type | Mandatory | Default Value | Description | | -------- | -------- | -------- | -------- | -------- | - | show | boolean | Yes | - | Whether the panel is shown or hidden. | + | show | boolean | Yes | - | Whether the panel is shown or hidden. | ## Attributes - | Name | Type | Default Value | Description | +| Name | Type | Default Value | Description | | -------- | -------- | -------- | -------- | -| type | PanelType | PanelType.Foldable | Type of the panel. | -| mode | PanelMode | - | Initial status of the panel. | -| dragBar | boolean | true | Whether to enable a drag bar. The value **true** means that the drag bar will be displayed, and **false** means the opposite. | -| fullHeight | Length | - | Panel height in the **PanelMode.Full** mode. | -| halfHeight | Length | - | Panel height in the **PanelMode.Half** mode. The default value is half of the screen height. | -| miniHeight | Length | - | Panel height in the **PanelMode.Mini** mode. | +| type | PanelType | PanelType.Foldable | Type of the panel. | +| mode | PanelMode | - | Initial status of the panel. | +| dragBar | boolean | true | Whether to enable a drag bar. The value **true** means that the drag bar will be displayed, and **false** means the opposite. | +| fullHeight | Length | - | Panel height in the **PanelMode.Full** mode. | +| halfHeight | Length | - | Panel height in the **PanelMode.Half** mode. The default value is half of the screen height. | +| miniHeight | Length | - | Panel height in the **PanelMode.Mini** mode. | - PanelType enums - | Name | Description | + | Name | Description | | -------- | -------- | - | Minibar | A minibar panel displays content in the minibar area or a large (fullscreen-like) area. | - | Foldable | A foldable panel displays permanent content in a large (fullscreen-like), medium-sized (halfscreen-like), or small area. | - | Temporary | A temporary panel displays content in a large (fullscreen-like) or medium-sized (halfscreen-like) area. | + | Minibar | A minibar panel displays content in the minibar area or a large (fullscreen-like) area. | + | Foldable | A foldable panel displays permanent content in a large (fullscreen-like), medium-sized (halfscreen-like), or small area. | + | Temporary | A temporary panel displays content in a large (fullscreen-like) or medium-sized (halfscreen-like) area. | - PanelMode enums - | Name | Description | + | Name | Description | | -------- | -------- | - | Mini | Displays a **minibar** or **foldable** panel in its minimum size. This attribute does not take effect for **temporary** panels. | - | Half | Displays a **foldable** or **temporary** panel in a medium-sized (halfscreen-like) area. This attribute does not take effect for **minibar** panels. | - | Full | Displays a panel in a large (fullscreen-like) area. | + | Mini | Displays a **minibar** or **foldable** panel in its minimum size. This attribute does not take effect for **temporary** panels. | + | Half | Displays a **foldable** or **temporary** panel in a medium-sized (halfscreen-like) area. This attribute does not take effect for **minibar** panels. | + | Full | Displays a panel in a large (fullscreen-like) area. | ## Events - | Name | Description | +| Name | Description | | -------- | -------- | -| onChange(callback: (width: number, height: number, mode: PanelMode) => void) | Triggered when the status of the panel changes. The returned height value is the height of the content area. When the value of **dragbar** is **true**, the height of the panel is the dragbar height plus the height of the content area. | +| onChange(callback: (width: number, height: number, mode: PanelMode) => void) | Triggered when the status of the panel changes. The returned height value is the height of the content area. When the value of **dragbar** is **true**, the height of the panel is the dragbar height plus the height of the content area. | ## Example @@ -88,8 +89,8 @@ struct PanelExample { .type(PanelType.Foldable).mode(PanelMode.Half) .dragBar(true) // The dragbar is enabled by default. .halfHeight(500) // Half of the height by default - .onChange((value: any) => { - console.info(`width:${value.width},height:${value.height},mode:${value.mode}`) + .onChange((width: number, height: number, mode: PanelMode) => { + console.info(`width:${width},height:${height},mode:${mode}`) }) }.width('100%').height('100%').backgroundColor(0xDCDCDC).padding({ top: 5 }) } -- Gitee From a577f3e662331c158e83ce5b3ce1e8edc1ddc4a6 Mon Sep 17 00:00:00 2001 From: "ester.zhou" Date: Mon, 16 May 2022 01:39:14 +0000 Subject: [PATCH 2/2] update en/application-dev/reference/arkui-ts/ts-container-panel.md. Signed-off-by: ester.zhou --- en/application-dev/reference/arkui-ts/ts-container-panel.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/en/application-dev/reference/arkui-ts/ts-container-panel.md b/en/application-dev/reference/arkui-ts/ts-container-panel.md index 1d66f2c0636..4c032b32a8c 100644 --- a/en/application-dev/reference/arkui-ts/ts-container-panel.md +++ b/en/application-dev/reference/arkui-ts/ts-container-panel.md @@ -59,7 +59,7 @@ Panel(value:{show:boolean}) | Name | Description | | -------- | -------- | -| onChange(callback: (width: number, height: number, mode: PanelMode) => void) | Triggered when the status of the panel changes. The returned height value is the height of the content area. When the value of **dragbar** is **true**, the height of the panel is the dragbar height plus the height of the content area. | +| onChange(callback: (width: number, height: number, mode: PanelMode) => void) | Triggered when the status of the panel changes. The returned height value is the height of the content area. When the value of **dragbar** is **true**, the height of the panel is the drag bar height plus the height of the content area. | ## Example @@ -87,8 +87,8 @@ struct PanelExample { } } .type(PanelType.Foldable).mode(PanelMode.Half) - .dragBar(true) // The dragbar is enabled by default. - .halfHeight(500) // Half of the height by default + .dragBar(true) // The drag bar is enabled by default. + .halfHeight(500) // The default value is half of the screen height. .onChange((width: number, height: number, mode: PanelMode) => { console.info(`width:${width},height:${height},mode:${mode}`) }) -- Gitee