【每日学点HarmonyOS Next知识】状态栏字体、生命周期、自定义对话框屏幕中间、透明度、tab居中

news2025/3/16 0:08:37
1、HarmonyOS 单页面如何控制状态栏字体颜色?

状态栏字体颜色可通过设置statusBarContentColor修改,参考文档如下:
https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-window-V5
参考代码:

import window from '@ohos.window';
@Entry
@Component
struct Index {
  @State message: string = 'Hello World';
  build() {
    Row() {
      Column() {
        Text(this.message)
          .align(Alignment.Center)
          .fontSize(50)
          .fontWeight(FontWeight.Bold)
          .fontColor(Color.White)
        ColumnSplit().height(20)
        Button() {
          Text("点我看效果")
        }
        .width(100)
        .height(50)
        .onClick(() => {
          this.message = "我变了"
          window.getLastWindow(getContext(), (err, data) => {
            let win: window.Window;
            if (err.code) {
              console.error("error code :" + JSON.stringify(err.code))
              return;
            }
            try {
              win = data;
              //设置窗口为全屏模式
              win.setWindowLayoutFullScreen(true);
              // 设置状态栏
              win.setWindowSystemBarProperties({
                // 设置状态栏颜色为其他颜色
                statusBarColor: '#ffe30520',
                // 设置状态栏文本颜色为白色
                statusBarContentColor: '#ffffffff'
              })
              console.info('带状态栏沉浸式窗口设置完成')
            }
            catch (expextion) {
              console.error("error cause :" + JSON.stringify(expextion))
            }
          })
        })
        ColumnSplit().height(20)
      }
      .width('100%')
    }
    .height('100%')
    .backgroundColor(Color.Green)
  }
}
2、HarmonyOS 生命周期回调触发?

当程序被上滑删除退出时,当前页面的onpagehide和aboutToDisappear哪个先触发。

根据场景来看,只会触发aboutToDisappear回调,生命周期相关特性可参考:
https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/js-framework-lifecycle-V5

在app.js中可以定义如下应用生命周期函数:

属性类型描述触发时机
onCreate() => void应用创建当应用创建时调用。
onShow6+() => void应用处于前台当应用处于前台时触发。
onHide6+() => void应用处于后台当应用处于后台时触发。
onDestroy() => void应用销毁当应用退出时触发。
3、HarmonyOS 自定义的dialog如何显示在屏幕中间?

自定义的时间弹窗或者用户隐私协议弹窗如何显示在屏幕中间
参考demo:

@CustomDialog
struct CustomDialogExample {
  controller?: CustomDialogController
  private selectDate: Date = new Date()

  build() {
    Column() {
      DatePicker({
        start: new Date('2009-1-1'),
        end: new Date('2100-12-31'),
        selected: this.selectDate
      })
    }
  }
}

@Entry
@Component
struct Index {
  @State textValue: string = ''
  @State inputValue: string = 'click me'
  dialogController: CustomDialogController | null = new CustomDialogController({
    builder: CustomDialogExample(),
    openAnimation: {
      duration: 1200,
      curve: Curve.Friction,
      delay: 500,
      playMode: PlayMode.Alternate,
      onFinish: () => {
        console.info('play end')
      }
    },
    autoCancel: true,
    alignment: DialogAlignment.Center,
    gridCount: 4,
    customStyle: true,
    backgroundColor: 0xd9ffffff,
    cornerRadius: 10,
  })

  // 在自定义组件即将析构销毁时将dialogControlle置空
  aboutToDisappear() {
    this.dialogController = null // 将dialogController置空
  }

  build() {
    Column() {
      Button(this.inputValue)
        .onClick(() => {
          if (this.dialogController != null) {
            this.dialogController.open()
          }
        }).backgroundColor(0x317aff)
    }.width('100%').margin({ top: 5 })
  }
}
4、HarmonyOS UI组件提供setAlpha的属性吗?

opacity可以设置透明度,请参考:https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/ts-universal-attributes-opacity-V5

opacity(value: number | Resource)
设置组件的不透明度。
参数:

参数名类型必填说明
valuenumber | Resource元素的不透明度,取值范围为0到1,1表示不透明,0表示完全透明, 达到隐藏组件效果,但是在布局中占位。

默认值:1

说明:

子组件会继承父组件的透明度,并与自身的透明度属性叠加。如:父组件透明度为0.1,子组件设置透明度为0.8,则子组件实际透明度为0.1*0.8=0.08。
示例

该示例主要显示通过opacity设置组件的不透明度。

