window-guidelines.md 3.9 KB
Newer Older
C
chyyy0213 已提交
1 2
# 窗口开发指导

3
## 场景介绍
C
chyyy0213 已提交
4 5 6 7
窗口的接口层在应用进程运行,负责对页面布局的加载,和提供应用程序接口。
通过调用窗口接口可以实现窗口创建与销毁,窗口的位置、大小布局,以及进入沉浸式等。

## 接口说明
8
窗口开放的能力如下:Window类,具体的API详见[接口文档](../reference/apis/js-apis-window.md)
C
chyyy0213 已提交
9 10 11 12 13 14

**表1** 窗口主要接口API

| 接口名                                                       | 描述                                           |
| :----------------------------------------------------------- | :--------------------------------------------- |
| create(id: string, type: WindowType, callback: AsyncCallback\<Window>): void | 创建子窗口。                                   |
15
| moveTo(x: number, y: number): Promise\<void>                 | 移动窗口位置,x值为正表示右移,y为正表示下移。 |
C
chyyy0213 已提交
16 17 18 19 20 21 22 23
| resetSize(width: number, height: number): Promise\<void>     | 改变当前窗口大小。                             |
| hide(): Promise\<void>                                       | 隐藏当前窗口。                                 |
| destroy(): Promise\<void>                                    | 销毁当前窗口。                                 |

## 开发步骤

### 创建主窗口

24
在当前模型下,应用启动时会自动创建主窗口,由应用管理窗口的生命周期,隐藏及销毁由应用管理。
25
### 创建子窗口
C
chyyy0213 已提交
26 27
当前可以通过`create`接口创建子窗口。具体示例代码如下:

28
```js
C
chyyy0213 已提交
29 30 31 32 33 34 35 36 37 38 39 40 41 42 43
 import window from '@ohos.window';
 var windowClass = null;
 let promise = window.create("subWindow", window.WindowType.TYPE_APP);
 promise.then((data)=> {
 	windowClass = data;
    console.info('SubWindow created. Data: ' + JSON.stringify(data))
 }).catch((err)=>{
    console.error('Failed to create the subWindow. Cause: ' + JSON.stringify(err));
 });
```

### 获取窗口对象

- 应用内可以通过`getTopWindow`来获取当前应用内最后显示的窗口。具体示例代码如下:

44
```js
C
chyyy0213 已提交
45 46 47 48 49 50 51 52 53 54 55 56
 var windowClass = null;
 let promise = window.getTopWindow();
 promise.then((data)=> {
 	windowClass = data;
    console.info('Succeeded in obtaining the top window. Data: ' + JSON.stringify(data))
 }).catch((err)=>{
    console.error('Failed to obtain the top window. Cause: ' + JSON.stringify(err));
 })
```

- 应用内也可以通过`Find`来获取已经创建的子窗口。具体示例代码如下:

57
```js
C
chyyy0213 已提交
58 59 60 61 62 63 64 65 66 67 68 69 70 71
 var windowClass = null;
 let promise = window.find("subWindow");
 promise.then((data)=> {
 	windowClass = data;
    console.info('window found. Data: ' + JSON.stringify(data))
 }).catch((err)=>{
    console.error('Failed to find the Window. Cause: ' + JSON.stringify(err));
 });
```

### 窗口的隐藏和销毁

在已经获取到窗口对象的前提下,可以调用`hide``destroy`来隐藏和销毁已经创建的窗口对象。具体示例代码如下:

72
```js
C
chyyy0213 已提交
73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89
 let promise = windowClass.hide();
 promise.then((data)=> {
    console.info('window hidden. Data: ' + JSON.stringify(data))
    windowClass.destroy((err, data) => {
        if (err.code) {
            console.error('Failed to destroy the window. Cause:' + JSON.stringify(err));
            return;
        }
    	console.info('Succeeded in destroying the window. Data: ' + JSON.stringify(data))
	})
 }).catch((err)=>{
    console.error('Failed to hide the window. Cause: ' + JSON.stringify(err));
 })
```

### 设置沉浸式窗口

90
在已经获取到应用窗口对象的前提下,调用`setFullScreen`来设置窗口进入全屏沉浸式。
C
chyyy0213 已提交
91 92 93

示例代码如下:

94
```js
C
chyyy0213 已提交
95
import window from '@ohos.window';
96 97 98 99 100 101
try {
  const win = await window.getTopWindow()
  await win.setFullScreen(true)
} catch (err) {
  console.log(`setFullScreen fail, code = ${err.code}`)
}
C
chyyy0213 已提交
102 103
```

104 105 106
## 相关实例
针对窗口开发,有以下相关实例可供参考:
- [`Window`:窗口(eTS)(API9)](https://gitee.com/openharmony/app_samples/tree/master/Graphics/Window)
C
chyyy0213 已提交
107