ArtTS系统能力-窗口管理的学习（3.2）

上篇回顾： ArtTS系统能力-通知的学习（3.1）

本篇内容： ArtTS系统能力-窗口管理的学习（3.2）

一、 知识储备

1. 基本概念

• 窗口渲染式能力：指对状态栏、导航栏等系统窗口进行控制，减少状态栏、导航栏等系统界面的突兀感，从而使用户获得更好的体验。
  渲染式能力只在应用主窗口作为全屏窗口时生效，通常情况下，应用子窗口（弹窗、悬浮窗口等辅助窗口）无法使用沉浸式能力
• 悬浮窗：全局悬浮窗口是一种特殊的应用窗口，具备在应用主窗口和对应Ability退到后台后，仍然可以在前台显示的能力。
  悬浮窗口可以用于应用退到后台后，使用小窗继续播放视频、或者为特定的应用创建悬浮球等快速入口。应用在创建悬浮窗口前，需要申请对应的权限（ohos.permission.SYSTEM_FLOAT_WINDOW）。

2.使用场景

• 设置应用主窗口属性及目标页面
  在Stage模型下，应用主窗口由UIAbility创建并维护其生命周期。在UIAbility的onWindowStageCreate回调中，获取WindowStage，即可对其进行属性设置，也可以在应用配置文件中设置应用主窗口的属性。

