华为鸿蒙应用--欢迎页SplashPage+倒计时跳过(自适应手机和平板)-ArkTs

鸿蒙ArkTS 开发欢迎页SplashPage+倒计时跳过,可自适应平板和手机

一、SplashPage.ts
import { BreakpointSystem, BreakPointType, Logger, PageConstants, StyleConstants } from '@ohos/common';
import router from '@ohos.router';@Entry
@Component
struct SplashPage {@StorageProp('currentBreakpoint') currentBreakpoint: string = 'sm';private breakpointSystem = new BreakpointSystem();private intervalId: number = 0;@State  countdownTime: number = PageConstants.DELAY_TIME;private splash: Resource[] = [$r('app.media.img_splash1'), $r('app.media.img_splash2'), $r('app.media.img_splash3')];// 获取min到max的随机正整数getRandom(min, max) {return Math.floor(Math.random() * (max - min + 1) + min)}build() {Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center }) {Button(this.countdownTime + "秒 跳过", { type: ButtonType.Capsule, stateEffect: true }).alignSelf(ItemAlign.End).margin({ top: $r('app.float.vp_thirty_two'), right: $r('app.float.vp_sixteen') }).onClick(() => {this.routerMain();})Column() {Image(this.splash[this.getRandom(0, 2)])  // 每次进入随机展示一张欢迎图片.width(new BreakPointType({sm: $r('app.float.splash_image_size'),md: $r('app.float.splash_image_size'),lg: $r('app.float.splash_image_size_lg')  // 手机和平板使用不同的图片宽度}).getValue(this.currentBreakpoint)).aspectRatio(PageConstants.IMAGE_ASPECT_RATIO).objectFit(ImageFit.Contain)}.justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Center).flexGrow(StyleConstants.FLEX_GROW).margin({ top: new BreakPointType({sm: $r('app.float.vp_hundred'),md: $r('app.float.vp_hundred'),lg: $r('app.float.vp_fifty')   // 手机和平板不同的margin}).getValue(this.currentBreakpoint) })Text($r('app.string.splash_desc')).fontColor($r('app.color.color_797979')).fontSize($r('app.float.small_font_size')).margin({ top: $r('app.float.vp_one'), bottom: $r('app.float.vp_one') })Text($r('app.string.splash_filings')).fontColor($r('app.color.color_797979')).fontSize($r('app.float.small_font_size')).margin({ top: $r('app.float.vp_one'), bottom: $r('app.float.empty_image_size') })}.height(StyleConstants.FULL_HEIGHT).width(StyleConstants.FULL_WIDTH).backgroundColor($r('app.color.page_background'))}// 倒计时countdown = () => {this.countdownTime -= 1;if (this.countdownTime == 0) {clearInterval(this.intervalId)this.routerMain();}}// 跳转首页routerMain = () => {router.replaceUrl({ url: PageConstants.MAIN_PAGE_URL }).catch((err: Error) => {Logger.error(JSON.stringify(err));})}aboutToAppear() {this.breakpointSystem.register();this.intervalId = setInterval(this.countdown, 1000);}aboutToDisappear() {this.breakpointSystem.unregister();clearInterval(this.intervalId);}
}

工具:BreakpointSystem, BreakPointType, Logger, PageConstants, StyleConstants等工具见:华为鸿蒙应用--底部导航栏Tabs(自适应手机和平板)-CSDN博客

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

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

相关文章

2023/12/17 初始化

普通变量(int,float,double变量)初始化: int a0; float b(0); double c0; 数组初始化: int arr[10]{0}; 指针初始化: 空指针 int *pnullptr; 被一个同类型的变量的地址初始化(赋值) int…

饥荒Mod 开发(十四):制作屏幕弹窗

饥荒Mod 开发(十三):木牌传送 在上一个文章里面制作了一个传送选择页面,是一个全屏的窗口,那饥荒中如何制作一个全屏的窗口,下面介绍一下如何从零开始制作一个全屏窗口 制作屏幕窗口 饥荒中的全屏窗口都有一个基类 “Screen”,我…

结构型设计模式(一):门面模式 组合模式

门面模式 Facade 1、什么是门面模式 门面模式(Facade Pattern)是一种结构型设计模式,旨在为系统提供一个统一的接口,以便于访问子系统中的一群接口。它通过定义一个高层接口,简化了客户端与子系统之间的交互&#xf…

优质全套SpringMVC教程

