1# WindowExtensionAbility(仅对系统应用开放)
2
3
4[WindowExtensionAbility](../reference/apis-arkui/js-apis-application-windowExtensionAbility-sys.md)是一种ExtensionAbility组件,用于提供界面组合扩展能力,仅允许系统应用进行跨应用的界面拉起和嵌入。
5
6
7WindowExtensionAbility必须和[UIExtensionComponent](../reference/apis-arkui/arkui-ts/ts-container-ui-extension-component-sys.md)一起配合使用,并根据需求处理被拉起应用的业务。WindowExtensionAbility支持以连接形式运行,系统应用必须添加UIExtensionComponent组件启动WindowExtensionAbility服务。
8
9每个ExtensionAbility都有自己的Context,WindowExtensionAbility通过
10[WindowExtensionContext](../reference/apis-arkui/js-apis-inner-application-windowExtensionContext-sys.md)提供相关能力。本文描述中称被启动的WindowExtensionAbility为提供方,称启动WindowExtensionAbility的UIExtensionComponent组件为使用方。
11
12> **说明:**
13>
14> 本文档涉及系统接口的使用,请使用full-SDK进行开发。<!--Del-->具体使用可见[full-SDK替换指南](../faqs/full-sdk-switch-guide.md)。<!--DelEnd-->
15
16
17## 设置一个嵌入式UIAbility
18
19WindowExtensionAbility提供了onConnect()、onDisconnect()和onWindowReady()生命周期回调,根据需要重写对应的回调方法。
20
21- **onWindowReady**:当该Ability的应用窗口创建成功时触发该回调。
22
23- **onConnect**:当窗口扩展组件UIExtensionComponent连接该Ability时回调。
24
25- **onDisconnect**:当窗口扩展组件UIExtensionComponent断开与该Ability的连接时回调。
26
27
28**开发步骤**
29
30开发者在实现一个嵌入式应用时,需要在DevEco Studio工程中手动新建一个WindowExtensionAbility,具体步骤如下。
31
321. 在工程Module对应的ets目录下,右键选择“New &gt; Directory”,新建一个目录并命名为WindowExtAbility。
33
342. 在WindowExtAbility目录,右键选择“New &gt; ts File”,新建一个.ts文件并命名为WindowExtAbility.ts35
363. 打开WindowExtAbility.ts文件,导入WindowExtensionAbility的依赖包,自定义类继承WindowExtensionAbility并实现onWindowReady()、onConnect()和onDisconnect()生命周期回调。
37
38   ```ts
39    import { WindowExtensionAbility, window } from '@kit.ArkUI';
40    import { Want } from '@kit.AbilityKit';
41    import {BusinessError} from '@kit.BasicServiceKit';
42
43    export default class WindowExtAbility extends WindowExtensionAbility {
44        onWindowReady(window: window.Window) {
45            window.setUIContent('WindowExtAbility/pages/index1',(err:BusinessError) => {
46              let pro = window.getWindowProperties();
47              console.log('WindowExtension pro: ${JSON.stringify(pro)}');
48              window.showWindow();
49            });
50        }
51
52        onConnect(want: Want) {
53            console.info('JSWindowExtension onConnect ' + want.abilityName);
54        }
55
56        onDisconnect(want: Want) {
57            console.info('JSWindowExtension onDisconnect ' + want.abilityName);
58        }
59    }
60   ```
61
624. 在工程Module对应的[module.json5配置文件](../quick-start/module-configuration-file.md)中注册WindowExtensionAbility,type标签需要设置为“window”,srcEntry标签表示当前ExtensionAbility组件所对应的代码路径。
63
64   ```json
65   {
66     "module": {
67       "extensionAbilities": [
68            {
69                "name": "WindowExtAbility",
70                "srcEntry": "./ets/WindowExtAbility/WindowExtAbility.ts",
71                "icon": "$media:icon",
72                "description": "WindowExtension",
73                "type": "window",
74                "exported": true,
75            }
76        ],
77     }
78   }
79   ```
80
81
82## 拉起一个嵌入式UIAbility
83
84系统应用可以通过UIExtensionComponent容器加载创建好的WindowExtensionAbility。
85
86**开发步骤**
87
881. 开发者在连接一个嵌入式应用时,需要在DevEco Studio工程中相应的pages界面中加入UIExtensionComponent控件。
89
902. 在UIExtensionComponent控件中写入正确的bundleName和abilityName。
91
923. 设置好宽高。示例代码如下:
93
94```ts
95@Entry
96@Component
97struct Index {
98  @State message: string = 'Hello World'
99
100  build() {
101    Row() {
102      Column() {
103        UIExtensionComponent({
104          abilityName: "WindowExtAbility",
105          bundleName: "com.example.WindowExtAbility"})
106          .width(500)
107          .height(500)
108      }
109      .width('100%')
110    }
111    .height('100%')
112    .backgroundColor(0x64BB5c)
113  }
114}
115```
116
117## 相关实例
118
119针对WindowExtensionAbility开发,有以下相关实例可供参考:
120
121- [窗口扩展应用(ArkTS)(API9)(Full SDK)](https://gitee.com/openharmony/applications_app_samples/tree/master/code/SystemFeature/WindowManagement/WindowExtAbility)
122