// xxx.ets
@Entry
@Component
struct OpacityExample {
  build() {
    Column({ space: 5 }) {
      Text('opacity(1)').fontSize(9).width('90%').fontColor(0xCCCCCC)
      Text().width('90%').height(50).opacity(1).backgroundColor(0xAFEEEE)
      Text('opacity(0.7)').fontSize(9).width('90%').fontColor(0xCCCCCC)
      Text().width('90%').height(50).opacity(0.7).backgroundColor(0xAFEEEE)
      Text('opacity(0.4)').fontSize(9).width('90%').fontColor(0xCCCCCC)
      Text().width('90%').height(50).opacity(0.4).backgroundColor(0xAFEEEE)
      Text('opacity(0.1)').fontSize(9).width('90%').fontColor(0xCCCCCC)
      Text().width('90%').height(50).opacity(0.1).backgroundColor(0xAFEEEE)
      Text('opacity(0)').fontSize(9).width('90%').fontColor(0xCCCCCC)
      Text().width('90%').height(50).opacity(0).backgroundColor(0xAFEEEE)
    }
    .width('100%')
    .padding({ top: 5 })
  }
}

在这里插入图片描述

5、HarmonyOS 关于Tabs只能居中的问题?

Tabs是否支持左对齐,右对齐

Tabs组件未提供居左的样式,可以用Flex自定义一个靠左的tabBar组件,在onclick事件中通过修改索引值和Tabs组件的索引联动,实现切换效果

@Entry
@Component
struct Index {
  private tabsController: TabsController = new TabsController()
  @State currentIndex: number = 0;

  @Builder
  TabBarBuilder(title: string, targetIndex: number) {
    Text(title)
      .fontWeight(targetIndex === this.currentIndex ? FontWeight.Bold : FontWeight.Normal)
      .margin({ left: 10, right: 10 })
      .onClick(() => {
        this.tabsController.changeIndex(targetIndex)
      })
  }

