鸿蒙OS元服务开发:【(Stage模型)设置悬浮窗】

 一、设置悬浮窗说明

悬浮窗可以在已有的任务基础上,创建一个始终在前台显示的窗口。即使创建悬浮窗的任务退至后台,悬浮窗仍然可以在前台显示。通常悬浮窗位于所有应用窗口之上;开发者可以创建悬浮窗,并对悬浮窗进行属性设置等操作。

二、开发步骤

前提条件:创建WindowType.TYPE_FLOAT即悬浮窗类型的窗口,需要申请ohos.permission.SYSTEM_FLOAT_WINDOW权限。

1.创建悬浮窗。

通过window.createWindow接口创建悬浮窗类型的窗口。

2.对悬浮窗进行属性设置等操作。

悬浮窗窗口创建成功后,可以改变其大小、位置等,还可以根据应用需要设置悬浮窗背景色、亮度等属性。

3.加载显示悬浮窗的具体内容。

通过setUIContent和showWindow接口加载显示悬浮窗的具体内容。

4.销毁悬浮窗。

当不再需要悬浮窗时,可根据具体实现逻辑,使用destroyWindow接口销毁悬浮窗。 

import UIAbility from '@ohos.app.ability.UIAbility';
import window from '@ohos.window';

export default class EntryAbility extends UIAbility {
    onWindowStageCreate(windowStage) {
        // 1.创建悬浮窗。
        let windowClass = null;
        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;
            }
            console.info('Succeeded in creating the floatWindow. Data: ' + JSON.stringify(data));
            windowClass = data;
            // 2.悬浮窗窗口创建成功后,设置悬浮窗的位置、大小及相关属性等。
            windowClass.moveWindowTo(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.resize(500, 500, (err) => {
                if (err.code) {
                    console.error('Failed to change the window size. Cause:' + JSON.stringify(err));
                    return;
                }
                console.info('Succeeded in changing the window size.');
            });
            // 3.为悬浮窗加载对应的目标页面。
            windowClass.setUIContent("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.');
                // 3.显示悬浮窗。
                windowClass.showWindow((err) => {
                    if (err.code) {
                        console.error('Failed to show the window. Cause: ' + JSON.stringify(err));
                        return;
                    }
                    console.info('Succeeded in showing the window.');
                });
            });
            // 4.销毁悬浮窗。当不再需要悬浮窗时,可根据具体实现逻辑,使用destroy对其进行销毁。
            windowClass.destroyWindow((err) => {
                if (err.code) {
                    console.error('Failed to destroy the window. Cause: ' + JSON.stringify(err));
                    return;
                }
                console.info('Succeeded in destroying the window.');
            });
        });
    }
};

鸿蒙Next核心技术分享

1、鸿蒙基础知识←《鸿蒙NEXT星河版开发学习文档》

2、鸿蒙ArkUI←《鸿蒙NEXT星河版开发学习文档》

3、鸿蒙进阶技术←《鸿蒙NEXT星河版开发学习文档》

 4、鸿蒙就业高级技能←《鸿蒙NEXT星河版开发学习文档》 

 5、鸿蒙多媒体技术←《鸿蒙NEXT星河版开发学习文档》 

6、鸿蒙南向驱动开发←《鸿蒙NEXT星河版开发学习文档》  

7、鸿蒙南向内核设备开发←《鸿蒙NEXT星河版开发学习文档》  

 8、鸿蒙系统裁剪与移植←《鸿蒙NEXT星河版开发学习文档》  

最近更新

  1. 设计模式-策略模式

    2024-04-03 06:42:09       0 阅读
  2. 舵机的使用

    2024-04-03 06:42:09       0 阅读
  3. 给c++小白的教程7:保留小数输出

    2024-04-03 06:42:09       0 阅读
  4. Android startForegroundService与startForeground

    2024-04-03 06:42:09       0 阅读

热门阅读

  1. 【Vue】创建vue3项目

    2024-04-03 06:42:09       7 阅读
  2. Python可视化概率统计和聚类学习分析生物指纹

    2024-04-03 06:42:09       4 阅读
  3. LeetCode //C - 1146. Snapshot Array

    2024-04-03 06:42:09       7 阅读
  4. 利用pandas进行数据行转列和列转行

    2024-04-03 06:42:09       4 阅读
  5. Vue组件基础详细介绍

    2024-04-03 06:42:09       6 阅读
  6. 【观察者模式】

    2024-04-03 06:42:09       4 阅读
  7. 时空序列预测模型—PredRNN(Pytorch)

    2024-04-03 06:42:09       5 阅读