HarmonyOS . 沉浸状态栏使用

1,自定义 AppBar 组件

@Component
export struct AppBar {private title: string | Resource = '';private color?: ResourceColor;@StorageProp('topRectHeight')topRectHeight:number=0@BuilderloadBuilder() {}@BuildertailingBuilder() {Shape().width(28)}@BuildertitleBuilder(){Text(this.title).fontSize(20).fontWeight(FontWeight.Bold).fontColor($r('app.color.start_window_background'))}@BuilderParam loading: () => void = this.loadBuilder;@BuilderParam tailing: () => void = this.tailingBuilder;@BuilderParam titleSlot: () => void = this.titleBuilder;build() {Stack(){Row() {this.loading()this.tailing()}.backgroundColor(this.color).width('100%').height(56 ).padding({ left: 8, right: 8, }).justifyContent(FlexAlign.SpaceBetween)this.titleSlot()}.padding({ top: px2vp(this.topRectHeight)})}}

2, 在EntryAbility中进行,窗口全屏处理,并且同时在onWindowStageCreate方法获取状态栏高度

async onWindowStageCreate(windowStage: window.WindowStage): Promise<void> {// Main window is created, set main page for this abilityhilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');windowStage.loadContent('pages/Index', (err, data) => {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. Data: %{public}s', JSON.stringify(data) ?? '');});let windowClass: window.Window=windowStage.getMainWindowSync()//获取应用主窗口//1,设置窗口全屏let isLayoutFullScreen=truewindowClass.setWindowLayoutFullScreen(isLayoutFullScreen).then(()=>{console.info('设置窗口布局为全屏模式')}).catch((err)=>{console.info('设置窗口布局为全屏模式失败。处理步骤导致'+JSON.stringify(err))})//2,获取布局避让遮挡的区域// 以导航条避让为例 ---api 9以上 (TYPE_NAVIGATION_INDICATOR)// let type = window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR// let avoidArea=windowClass.getAvoidArea(type)// let bottomRectHeight=avoidArea.bottomRect.height; // 获取到导航条区域的高度// AppStorage.SetOrCreate('bottomRectHeight', bottomRectHeight)// 以状态栏避让为例let type=window.AvoidAreaType.TYPE_SYSTEMlet  avoidArea=await windowClass.getAvoidArea(type)let bottomRectHeight= avoidArea.topRect.heightAppStorage.SetOrCreate('topRectHeight',bottomRectHeight)//3,注册监听函数,动态获取避让区域数据windowClass.on('avoidAreaChange',(data)=>{if (data.type === window.AvoidAreaType.TYPE_SYSTEM) {let topRectHeight=data.area.topRect.heightAppStorage.SetOrCreate('topRectHeight',topRectHeight)}// else if(data.type == window.AvoidAreaType.TYPE_NAVIGATION_INDICATOR){//   let bottomRectHeight = data.area.bottomRect.height;//   AppStorage.SetOrCreate('bottomRectHeight', bottomRectHeight);// }})}

3,在pages中的使用

import PreferencesUtils from '../dbSQL/PreferencesUtils';
import  {AppBar}  from '../pages/AppBar'
import router from '@ohos.router';@Entry
@Component
struct Index {@State message: string = '';aboutToAppear(){PreferencesUtils.putString('userName','张三')PreferencesUtils.putString('age','18')PreferencesUtils.putString('sex','男')}async getAll(){this.message=JSON.stringify(await PreferencesUtils.getAll())console.log('getAll', this.message)}@Buildertitle() {Text("Preferences的使用").fontSize('18fp').fontWeight(FontWeight.Bold).margin({ left: 12 })}@Buildertailing() {Button() {Image($r('app.media.icon')).width(26).height(26).fillColor(Color.Black)}.width(36).height(36).backgroundColor(Color.Transparent).onClick(() => this.toClick())}toClick() {router.pushUrl({url:'pages/CustomDialogView'})}@Builderloading() {Button() {Image($r('app.media.more')).width(30).height(30)}.width(36).height(36).backgroundColor(Color.Transparent)}build() {Column() {AppBar({color: Color.White,tailing: () => {this.tailing()},loading:()=>{this.loading()},titleSlot: this.title})Text(this.message).fontSize(20).margin({top:30}).fontWeight(FontWeight.Bold)Column({space:20}){Button('getAll').onClick(async ()=>{this.getAll()})Button('put').onClick(async ()=>{//插入数据key相同时,会自动修改替换value值PreferencesUtils.putString('userName','李四')PreferencesUtils.putString('age','24')PreferencesUtils.putString('sex','女')this.getAll()})Button('update').onClick(async ()=>{await PreferencesUtils.update('userName','王二麻子')await PreferencesUtils.update('age','35')await PreferencesUtils.update('sex','男')this.getAll()})Button('delete').onClick(async ()=>{await PreferencesUtils.delete('sex')this.getAll()})Button('clear').onClick(async ()=>{await PreferencesUtils.clear()this.getAll()})}.margin({top:30}).justifyContent(FlexAlign.Center)}.backgroundColor('#fafafa').width('100%')}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/476878.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

文件管理 II(文件的物理结构、存储空间管理)

一、文件的物理结构 文件实际上是一种抽象数据类型&#xff0c;我们要研究它的逻辑结构、物理结构&#xff0c;以及关于它的一系列操作。文件的物理结构就是研究文件的实现&#xff0c;即文件数据在物理存储设备上是如何分布和组织的。同一个问题有两个方面的回答&#xff1a;…

大数据新视界 -- 大数据大厂之 Impala 性能优化:跨数据中心环境下的挑战与对策(上)(27 / 30)

&#x1f496;&#x1f496;&#x1f496;亲爱的朋友们&#xff0c;热烈欢迎你们来到 青云交的博客&#xff01;能与你们在此邂逅&#xff0c;我满心欢喜&#xff0c;深感无比荣幸。在这个瞬息万变的时代&#xff0c;我们每个人都在苦苦追寻一处能让心灵安然栖息的港湾。而 我的…

利用 GitHub 和 Hexo 搭建个人博客【保姆教程】

利用 GitHub 和 Hexo 搭建个人博客 利用 GitHub 和 Hexo 搭建个人博客一、前言二、准备工作&#xff08;一&#xff09;安装 Node.js 和 Git&#xff08;二&#xff09;注册 GitHub 账号 三、安装 Hexo&#xff08;一&#xff09;创建博客目录&#xff08;二&#xff09;安装 H…

ABAP开发-CO的底层表-物料价格分析CKM3

系列文章目录 文章目录 系列文章目录[TOC](文章目录) 前言一、物料分类账与CKM3二、CKM3界面分析三、CKM3的主要功能1、物料价格分析2、成本构成分析3、价格差异分析4、期间状态查看 四、物料分类账与CKM3的关系五、CKM3的底层表及数据支持1、核心数据表2、取数逻辑 总结 前言 …

汽车被追尾了怎么办?

今天开车上班的路上发生了一起4车追尾的交通事故&#xff0c;作为过来人我复盘了下交通追尾的处理过程。简述如下&#xff1a; 发生追尾后打双闪及时放置三角架&#xff0c;提醒后面车这里发生交通事故了 打122交警电话和自行拍下事故现场的远近照片。如果车子损伤严重或事故复…

了解Redis(第一篇)

目录 Redis基础 什么事Redis Redis为什么这么快 除了 Redis&#xff0c;你还知道其他分布式缓存方案吗? 说-下 Redis 和 Memcached 的区别和共同点 为什么要用Redis? 什么是 Redis Module?有什么用? Redis基础 什么事Redis Redis &#xff08;REmote DIctionary S…

javascrip页面交互

元素的三大系列 offset系列 offset初相识 offset系列属性 作用 element.offsetParent 返回作为该元素带有定位的父级元素&#xff0c;如果父级没有定位&#xff0c;则返回body element.offsetTop 返回元素相对于有定位父元素上方的偏移量 element.offsetLeft 返回元素…

K8S + Jenkins 做CICD

前言 这里会做整体CICD的思路和流程的介绍&#xff0c;会给出核心的Jenkins pipeline脚本&#xff0c;最后会演示一下 实验/实操 结果 由于整体内容较多&#xff0c;所以不打算在这里做每一步的详细演示 - 本文仅作自己的实操记录和日后回顾用 要看保姆式教学的可以划走了&…

nvm安装node遇到的若干问题(vscode找不到npm文件、环境变量配置混乱、npm安装包到D盘)

问题一&#xff1a;安装完nvm后需要做哪些环境变量的配置&#xff1f; 1.打开nvm文件夹下的setting文件&#xff0c;设置nvm路径和安装node路径&#xff0c;并添加镜像。 root: D:\software\nvm-node\nvm path: D:\software\nvm-node\nodejs node_mirror: https://npmmirror.c…

shell脚本(五)

声明&#xff01; 学习视频来自B站up主 泷羽sec 有兴趣的师傅可以关注一下&#xff0c;如涉及侵权马上删除文章&#xff0c;笔记只是方便各位师傅的学习和探讨&#xff0c;文章所提到的网站以及内容&#xff0c;只做学习交流&#xff0c;其他均与本人以及泷羽sec团队无关&#…

如何使用ChatGPT整理和收集论文实验数据?

学境思源&#xff0c;一键生成论文初稿&#xff1a; AcademicIdeas - 学境思源AI论文写作 使用ChatGPT整理和收集论文实验数据&#xff0c;需要通过一些具体的方法和提示词。以下几个步骤和技巧&#xff0c;告诉你如何借助ChatGPT更好地完成工作&#xff1a; 1. 数据格式化和…

PDF电子发票信息转excel信息汇总

PDF电子发票信息提取&#xff0c;支持将pdf发票文件夹下的剩所有发票&#xff0c;转为excel格式的信息&#xff0c;对于发票量比较大&#xff0c;不好统计&#xff0c;需要一个一个去统计的情况&#xff0c;可节省2个点以上的时间&#xff0c;一次下载&#xff0c;终身有效。 使…

小鹏汽车智慧材料数据库系统项目总成数据同步

1、定时任务处理 2、提供了接口 小鹏方面提供的推送的数据表结构&#xff1a; 这几个表总数为100多万&#xff0c;经过条件筛选过滤后大概2万多条数据 小鹏的人给的示例图&#xff1a; 界面&#xff1a; SQL: -- 查询车型 select bmm.md_material_id, bmm.material_num, bm…

嵌入式硬件实战基础篇(二)-稳定输出3.3V的太阳能电池-无限充放电

引言&#xff1a;本内容主要用作于学习巩固嵌入式硬件内容知识&#xff0c;用于想提升下述能力&#xff0c;针对学习稳压芯片和电容以及电池之间的运用&#xff0c;对于硬件PCB以及原理图的练习和前面硬件篇的实际运用&#xff1b;太阳能是一种清洁、可再生的能源&#xff0c;广…

【海思Hi3519DV500】双目网络相机套板硬件规划方案

Hi3519DV500双目网络相机套板是针对该芯片设计的一款 IP 编码板 PCBA&#xff0c;硬件接口支持双目sensor 接入&#xff0c;SDIO3.0 接口、USB2.0、USB3.0、UART 接口以及丰富的 IO 扩展应用&#xff0c;可根据各种使用场景设计相应扩展板&#xff0c;丰富外围接口&#xff0c;…

淘宝商品评论爬虫:Java实现指南

在当今的互联网时代&#xff0c;数据的价值日益凸显&#xff0c;尤其是用户生成的内容&#xff0c;如商品评论&#xff0c;对于理解消费者行为和市场趋势具有重要意义。淘宝作为中国最大的电商平台之一&#xff0c;拥有海量的商品评论数据。本文将介绍如何使用Java编写一个简单…

Java项目实战II基于微信小程序的校运会管理系统(开发文档+数据库+源码)

目录 一、前言 二、技术介绍 三、系统实现 四、核心代码 五、源码获取 全栈码农以及毕业设计实战开发&#xff0c;CSDN平台Java领域新星创作者&#xff0c;专注于大学生项目实战开发、讲解和毕业答疑辅导 一、前言 在充满活力与激情的校园生活中&#xff0c;校运会不仅是…

tensorflow案例7--数据增强与测试集, 训练集, 验证集的构建

&#x1f368; 本文为&#x1f517;365天深度学习训练营 中的学习记录博客&#x1f356; 原作者&#xff1a;K同学啊 前言 这次主要是学习数据增强, 训练集 验证集 测试集的构建等等的基本方法, 数据集还是用的上一篇的猫狗识别;基础篇还剩下几个, 后面的难度会逐步提升;欢迎…

SpringBoot多环境+docker集成企业微信会话存档sdk

SpringBoot多环境docker集成企业微信会话存档sdk 文章来自于 https://developer.work.weixin.qq.com/community/article/detail?content_id16529801754907176021 SpringBoot多环境docker集成企业微信会话存档sdk 对于现在基本流行的springboot环境&#xff0c;官方文档真是比…

VSCode快速生成vue组件模版

1&#xff0c;点击设置&#xff0c;找到代码片段 2&#xff0c;搜索vue&#xff0c;打开vue.json 3&#xff0c;添加模版 vue2模板 "vue2": {"prefix": "vue2","body": ["<template>"," <div>$0</di…