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

    文章

    3268

    浏览量

    48937
  • 鸿蒙
    +关注

    关注

    57

    文章

    2372

    浏览量

    42911
  • 鸿蒙OS
    +关注

    关注

    0

    文章

    189

    浏览量

    4465
收藏 人收藏

    评论

    相关推荐

    Stage 模型深入解读

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

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

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

    鸿蒙OS开发案例:【Stage模型卡片】

    本示例展示了Stage模型卡片提供方的创建与使用。
    的头像 发表于 04-09 17:13 1011次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>OS</b><b class='flag-5'>开发</b>案例:【<b class='flag-5'>Stage</b><b class='flag-5'>模型</b>卡片】

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

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

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

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

    鸿蒙服务万能卡片开发-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模型下使用。 二、导入模块 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 ExtensionAbility from
    发表于 12-20 16:12

    Stage模型深入解读

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

    鸿蒙OS服务开发:【(Stage模型设置应用主窗口】

    Stage模型下,应用主窗口由UIAbility创建并维护生命周期。在UIAbility的onWindowStageCreate回调中,通过WindowStage获取应用主窗口,即可对其进行属性设置等操作。还可以在应用配置文件
    的头像 发表于 04-03 18:28 1242次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>OS</b><b class='flag-5'>元</b><b class='flag-5'>服务</b><b class='flag-5'>开发</b>:【(<b class='flag-5'>Stage</b><b class='flag-5'>模型</b>)<b class='flag-5'>设置</b>应用主窗口】

    鸿蒙实战开发:【实现应用悬浮

    如果你要做的是系统级别的悬浮,就需要判断是否具备悬浮权限。然而这又不是一个标准的动态权限,你需要兼容各种奇葩机型的悬浮
    的头像 发表于 04-03 22:18 498次阅读
    <b class='flag-5'>鸿蒙</b>实战<b class='flag-5'>开发</b>:【实现应用<b class='flag-5'>悬浮</b><b class='flag-5'>窗</b>】

    鸿蒙开发Ability Kit程序框架服务:FA模型切换Stage模型概述

    本文介绍如何将一个FA模型开发的声明式范式应用切换到Stage模型
    的头像 发表于 06-26 14:40 351次阅读
    <b class='flag-5'>鸿蒙</b><b class='flag-5'>开发</b>Ability Kit程序框架<b class='flag-5'>服务</b>:FA<b class='flag-5'>模型</b>切换<b class='flag-5'>Stage</b><b class='flag-5'>模型</b>概述