  build() {
    Row() {
      Column() {
         
Flex({ direction: FlexDirection.Row }) {
        Flex({ direction: FlexDirection.RowReverse }) {
          this.TabBarBuilder('页签1', 0)
          this.TabBarBuilder('页签2', 1)
          this.TabBarBuilder('页签3', 2)
        }

        Tabs({ barPosition: BarPosition.End, controller: this.tabsController }) {
          TabContent() {
            Text("页签1页面")
          }

          TabContent() {
            Text("页签2页面")
          }

          TabContent() {
            Text("页签3页面")
          }
        }.onChange((index: number) => {
          this.currentIndex = index;
        })
      }
    }
  }
}

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

外贸企业可以申请网络专线吗?

在对外业务不断扩大的情况下,外贸企业对网络的需求愈发迫切。稳定、快速的网络连接不仅是企业开展国际业务的基础,更是提升竞争力的关键。外贸企业是否可以申请网络专线?如何选择适合的外贸网络专线服务?本文将为您详细解答。 网络…

阿里巴巴发布 R1-Omni:首个基于 RLVR 的全模态大语言模型,用于情感识别

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗?订阅我们的简报,深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同,从行业内部的深度分析和实用指南中受益。不要错过这个机会,成为AI领…

QuickAPI 和 DBAPI 谁更香?SQL生成API工具的硬核对比(一)

最近低代码开发火得不行,尤其是能把数据库秒变API的工具,简直是开发者的救星。今天咱就聊聊两款国内玩家:QuickAPI(麦聪软件搞出来的低代码神器)和 DBAPI(开源社区的硬核作品)。这两货都能靠SQL…

Git使用(一)--如何在 Windows 上安装 Git:详细步骤指南

如果你想在 Windows 机器上安装 Git,可以按照以下详细指南进行操作。 第一步:下载 Git 可通过官网下载 适用于 Windows 的 Git 最新版本。 如果下载速度较慢,可以通过下面提供的百度网盘 链接下载安装包, https://git-scm.com/d…

C#-使用VisualStudio编译C#工程

一.创建csproj文件 二.创建源cs文件 三.生成解决方案 四.运行解决方案 五.VisualStudio功能列表 <1.代码格式化: CtrlKD完成代码整体格式化 <2.窗口布局 窗口->重置窗口布局 <3.引用查找&关联 <4.包管理 <5.日志输出级别 工具->选项->项目解决方案…

Qt常见面试题合集

零、基本概念 什么是信号槽? 信号槽类似于软件设计模式中的观察者模式&#xff0c;&#xff08;观察者模式是一种对象行为模式。它定义对象间的一种一对多的依赖关系&#xff0c;当一个对象的状态发生改变时&#xff0c;所有依赖于它的对象都得到通知并被自动更新。&#xf…

vscode编译器的一些使用问题

目录 解决pip不可用问题 检查VSCode的终端配置 解决pip不可用问题 eg&#xff1a; C:\Users\student>pip pip 不是内部或外部命令&#xff0c;也不是可运行的程序或批处理文件。 先找到系统环境变量 高级->环境变量 系统属性->Path 变量名随意&#xff0c;自己后续知道…

Docker 》》Docker Compose 》》network 网络 compose

docker 默认的网络 三种模式 # 列出所有当前主机上或Swarm集群上的网络 docker network ls#查看网络详情 docker network inspect network名称# 清除未使用的docker网络 docker network prune -f# 创建网络 ocker network create -d bridge 网络名称 docker network create –s…

【SpringMVC】深入解析使用 Postman 和浏览器模拟将单个与多个参数传递到后端的原理和后端接收参数的过程

SpringMVC—请求(Request) 访问不同的路径&#xff0c;就是发送不同的请求&#xff1b;在发送请求时&#xff0c;可能会带一些参数&#xff0c;所以学习Spring的请求&#xff0c;主要是学习如何传递参数到后端以及后端如何接收&#xff1b; 我们主要是使用 浏览器 和 Postman …

VSTO(C#)Excel开发10:启动和卸载顺序 事件处理 监视变化

初级代码游戏的专栏介绍与文章目录-CSDN博客 我的github&#xff1a;codetoys&#xff0c;所有代码都将会位于ctfc库中。已经放入库中我会指出在库中的位置。 这些代码大部分以Linux为目标但部分代码是纯C的&#xff0c;可以在任何平台上使用。 源码指引&#xff1a;github源…

vue 仿deepseek前端开发一个对话界面

后端&#xff1a;调用deepseek的api&#xff0c;所以返回数据格式和deepseek相同 {"model": "DeepSeek-R1-Distill-Qwen-1.5B", "choices": [{"index": 0, "delta": {"role": "assistant", "cont…

UE5以插件的形式加载第三方库

之前在UE中加载第三方库的形式是以静态或者动态链接的形式加载但是不太容易复用。就想着能不能以插件的形式加载第三方库&#xff0c;这样直接把插件打包发行就可以复用了&#xff0c;之前也找过相应的教程但是很难找到比较简单易懂的教程&#xff0c;要么是比较复杂&#xff0…

Vue3全局化配置(ConfigProvider)

效果如下图&#xff1a; 在线预览 APIs ConfigProvider 参数说明类型默认值theme主题对象Theme{}abstractboolean是否不存在 DOM 包裹元素truetagstringConfigProvider 被渲染成的元素&#xff0c;abstract 为 true 时有效‘div’ Theme Type 名称说明类型默认值common?全…

Centos7系统基于docker下载ollama部署Deepseek-r1(GPU版不踩坑)

目录 一、Docker下载安装 二、Ollama安装 三、部署Deepseek-R1 一、Docker下载安装 1、更新源 sudo yum update -y 2、下载依赖包 yum install -y yum-utils device-mapper-persistent-data lvm2 3、添加docker远程仓库地址 yum-config-manager --add-repo http://down…

【工具】C#游戏防沉迷小工具

背景介绍 嘿&#xff0c;各位小伙伴&#xff01;今天想跟大家唠唠我为啥要搞这么个防沉迷小工具。 咱都清楚&#xff0c;现在这游戏啊&#xff0c;玩起来那叫一个带劲&#xff0c;但时间一长&#xff0c;不仅眼睛累&#xff0c;心也跟着累。有些游戏&#xff0c;规则定得挺有意…

深圳南柯电子|净水器EMC测试整改:水质安全与电磁兼容性的双赢

在当今注重健康生活的时代&#xff0c;净水器作为家庭用水安全的第一道防线&#xff0c;其性能与安全性备受关注。其中&#xff0c;电磁兼容性&#xff08;EMC&#xff09;测试是净水器产品上市前不可或缺的一环&#xff0c;它直接关系到产品在复杂电磁环境中的稳定运行及不对其…

SpeechCraf论文学习

Abstract 核心问题 挑战 语音风格包含细微的多样化信息&#xff08;如情感、语调、节奏&#xff09;&#xff0c;传统基于标签/模板的标注方法难以充分捕捉&#xff0c;制约了语音-语言多模态模型的性能。 数据瓶颈&#xff1a; 大规模数据收集与高质量标注之间存在矛盾&…

Work【2】:PGP-SAM —— 无需额外提示的自动化 SAM!

文章目录 前言AbstractIntroductionMethodsContextual Feature ModulationProgressive Prototype RefinementPrototype-based Prompt Generator ExperimentDatasetsImplementation DetailsResults and AnalysisAblation Study 总结 前言 和大家分享一下我们发表在 ISBI 2025 上…

数据安全之策:备份文件的重要性与自动化实践

在信息化高速发展的今天&#xff0c;数据已成为企业运营和个人生活中不可或缺的重要资源。无论是企业的财务报表、客户资料&#xff0c;还是个人的家庭照片、学习笔记&#xff0c;数据的丢失或损坏都可能带来无法挽回的损失。因此&#xff0c;备份文件的重要性日益凸显&#xf…

uniapp+Vue3 组件之间的传值方法

一、父子传值&#xff08;props / $emit 、ref / $refs&#xff09; 1、props / $emit 父组件通过 props 向子组件传递数据&#xff0c;子组件通过 $emit 触发事件向父组件传递数据。 父组件&#xff1a; // 父组件中<template><view class"container">…