三、SpringMVC 在SSM整合中,MyBatis担任的角色是持久层框架,它能帮我们访问数据库,操作数据库 Spring能利用它的两大核心IOC、AOP整合框架 1、SpringMVC简介 1.1、什么是MVC MVC是一种软件架构的思想(不是设计模式-思想就是我们…

【具身智能评估3】具身视觉语言规划(EVLP)度量标准汇总

参考论文:Core Challenges in Embodied Vision-Language Planning 论文作者:Jonathan Francis, Nariaki Kitamura, Felix Labelle, Xiaopeng Lu, Ingrid Navarro, Jean Oh 论文原文:https://arxiv.org/abs/2106.13948 论文出处:Jo…

netty-daxin-4(httpwebsocket)

文章目录 学习链接http服务端NettyHttpServerHelloWorldServerHandler 客户端ApiPost websocket初步了解为什么需要 WebSocket简介 浏览器的WebSocket客户端客户端的简单示例客户端的 APIWebSocket 构造函数webSocket.readyStatewebSocket.onopenwebSocket.onclosewebSocket.ο…

MATLAB - MPC - QP Solvers

系列文章目录 前言 模型预测控制器 QP 求解器将线性 MPC 优化问题转换为一般形式的 QP 问题 受到线性不等式约束 其中 x 是解向量。H 是黑森矩阵。当预测模型和调整权重在运行时不发生变化时,该矩阵保持不变。A 是线性约束系数矩阵。当预测模型在运行时不发生变化时…

Eclipse 自动生成注解,如果是IDEA可以参考编译器自带模版进行修改

IDEA添加自动注解 左上角选择 File -> Settings -> Editor -> File and Code Templates&#xff1b; 1、添加class文件自动注解&#xff1a; ​/*** <b>Function: </b> todo* program: ${NAME}* Package: ${PACKAGE_NAME}* author: Jerry* date: ${YEA…

介绍strncpy函数

strncpy函数需要引用#include <string.h>头文件 函数原型&#xff1a; char *_Dest 是字符串的去向 char *_Source是字符串的来源 size_t_Count是复制字符串的大小 #include <stdio.h> #include <string.h> int main() { char arr[128] { \0 }; …

【JAVA-Day69】抛出异常的精髓:深度解析 throw、throws 关键字,优雅处理异常问题

抛出异常的精髓&#xff1a;深度解析 throw、throws 关键字&#xff0c;优雅处理异常问题 &#x1f680; 抛出异常的精髓&#xff1a;深度解析 throw、throws 关键字&#xff0c;优雅处理异常问题 &#x1f680;一、什么是抛出异常 &#x1f60a;二、如何抛出异常 &#x1f914…

MetaAI语音翻译大模型Seamless登场,主打AI无缝同声传译

论文题目&#xff1a; Seamless: Multilingual Expressive and Streaming Speech Translation 论文链接&#xff1a; https://ai.meta.com/research/publications/seamless-multilingual-expressive-and-streaming-speech-translation/ 代码链接&#xff1a; GitHub - facebook…

DSP捕获输入简单笔记

之前使用stm32的大概原理是&#xff1a; 输入引脚输入一个脉冲&#xff0c;捕获1开始极性捕获&#xff0c;捕获的是从启动捕获功能开始计数&#xff0c;捕获的是当前的计数值&#xff1b; 例如一个脉冲&#xff0c;捕获1捕获上升沿&#xff0c;捕获2捕获下降沿&#xff1b;而两…

reactive数据不响应

我们知道&#xff0c;reactive函数用于创建对象等复杂数据的响应式代理对象&#xff0c;当该对象的属性发生变化时&#xff0c;会自动触发视图更新。 但在Vue 3中&#xff0c;当我们使用reactive创建的对象或数组进行赋值时&#xff0c;尽管能够完成正常的赋值操作&#xff0c…

TrustZone之调试、跟踪和分析

接下来,我们将查看系统中的调试和跟踪组件,如下图所示: 现代Arm系统包括支持调试和性能分析的广泛功能。在TrustZone中,我们必须确保这些功能不能被用来危害系统的安全性。 关于调试功能,考虑开发新的SoC。不同的开发人员被信任调试系统的不同部分。芯片公司的工程…

SearchWP WordPress高级网站内容搜索插件(包含所有专业扩展)

点击阅读SearchWP WordPress高级网站内容搜索插件(包含所有专业扩展)原文 SearchWP WordPress高级网站内容搜索插件是一个非常强大的工具&#xff0c;可以显着增强您网站的搜索功能。通过向网站访问者提供高度相关和精确的搜索结果&#xff0c;它可以有效地简化他们的搜索过程…

C语言使用posix正则表达式库

在C语言中&#xff0c;你可以使用 POSIX 正则表达式库&#xff08;regex.h&#xff09;来进行正则表达式的模式匹配。POSIX 正则表达式库提供了一组函数来编译、执行和释放正则表达式。 下面是使用 POSIX 正则表达式库的基本步骤&#xff1a; 包含头文件 <regex.h>&…

项目管理软件助力科研项目管理

作为一名研究人员&#xff0c;你可能会觉得你的成功取决于你的研究有多创新和你工作有多努力。实际上&#xff0c;创新和勤奋很重要&#xff0c;但聪明地工作也很重要。如果你是那种在早上打开电子邮件并开始自上而下的工作的人&#xff0c;你可能很快就会发现你的电子邮件多得…

论文降重宝同义词替换功能的优势与特点 PaperBERT

大家好&#xff0c;今天来聊聊论文降重宝同义词替换功能的优势与特点&#xff0c;希望能给大家提供一点参考。 以下是针对论文重复率高的情况&#xff0c;提供一些修改建议和技巧&#xff0c;可以借助此类工具&#xff1a; 标题&#xff1a;论文降重宝同义词替换功能的优势与特…

C# WPF上位机开发(函数运行时间分析)

【 声明&#xff1a;版权所有&#xff0c;欢迎转载&#xff0c;请勿用于商业用途。 联系信箱&#xff1a;feixiaoxing 163.com】 上位机除了基本功能和稳定性之外&#xff0c;还有一个要注意的就是运行效率的问题。如果我们想提高软件的运行效率&#xff0c;单位时间做更多的工…

1.新入手的32位单片机资源和资料总览

前言&#xff1a; 学了将近1年的linux驱动和uboot&#xff0c;感觉反馈不足&#xff0c;主要是一直在学各种框架&#xff0c;而且也遇到了门槛&#xff0c;比如驱动部分&#xff0c;还不能随心所欲地编程&#xff0c;原因是有些外设的原理还不够深刻、有些复杂的底层驱动的代码…