Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
OpenHarmony
Docs
提交
8b975ed1
D
Docs
项目概览
OpenHarmony
/
Docs
大约 1 年 前同步成功
通知
159
Star
292
Fork
28
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
D
Docs
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
提交
Issue看板
未验证
提交
8b975ed1
编写于
12月 08, 2022
作者:
葛
葛亚芳
提交者:
Gitee
12月 08, 2022
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
update zh-cn/application-dev/windowmanager/application-window-stage.md.
Signed-off-by:
N
葛亚芳
<
geyafang@huawei.com
>
上级
2e7a2cff
变更
1
显示空白变更内容
内联
并排
Showing
1 changed file
with
40 addition
and
49 deletion
+40
-49
zh-cn/application-dev/windowmanager/application-window-stage.md
...application-dev/windowmanager/application-window-stage.md
+40
-49
未找到文件。
zh-cn/application-dev/windowmanager/application-window-stage.md
浏览文件 @
8b975ed1
...
...
@@ -34,25 +34,24 @@
| WindowStage | getMainWindow(callback: AsyncCallback
<
Window
>
): void | 获取
`WindowStage`
实例下的主窗口。
<br/>
此接口仅可在
`Stage`
模型下使用。 |
| WindowStage | loadContent(path: string, callback: AsyncCallback
<
void
>
): void | 为当前
`WindowStage`
的主窗口加载具体页面。
<br/>
此接口仅可在
`Stage`
模型下使用。 |
| WindowStage | createSubWindow(name: string, callback: AsyncCallback
<
Window
>
): void | 创建子窗口。
<br/>
此接口仅可在
`Stage`
模型下使用。 |
| window静态方法 | create(ctx: Context, id: string, type: WindowType, callback: AsyncCallback
<
Window
>
): void | 创建子窗口。
<br/>
-
`ctx`
:为应用上下文信息。
<br/>
-
`type`
:为创建的窗口类型。 |
| Window | loadContent(path: string, callback: AsyncCallback
<
void
>
): void | 为当前窗口加载具体页面。 |
| Window | setBackgroundColor(color: string, callback: AsyncCallback
<
void
>
): void | 设置窗口的背景色。 |
| Window | setBrightness(brightness: number, callback: AsyncCallback
<
void
>
): void | 设置屏幕亮度值。 |
| Window | setTouchable(isTouchable: boolean, callback: AsyncCallback
<
void
>
): void | 设置窗口是否为可触状态。 |
| Window | moveTo(x: number, y: number, callback: AsyncCallback
<
void
>
): void | 移动当前窗口位置。 |
| Window | resetSize(width: number, height: number, callback: AsyncCallback
<
void
>
): void | 改变当前窗口大小。 |
| Window | setFullScreen(isFullScreen: boolean, callback: AsyncCallback
<
void
>
): void | 设置窗口是否全屏显示。 |
| Window | setLayoutFullScreen(isLayoutFullScreen: boolean, callback: AsyncCallback
<
void
>
): void | 设置窗口布局是否为全屏布局。 |
| Window | setSystemBarEnable(names: Array
<
'status'\|'navigation'
>
): Promise
<
void
>
| 设置导航栏、状态栏是否显示。 |
| Window | setSystemBarProperties(systemBarProperties: SystemBarProperties, callback: AsyncCallback
<
void
>
): void | 设置窗口内导航栏、状态栏属性。
<br/>
`systemBarProperties`
:导航栏、状态栏的属性集合。 |
| Window | show(callback: AsyncCallback
\<
void>): void | 显示当前窗口。 |
| window静态方法 | createWindow(config: Configuration, callback: AsyncCallback
<Window>
): void | 创建系统窗口。
<br/>
-
`config`
:创建窗口时的参数。 |
| Window | setUIContent(path: string, callback: AsyncCallback
<
void
>
): void | 为当前窗口加载具体页面。 |
| Window | setWindowBackgroundColor(color: string, callback: AsyncCallback
<
void
>
): void | 设置窗口的背景色。 |
| Window | setWindowBrightness(brightness: number, callback: AsyncCallback
<
void
>
): void | 设置屏幕亮度值。 |
| Window | setWindowTouchable(isTouchable: boolean, callback: AsyncCallback
<
void
>
): void | 设置窗口是否为可触状态。 |
| Window | moveWindowTo(x: number, y: number, callback: AsyncCallback
<
void
>
): void | 移动当前窗口位置。 |
| Window | resize(width: number, height: number, callback: AsyncCallback
<
void
>
): void | 改变当前窗口大小。 |
| Window | setWindowLayoutFullScreen(isLayoutFullScreen: boolean, callback: AsyncCallback
<
void
>
): void | 设置窗口布局是否为全屏布局。 |
| Window | setWindowSystemBarEnable(names: Array
<
'status'\|'navigation'
>
): Promise
<
void
>
| 设置导航栏、状态栏是否显示。 |
| Window | setWindowSystemBarProperties(systemBarProperties: SystemBarProperties, callback: AsyncCallback
<
void
>
): void | 设置窗口内导航栏、状态栏属性。
<br/>
`systemBarProperties`
:导航栏、状态栏的属性集合。 |
| Window | showWindow(callback: AsyncCallback
\<
void>): void | 显示当前窗口。 |
| Window | on(type: 'touchOutside', callback: Callback
<
void
>
): void | 开启本窗口区域外的点击事件的监听。 |
| Window | destroy(callback: AsyncCallback
<
void
>
): void | 销毁当前窗口。 |
| Window | destroy
Window
(callback: AsyncCallback
<
void
>
): void | 销毁当前窗口。 |
## 设置应用主窗口
在
`Stage`
模型下,应用主窗口由
`Ability`
创建并维护生命周期。在
`Ability`
的
`onWindowStageCreate`
回调中,通过
`WindowStage`
获取应用主窗口,即可对其进行属性设置等操作
在
`Stage`
模型下,应用主窗口由
`Ability`
创建并维护生命周期。在
`Ability`
的
`onWindowStageCreate`
回调中,通过
`WindowStage`
获取应用主窗口,即可对其进行属性设置等操作
。
### 开发步骤
...
...
@@ -82,7 +81,7 @@ class MainAbility extends Ability {
console
.
info
(
'
Succeeded in obtaining the main window. Data:
'
+
JSON
.
stringify
(
data
));
// 2.设置主窗口属性。以设置"是否可触"属性为例。
let
isTouchable
=
true
;
windowClass
.
setTouchable
(
isTouchable
,
(
err
)
=>
{
windowClass
.
set
Window
Touchable
(
isTouchable
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to set the window to be touchable. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -117,10 +116,10 @@ class MainAbility extends Ability {
子窗口创建成功后,可以改变其大小、位置等,还可以根据应用需要设置窗口背景色、亮度等属性。
3.
加载显示子窗口的具体内容。
通过
`
loadContent`
和
`sh
ow`
接口加载显示子窗口的具体内容。
通过
`
setUIContent`
和
`showWind
ow`
接口加载显示子窗口的具体内容。
4.
销毁子窗口。
当不再需要某些子窗口时,可根据具体实现逻辑,使用
`destroy`
接口销毁子窗口。
当不再需要某些子窗口时,可根据具体实现逻辑,使用
`destroy
Window
`
接口销毁子窗口。
```
ts
import
Ability
from
'
@ohos.application.Ability
'
...
...
@@ -138,14 +137,14 @@ class MainAbility extends Ability {
sub_windowClass
=
data
;
console
.
info
(
'
Succeeded in creating the subwindow. Data:
'
+
JSON
.
stringify
(
data
));
// 2.子窗口创建成功后,设置子窗口的位置、大小及相关属性等。
sub_windowClass
.
moveTo
(
300
,
300
,
(
err
)
=>
{
sub_windowClass
.
move
Window
To
(
300
,
300
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to move the window. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
}
console
.
info
(
'
Succeeded in moving the window.
'
);
});
sub_windowClass
.
res
etSize
(
500
,
10
00
,
(
err
)
=>
{
sub_windowClass
.
res
ize
(
500
,
5
00
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to change the window size. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -153,14 +152,14 @@ class MainAbility extends Ability {
console
.
info
(
'
Succeeded in changing the window size.
'
);
});
// 3.为子窗口加载对应的目标页面。
sub_windowClass
.
load
Content
(
"
pages/page3
"
,
(
err
)
=>
{
sub_windowClass
.
setUI
Content
(
"
pages/page3
"
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to load the content. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
}
console
.
info
(
'
Succeeded in loading the content.
'
);
// 3.显示子窗口。
sub_windowClass
.
show
((
err
)
=>
{
sub_windowClass
.
show
Window
((
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to show the window. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -173,7 +172,7 @@ class MainAbility extends Ability {
destroySubWindow
()
{
// 4.销毁子窗口。当不再需要子窗口时,可根据具体实现逻辑,使用destroy对其进行销毁。
sub_windowClass
.
destroy
((
err
)
=>
{
sub_windowClass
.
destroy
Window
((
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to destroy the window. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -207,9 +206,8 @@ class MainAbility extends Ability {
通过
`getMainWindow`
接口获取应用主窗口。
2.
实现沉浸式效果。有以下三种方式:
-
方式一:调用
`setFullScreen`
接口,设置应用主窗口为全屏显示,此时导航栏、状态栏将隐藏,从而达到沉浸式效果。
-
方式二:调用
`setSystemBarEnable`
接口,设置导航栏、状态栏不显示,从而达到沉浸式效果。
-
方式三:调用
`setLayoutFullScreen`
接口,设置应用主窗口为全屏布局;然后调用
`setSystemProperties`
接口,设置导航栏、状态栏的透明度、背景/文字颜色以及高亮图标等属性,使之保持与主窗口显示协调一致,从而达到沉浸式效果。
-
方式一:调用
`setWindowSystemBarEnable`
接口,设置导航栏、状态栏不显示,从而达到沉浸式效果。
-
方式二:调用
`setWindowLayoutFullScreen`
接口,设置应用主窗口为全屏布局;然后调用
`setWindowSystemBarProperties`
接口,设置导航栏、状态栏的透明度、背景/文字颜色以及高亮图标等属性,使之保持与主窗口显示协调一致,从而达到沉浸式效果。
3.
加载显示沉浸式窗口的具体内容。
通过
`loadContent`
接口加载沉浸式窗口的具体内容。
...
...
@@ -229,27 +227,18 @@ class MainAbility extends Ability {
windowClass
=
data
;
console
.
info
(
'
Succeeded in obtaining the main window. Data:
'
+
JSON
.
stringify
(
data
));
// 2.实现沉浸式效果。方式一:设置应用主窗口为全屏显示。
let
isFullScreen
=
true
;
windowClass
.
setFullScreen
(
isFullScreen
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to enable the full-screen mode. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
}
console
.
info
(
'
Succeeded in enabling the full-screen mode.
'
);
});
// 2.实现沉浸式效果。方式二:设置导航栏、状态栏不显示。
// 2.实现沉浸式效果。方式一:设置导航栏、状态栏不显示。
let
names
=
[];
windowClass
.
setSystemBarEnable
(
names
,
(
err
)
=>
{
windowClass
.
set
Window
SystemBarEnable
(
names
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to set the system bar to be visible. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
}
console
.
info
(
'
Succeeded in setting the system bar to be visible.
'
);
});
// 2.实现沉浸式效果。方式
三
:设置窗口为全屏布局,配合设置导航栏、状态栏的透明度、背景/文字颜色及高亮图标等属性,与主窗口显示保持协调一致。
// 2.实现沉浸式效果。方式
二
:设置窗口为全屏布局,配合设置导航栏、状态栏的透明度、背景/文字颜色及高亮图标等属性,与主窗口显示保持协调一致。
let
isLayoutFullScreen
=
true
;
windowClass
.
setLayoutFullScreen
(
isLayoutFullScreen
,
(
err
)
=>
{
windowClass
.
set
Window
LayoutFullScreen
(
isLayoutFullScreen
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to set the window layout to full-screen mode. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -263,7 +252,7 @@ class MainAbility extends Ability {
statusBarContentColor
:
'
#ffffff
'
,
navigationBarContentColor
:
'
#ffffff
'
};
windowClass
.
setSystemBarProperties
(
sysBarProps
,
(
err
)
=>
{
windowClass
.
set
Window
SystemBarProperties
(
sysBarProps
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to set the system bar properties. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -292,9 +281,10 @@ class MainAbility extends Ability {
### 开发步骤
1.
申请权限。
创建
`WindowType.TYPE_FLOAT`
即悬浮窗类型的窗口,需要在
`module.json5`
文件的
`requestPermissions`
对象中配置
`ohos.permission.SYSTEM_FLOAT_WINDOW`
权限。更多配置信息详见
[
Stage模型应用程序包结构
](
../quick-start/application-package-structure-stag
e.md
)
。
创建
`WindowType.TYPE_FLOAT`
即悬浮窗类型的窗口,需要在
`module.json5`
文件的
`requestPermissions`
对象中配置
`ohos.permission.SYSTEM_FLOAT_WINDOW`
权限。更多配置信息详见
[
module.json5配置文件
](
../quick-start/module-configuration-fil
e.md
)
。
> **说明:**
>
> 虽然悬浮窗具备始终在前台显示的能力,但如果创建悬浮窗的应用任务被系统回收,仍然会导致悬浮窗从界面移除。如果想要保持悬浮窗口始终在前台显示,请申请[长时任务](../task-management/background-task-overview.md)。
```
json
...
...
@@ -316,17 +306,17 @@ class MainAbility extends Ability {
```
2.
创建悬浮窗。
通过
`window.create`
接口创建悬浮窗类型的窗口。
通过
`window.create
Window
`
接口创建悬浮窗类型的窗口。
3.
对悬浮窗进行属性设置等操作。
悬浮窗窗口创建成功后,可以改变其大小、位置等,还可以根据应用需要设置悬浮窗背景色、亮度等属性。
4.
加载显示悬浮窗的具体内容。
通过
`
loadContent`
和
`sh
ow`
接口加载显示悬浮窗的具体内容。
通过
`
setUIContent`
和
`showWind
ow`
接口加载显示悬浮窗的具体内容。
5.
销毁悬浮窗。
当不再需要悬浮窗时,可根据具体实现逻辑,使用
`destroy`
接口销毁悬浮窗。
当不再需要悬浮窗时,可根据具体实现逻辑,使用
`destroy
Window
`
接口销毁悬浮窗。
```
ts
import
Ability
from
'
@ohos.application.Ability
'
...
...
@@ -337,7 +327,8 @@ class MainAbility extends Ability {
onWindowStageCreate
(
windowStage
)
{
// 2. 创建悬浮窗。
let
windowClass
=
null
;
window
.
create
(
this
.
context
,
"
floatWindow
"
,
window
.
WindowType
.
TYPE_FLOAT
,
(
err
,
data
)
=>
{
let
config
=
{
name
:
"
floatWindow
"
,
windowType
:
window
.
WindowType
.
TYPE_FLOAT
,
ctx
:
this
.
context
};
window
.
createWindow
(
config
,
(
err
,
data
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to create the floatWindow. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -345,14 +336,14 @@ class MainAbility extends Ability {
console
.
info
(
'
Succeeded in creating the floatWindow. Data:
'
+
JSON
.
stringify
(
data
));
windowClass
=
data
;
// 3.悬浮窗窗口创建成功后,设置悬浮窗的位置、大小及相关属性等。
windowClass
.
moveTo
(
300
,
300
,
(
err
)
=>
{
windowClass
.
move
Window
To
(
300
,
300
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to move the window. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
}
console
.
info
(
'
Succeeded in moving the window.
'
);
});
windowClass
.
res
etSize
(
500
,
10
00
,
(
err
)
=>
{
windowClass
.
res
ize
(
500
,
5
00
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to change the window size. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -360,14 +351,14 @@ class MainAbility extends Ability {
console
.
info
(
'
Succeeded in changing the window size.
'
);
});
// 4.为悬浮窗加载对应的目标页面。
windowClass
.
load
Content
(
"
pages/page4
"
,
(
err
)
=>
{
windowClass
.
setUI
Content
(
"
pages/page4
"
,
(
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to load the content. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
}
console
.
info
(
'
Succeeded in loading the content.
'
);
// 4.显示悬浮窗。
windowClass
.
show
((
err
)
=>
{
windowClass
.
show
Window
((
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to show the window. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
@@ -376,7 +367,7 @@ class MainAbility extends Ability {
});
});
//5.销毁悬浮窗。当不再需要悬浮窗时,可根据具体实现逻辑,使用destroy对其进行销毁。
windowClass
.
destroy
((
err
)
=>
{
windowClass
.
destroy
Window
((
err
)
=>
{
if
(
err
.
code
)
{
console
.
error
(
'
Failed to destroy the window. Cause:
'
+
JSON
.
stringify
(
err
));
return
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录