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

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

介绍

本示例通过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));
            });
相关推荐
jingling5551 分钟前
UniApp 实现顶部固定导航栏 Tab 及滚动变色效果
前端·javascript·前端框架·uni-app
kymjs张涛24 分钟前
零一开源|前沿技术周刊 #10
java·前端·面试
Sawtone29 分钟前
[前端] Leader:可以不用但要知道😠一文速查 TypeScript 基础知识点,字典式速查,全文干货!
前端
Wcowin31 分钟前
mkdocs-document-dates
前端·github
用户102207917571136 分钟前
表格拖拽原生实现
前端·javascript
五月君_37 分钟前
见证历史:Vite 首次超越 Webpack!
前端·webpack·node.js
小old弟38 分钟前
前端开发,Promise 从原理到实现,一文通
前端
nickzone38 分钟前
Next.js + Shopify OAuth 第三方应用接入完整指南
前端
xyphf_和派孔明41 分钟前
web前端React和Vue框架与库安全实践
前端·javascript·前端框架
一只小风华~1 小时前
JavaScript:Ajax(异步通信技术)
前端·javascript·ajax·web