实现页面全屏功能鸿蒙示例代码

本文原创发布在华为开发者社区

介绍

本示例通过windowClass.setWindowLayoutFullScreen设置页面是否全屏。

实现页面全屏功能源码链接

效果预览

使用说明

  1. 点击"全屏"按钮,设置页面为全屏
  2. 点击"关闭全屏按钮",关闭页面全屏

实现思路

  1. 设置窗口全屏
typescript 复制代码
let windowClass = AppStorage.get("mainWindow") as window.Window
          // 1. 设置窗口全屏
          windowClass.setWindowLayoutFullScreen(true)
            .then(() => {
              hilog.info(0x0000,'test','Succeeded in setting the window layout to full-screen mode.');
            })
            .catch((err: BusinessError) => {
              hilog.error(0x0000,'test','Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(err));
            });
  1. 关闭窗口全屏
typescript 复制代码
 let windowClass = AppStorage.get("mainWindow") as window.Window
          // 1. 关闭窗口全屏
          windowClass.setWindowLayoutFullScreen(false)
            .then(() => {
              hilog.info(0x0000,'test','Succeeded in setting the window layout to full-screen mode.');
            })
            .catch((err: BusinessError) => {
              hilog.error(0x0000,'test','Failed to set the window layout to full-screen mode. Cause:' + JSON.stringify(err));
            });
相关推荐
blues_C7 分钟前
十一、【核心功能篇】测试用例管理:设计用例新增&编辑界面
前端·vue.js·测试用例·element plus·测试平台
前端snow15 分钟前
用cursor写一个微信小程序-购物网站实操
前端·javascript·后端
书语时24 分钟前
ES6 深克隆与浅克隆详解:原理、实现与应用场景
前端·javascript·es6
Magnum Lehar42 分钟前
vulkan游戏引擎的核心交换链swapchain实现
java·前端·游戏引擎
henujolly1 小时前
yarn、pnpm、npm
前端
江城开朗的豌豆2 小时前
JavaScript篇:构造函数 vs Class:谁才是对象创建的王者?
前端·javascript·面试
江城开朗的豌豆2 小时前
JavaScript篇:数组找不同:如何快速找出两个数组间的'单身狗'元素?
前端·javascript·面试
不吃鱼的羊2 小时前
ISOLAR软件生成报错处理(七)
java·前端·javascript
TE-茶叶蛋3 小时前
React-props
前端·javascript·react.js
安分小尧3 小时前
[特殊字符] 超强 Web React版 PDF 阅读器!支持分页、缩放、旋转、全屏、懒加载、缩略图!
前端·javascript·react.js