基于鸿蒙API10的RTSP播放器(四:沉浸式播放窗口)

前言:

典型应用全屏窗口UI元素包括状态栏、应用界面和底部导航条,其中状态栏和导航条,通常在沉浸式布局下称为避让区;避让区之外的区域称为安全区。

开发应用沉浸式效果主要指通过调整状态栏、应用界面和导航条的显示效果来减少状态栏导航条等系统界面的突兀感,从而使用户获得最佳的UI体验。

我们在前面三节中的播放器,都有顶部状态栏何底部导航栏,为此我们可以通过把应用设置为全屏来实现沉浸式播放的效果。

方法:

  • 窗口全屏布局方案:调整布局系统为全屏布局,界面元素延伸到状态栏和导航条区域实现沉浸式效果。当不隐藏避让区时,可通过接口查询状态栏和导航条区域进行可交互元素避让处理,并设置状态栏或导航条的颜色等属性与界面元素匹配。当隐藏避让区时,通过对应接口设置全屏布局即可。
  • 组件安全区方案:布局系统保持安全区内布局,然后通过接口延伸绘制内容(如背景色,背景图)到状态栏和导航条区域实现沉浸式效果。该方案下,界面元素仅做绘制延伸,无法单独布局到状态栏和导航条区域,针对需要单独布局UI元素到状态栏和导航条区域的场景建议使用窗口全屏布局方案处理。

代码:

TS 复制代码
// 这里是ArkTS代码,写TS是为了代码有颜色效果

import AbilityConstant from '@ohos.app.ability.AbilityConstant';  
import hilog from '@ohos.hilog';  
import UIAbility from '@ohos.app.ability.UIAbility';  
import Want from '@ohos.app.ability.Want';  
import window from '@ohos.window';  
import { BusinessError } from '@kit.BasicServicesKit';  
  
export default class EntryAbility extends UIAbility {  
  onCreate(want: Want, launchParam: AbilityConstant.LaunchParam): void {  
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');  
  }  
  
  onDestroy(): void {  
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onDestroy');  
  }  
  
  onWindowStageCreate(windowStage: window.WindowStage): void {  
    // Main window is created, set main page for this ability  
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');  
  
    windowStage.loadContent('pages/Index', (err) => {  
  
      // 设置全屏  
      let windowClass:window.Window = windowStage.getMainWindowSync();  
      windowClass.setWindowLayoutFullScreen(true)  
        .then(()=>{  
          console.info("plumcarefree Successfully set Full Window")  
        })  
        .catch((err:BusinessError)=>{  
          console.error("plumcarefree Nosuccessfully set Full Window")  
        })  
  
      if (err.code) {  
        hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');  
        return;  
      }  
      hilog.info(0x0000, 'testTag', 'Succeeded in loading the content.');  
    });  
  }  
  
  onWindowStageDestroy(): void {  
    // Main window is destroyed, release UI related resources  
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageDestroy');  
  }  
  
  onForeground(): void {  
    // Ability has brought to foreground  
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onForeground');  
  }  
  
  onBackground(): void {  
    // Ability has back to background  
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onBackground');  
  }  
}
相关推荐
枫叶丹44 小时前
【HarmonyOS之旅】HarmonyOS开发基础知识(三)
华为od·华为·华为云·harmonyos
SoraLuna9 小时前
「Mac畅玩鸿蒙与硬件47」UI互动应用篇24 - 虚拟音乐控制台
开发语言·macos·ui·华为·harmonyos
AORO_BEIDOU13 小时前
单北斗+鸿蒙系统+国产芯片,遨游防爆手机自主可控“三保险”
华为·智能手机·harmonyos
博览鸿蒙14 小时前
鸿蒙操作系统(HarmonyOS)的应用开发入门
华为·harmonyos
Damon小智21 小时前
HarmonyOS NEXT 技术实践-基于基础视觉服务的多目标识别
华为·harmonyos
匹马夕阳1 天前
华为笔记本之糟糕的体验
华为·笔记本电脑
egekm_sefg1 天前
华为、华三交换机纯Web下如何创关键VLANIF、操作STP参数
网络·华为
岳不谢2 天前
华为DHCP高级配置学习笔记
网络·笔记·网络协议·学习·华为
爱笑的眼睛112 天前
uniapp 极速上手鸿蒙开发
华为·uni-app·harmonyos
K.P2 天前
鸿蒙元服务从0到上架【第三篇】(第二招有捷径)
华为·harmonyos·鸿蒙系统