createMainWindow(windowStage: window.WindowStage) {//第一步：获取应用主窗口let windowClazz = null;windowStage.getMainWindow((err, data) => {if (err) {console.error('该设备不支持')return;}windowClazz = data;//第二步：设置主窗口属性let isTouchable = true;windowClazz.setWindowTouchable(isTouchable, (err) => {if (err) {console.error('不支持触摸')return;}})//第三步：为主窗口加载对应的目标页面windowStage.loadContent("pages/StudyWidget", err => {if (err.code) {console.error('响应失败')return;}})})}

• 设置应用子窗口属性及目标页面

createSubWindow(windowStage: window.WindowStage) {windowStage.createSubWindow('mySubWindow', (err, data) => { //1. 获取创建子窗口if (err) {console.error('不支持子窗口')return;}windowClazz = data;})windowClazz.moveWindowTo(300, 300, err => { //2. 设置子窗口属性if (err) {console.error('不支持子窗口移动')return;}})windowClazz.resize(500, 500, err => { //3. 修改子窗口属性if (err.code) {console.error('不支持子窗口改变尺寸')}})windowClazz.setUIContent('pages/StudyLayout', err => { //4. 加载对应的目标页面if (err.code) {console.error('子窗口加载页面失败')return;}windowClazz.showWindow(err => {if (err.code) {console.error('子窗口页面显示失败')return;}})})}destroySubWindow() {windowClazz.destroyWindow(err => {if (err.code) {console.error('子窗口销毁失败')return;}})}

• 体验窗口沉浸式能力

setupWindow(windowStage: window.WindowStage) {let windowClazz = null;windowStage.getMainWindow((err, data) => {if (err.code) {console.error(`${JSON.stringify(err)}`)return;}windowClazz = data;let names = [];windowClazz.setWindowSystemBarEnable(names, err => {if (err.code) {console.error(`${JSON.stringify(err)}`)return;}})})windowStage.loadContent('pages/StudyWidget', err => {if (err.code) {console.error(`${JSON.stringify(err)}`)return;}})}

• 设置悬浮窗口

addFloatWindow(windowStage: window.WindowStage) {let windowClazz = null;let config = {name: 'floatWindow', windowType: window.WindowType.TYPE_FLOAT, ctx: this.context};window.createWindow(config, (err, data) => {if (err.code) {console.error(`不支持：${JSON.stringify(err)}`)return;}windowClazz = data;windowClazz.moveWindowTo(300,300,err=>{if (err.code) {console.error(JSON.stringify(err))return;}})windowClazz.resize(500,500,err =>{if (err.code) {console.error(JSON.stringify(err))return;}})windowClazz.setUIContent("pages/StudyWidget",err=>{if (err.code) {console.error(JSON.stringify(err))return;}windowClazz.showWindow(err=>{if (err.code) {console.error(JSON.stringify(err));return;}})})})}

二、 效果一览

三、源码剖析

import UIAbility from '@ohos.app.ability.UIAbility';
import hilog from '@ohos.hilog';
import window from '@ohos.window';
import thermal from '@ohos.thermal';let windowClazz = null;export default class EntryAbility extends UIAbility {onCreate(want, launchParam) {hilog.info(0x0000, 'testTag', '%{public}s', '我被创建了');globalThis.initTitle = '我是测试标题'}onDestroy() {hilog.info(0x0000, 'testTag', '%{public}s', '我被销毁了');}/*****************在这里定义LocalStorage*****************/args: Record<string, Object> = {'height': 111, 'age': 10, 'name': '小明', sex: '未知'};storage: LocalStorage = new LocalStorage(this.args)onWindowStageCreate(windowStage: window.WindowStage) {hilog.info(0x0000, 'testTag', '%{public}s', '系统接管创建');// windowStage.loadContent('pages/event/EventStudy', this.storage) //把localStorage实例传递过去windowStage.loadContent('pages/manager/NotificationIndex', this.storage) //把localStorage实例传递过去// this.createMainWindow(windowStage)// this.createSubWindow(windowStage)// this.setupWindow(windowStage)this.addFloatWindow(windowStage)}/*****************在这里定义LocalStorage*****************/onWindowStageDestroy() {// Main window is destroyed, release UI related resourceshilog.info(0x0000, 'testTag', '%{public}s', '系统接管销毁');this.destroySubWindow();}onForeground() {// Ability has brought to foregroundhilog.info(0x0000, 'testTag', '%{public}s', '我要可见了');}onBackground() {// Ability has back to backgroundhilog.info(0x0000, 'testTag', '%{public}s', '我不可见了');}createSubWindow(windowStage: window.WindowStage) {windowStage.createSubWindow('mySubWindow', (err, data) => { //1. 获取创建子窗口if (err) {console.error('不支持子窗口')return;}windowClazz = data;})windowClazz.moveWindowTo(300, 300, err => { //2. 设置子窗口属性if (err) {console.error('不支持子窗口移动')return;}})windowClazz.resize(500, 500, err => { //3. 修改子窗口属性if (err.code) {console.error('不支持子窗口改变尺寸')}})windowClazz.setUIContent('pages/StudyLayout', err => { //4. 加载对应的目标页面if (err.code) {console.error('子窗口加载页面失败')return;}windowClazz.showWindow(err => {if (err.code) {console.error('子窗口页面显示失败')return;}})})}destroySubWindow() {windowClazz.destroyWindow(err => {if (err.code) {console.error('子窗口销毁失败')return;}})}addFloatWindow(windowStage: window.WindowStage) {let windowClazz = null;let config = {name: 'floatWindow', windowType: window.WindowType.TYPE_FLOAT, ctx: this.context};window.createWindow(config, (err, data) => {if (err.code) {console.error(`不支持：${JSON.stringify(err)}`)return;}windowClazz = data;windowClazz.moveWindowTo(300,300,err=>{if (err.code) {console.error(JSON.stringify(err))return;}})windowClazz.resize(500,500,err =>{if (err.code) {console.error(JSON.stringify(err))return;}})windowClazz.setUIContent("pages/StudyWidget",err=>{if (err.code) {console.error(JSON.stringify(err))return;}windowClazz.showWindow(err=>{if (err.code) {console.error(JSON.stringify(err));return;}})})})}setupWindow(windowStage: window.WindowStage) {let windowClazz = null;windowStage.getMainWindow((err, data) => {if (err.code) {console.error(`${JSON.stringify(err)}`)return;}windowClazz = data;let names = [];windowClazz.setWindowSystemBarEnable(names, err => {if (err.code) {console.error(`${JSON.stringify(err)}`)return;}})})windowStage.loadContent('pages/StudyWidget', err => {if (err.code) {console.error(`${JSON.stringify(err)}`)return;}})}createMainWindow(windowStage: window.WindowStage) {//第一步：获取应用主窗口let windowClazz = null;windowStage.getMainWindow((err, data) => {if (err) {console.error('该设备不支持')return;}windowClazz = data;//第二步：设置主窗口属性let isTouchable = true;windowClazz.setWindowTouchable(isTouchable, (err) => {if (err) {console.error('不支持触摸')return;}})//第三步：为主窗口加载对应的目标页面windowStage.loadContent("pages/StudyWidget", err => {if (err.code) {console.error('响应失败')return;}})})}
}