0
  • 聊天消息
  • 系统消息
  • 评论与回复
登录后你可以
  • 下载海量资料
  • 学习在线课程
  • 观看技术视频
  • 写文章/发帖/加入社区
创作中心

完善资料让更多小伙伴认识你,还能领取20积分哦,立即完善>

3天内不再提示

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

jf_46214456 来源:jf_46214456 作者:jf_46214456 2024-04-03 15:32 次阅读

一、设置悬浮窗说明

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

二、开发步骤

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

1.创建悬浮窗。

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

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

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

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

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

4.销毁悬浮窗。

当不再需要悬浮窗时,可根据具体实现逻辑,使用destroyWindow接口销毁悬浮窗。
更多鸿蒙开发技术已更新↓

搜狗高速浏览器截图20240326151547.png

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.');
});
});
}
};


审核编辑 黄宇

声明:本文内容及配图由入驻作者撰写或者入驻合作网站授权转载。文章观点仅代表作者本人,不代表电子发烧友网立场。文章及其配图仅供工程师学习之用,如有内容侵权或者其他违规问题,请联系本站处理。 举报投诉
  • 模型
    +关注

    关注

    1

    文章

    2707

    浏览量

    47707
  • 鸿蒙
    +关注

    关注

    55

    文章

    1641

    浏览量

    42123
  • 鸿蒙OS
    +关注

    关注

    0

    文章

    155

    浏览量

    4280
收藏 人收藏

    评论

    相关推荐

    鸿蒙Stage模型--概述

    Stage模型:HarmonyOS 3.1 Develper Preview版本开始新增的模型,是目前主推且会长期演进的模型。在该模型中,由
    的头像 发表于 01-29 13:59 675次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>Stage</b><b class='flag-5'>模型</b>--概述

    Stage 模型深入解读

    跨设备的迁移和协同机制。本文为大家详细介绍 Stage 模型。 一、Stage 模型概念 应用开发模型
    的头像 发表于 02-18 09:28 435次阅读
    <b class='flag-5'>Stage</b> <b class='flag-5'>模型</b>深入解读

    鸿蒙OS开发实例:【手撸服务卡片】

    服务卡片指导文档位于“**开发/应用模型/Stage模型开发指导/
    的头像 发表于 03-28 22:11 735次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>OS</b><b class='flag-5'>开发</b>实例:【手撸<b class='flag-5'>服务</b>卡片】

    鸿蒙应用/服务开发-窗口(Stage模型设置悬浮

    一、设置悬浮说明 悬浮可以在已有的任务基础上,创建一个始终在前台显示的窗口。即使创建悬浮
    发表于 02-04 14:05

    鸿蒙应用/服务开发-窗口(Stage模型设置应用主窗口

    一、 设置应用主窗口****说明 在Stage模型下,应用主窗口由UIAbility创建并维护生命周期。在UIAbility的onWindowStageCreate回调中,通过WindowStage
    发表于 02-05 14:45

    Stage模型深入解读

    的迁移和协同机制。本文为大家详细介绍Stage模型。 一、Stage模型概念 应用开发模型是运行
    发表于 03-15 10:32

    鸿蒙服务万能卡片开发-stage模型和fa模型的卡片区别

    一、项目类型 Application: 应用开发 Atomic Service:原子化服务开发 这里选择Empty Ability模板创建项目。 二、Stage
    发表于 05-22 14:20

    鸿蒙原生应用/服务开发-Stage模型能力接口(一)

    从API version 9 开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。本模块接口仅可在Stage模型下使用。二、导入模块 .import Ability from
    发表于 12-08 16:34

    鸿蒙原生应用/服务开发-Stage模型能力接口(二)

    退出原因、迁移结果、窗口类型等。本模块首批接口从API version 9开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。本模块接口仅可在Stage模型下使用。二、导入模块
    发表于 12-11 14:48

    鸿蒙原生应用/服务开发-Stage模型能力接口(四)

    API version 9 开始支持。后续版本的新增接口,采用上角标单独标记接口的起始版本。本模块接口仅可在Stage模型下使用。 二、导入模块 import AbilityStage from
    发表于 12-14 15:39

    鸿蒙原生应用/服务开发-Stage模型能力接口(五)

    Stage模型下使用 二、 导入模块 import common from \'@ohos.app.ability.common\'; 三、系统能力 :以下各项对应的系统能力均为
    发表于 12-15 15:11

    鸿蒙原生应用/服务开发-Stage模型能力接口(六)

    的起始版本。本模块接口仅可在Stage模型下使用。 二、 导入模块 import contextConstant from \'@ohos.app.ability.contextConstant\'; 三
    发表于 12-18 14:40

    鸿蒙原生应用/服务开发-Stage模型能力接口(七)

    接口的起始版本。本模块接口仅可在Stage模型下使用。 二、导入模块 import EnvironmentCallback from
    发表于 12-19 11:03

    鸿蒙原生应用/服务开发-Stage模型能力接口(八)

    独标记接口的起始版本。本模块接口仅可在Stage模型下使用。 二、导入模块 .import ExtensionAbility from
    发表于 12-20 16:12

    Stage模型深入解读

    形态下统一的应用组件生命周期,并支持跨设备的迁移和协同机制。本文为大家详细介绍Stage模型。 一 Stage模型概念 应用开发
    的头像 发表于 03-16 13:35 592次阅读