UIAbility的使用

UIAbility概述


UIAbility是一种包含用户界面的应用组件,主要用于和用户进行交互。UIAbility也是系统调度的单元,为应用提供一系列的窗口,应用在这些窗口里绘制用户交互界面。
每一个UIAbility实例,都对应于一个最近任务列表中的任务。
一个应用可以有一个UIAbility,也可以有多个UIAbility。一个UIAbility可以对应于多个页面,建议将一个独立的功能模块放到一个UIAbility中,以多页面的形式呈现。


UIAbility内页面的跳转和数据传递


UIAbility的数据传递:UIAbility内页面的跳转和数据传递
                                  UIAbility之间的页面跳转和数据传递
在一个应用包含一个UiAbility的场景下,可以通过新建多个页面来实现和丰富应用的内容---UIAbility内页面的新建以及UIAbility内页面的跳转和数据传递。

一个实例:
打开devEcoStudio,选择EmptyAbility工程模板,创建一个工程,命名为MApp。

  • 在src/main/ets/entryability/路径下,初始化工程时会生成一个UIAbility文件EntryAbility.ts。可以在EntryAbility.ts文件中根据业务需要实现UIAbility的生命周期回调内容。
  • 在src/main/ets/pages路径下,会生成一个Index页面。这也是基于UIAbility实现的应用的入口页面。可以在Index页面中根据业务需要实现入口页面的功能。
  • 在src/main/ets/pages路径下,右键new->page,新建一个second页面,用于实现页面间的跳转的数据传递。第二个页面命名为sec.ets  

页面间的导航可以通过页面路由router模块来实现。页面路由模块根据页面url找到目标页面,从而实现跳转。通过页面路由模块,可以使用不同的url访问不同的页面,包括跳转到UIAbility内的指定页面、用UIAbility内的某个页面替换当前页面、返回上一页面或指定的页面等。

页面跳转和参数接收

在使用页面路由之前,需要先导入router模块,如下代码所示

import router from '@ohos.router'

页面跳转的几种方式:

  • router.pushUrl()方法 --- api9及以上,router.pushUrl()方法新增了mode参数,可以将mode参数配置为router.RouterMode.Single 单实例模式 和 router.RouterMode.Standard多实例模式。在单实例模式下:如果目标页面的url在页面栈中已经存在同url页面,离栈顶最近同url页面会被移动到栈顶,移动后的页面为新建页,页面栈的元素数量不变;如果目标页面的url在页面栈中不存在同url页面,按多实例模式跳转,页面栈的元素数量会+1.---当页面栈的元素数量较大或者超过32时,可以通过调用router.clear()方法清除页面栈中所有历史页面,仅保留当前页面作为栈顶页面。
    router.pushUrl({url: 'pages/Second',params: {src: 'Index页面传来的数据',}
    }, router.RouterMode.Single)
  • router.replaceUrl()方法---API9及以上,router.replaceUrl()方法也新增了mode参数,可以配置为router.RouterMode.Single单实例模式和router.RouterMode.Standard多实例模式。在单实例模式下:如果目标页面的url在页面栈中已经存在了同url页面,离栈顶最近的同url页面会被移动到栈顶,替换当前页面,并销毁被替换的当前页面,移动后的页面为新建页,页面栈的元素会减一;如果目标页面的url在页面栈中不存在同url页面,按多实例模式跳转,页面栈的元素数量不变。
    router.replaceUrl({url: 'pages/Second',params: {src: 'Index页面传来的数据',}
    }, router.RouterMode.Single)

在second页面中,通过调用router.getParams()方法获取Index页面传递过来的自定义参数。

import router from '@ohos.router';@Entry
@Component
struct Second {@State src: string = (router.getParams() as Record<string, string>)['src'];// 页面刷新展示// ...
}

 效果示意如下图所示。在Index页面中,点击“next”后,即可以从Index页面跳转到second页面,并在second页面中接收参数和进行页面刷新展示。

 页面返回和参数接收

经常还会遇到一个场景,在second页面中,完成一些功能操作后,希望能够返回到Index页面。实现方式:

在second页面中,可以通过调用router.back()方法实现返回到上一个页面,或者在调用router.back()方法时增加可选的options参数(增加url参数)返回指定页面。

  • 调用router.back()返回的目标页面需要在页面栈中存在才能正常跳转。
  • 例如调用router.pushUrl()方法跳转到second页面,在second页面可以通过调用router.back()方法返回到上一个页面。
  • 例如调用router.clear()方法清空了页面栈中所有历史页面,仅保留当前页面,此时则无法通过调用router.back()方法返回到上一个页面。

代码示意:

//返回上一个页面
router.back();//返回到指定页面
router.back({ url: 'pages/Index' });

效果示意如下图所示。在second页面中,点击“back”后,即可以从second页面返回到Index页面。

页面返回可以根据业务需要增加一个询问对话框。即在调用router.back()方法之前,可以先调用router.enableBackPageAlert()方法开启页面返回询问对话框功能。

  • router.enableBackPageAlert()方法开启页面返回询问对话框功能,只针对当前页面生效。例如在调用router.pushUrl()或者route.replaceUrl()方法,跳转后的页面均为新建页面,因此在页面返回之前均需要先调用router.enableBackPageAlert()方法之后,页面返回询问对话框功能才会生效。
  • 如需关闭页面返回询问对话框功能,可以通过调用router.disableAlertBeforeBackPage()方法关闭该功能。
router.enableBackPageAlert({message: 'Message Info'
});router.back();

在second页面中,调用router.back()方法返回上一个页面或返回指定页面时,根据需要继续增加自定义参数,例如在返回时增加一个自定义参数src。

router.back({url: 'pages/Index',params: {src: 'Second页面传来的数据',}
})

从second页面返回到index页面。在index页面通过调用router.getParam()方法,获取second页面传递过来的自定义参数。调用router.back()方法,不会新建页面,返回的是原来的页面,在原来页面中@state声明的变量不会重复声明,也不会出发页面的aboutToAppear()生命周期回调,因此无法直接在变量声明以及页面的aboutToAppear()生命周期回调中接收和解析router.back()方法传递过来的自定义参数。 

可以放在业务需要的位置进行参数解析。

//在index页面中的onPageShow()生命周期回调中进行参数的解析。
import router from '@ohos.router';
class routerParams {src:stringconstructor(str:string) {this.src = str}
}
@Entry
@Component
struct Index {@State src: string = '';onPageShow() {this.src = (router.getParams() as routerParams).src}// 页面刷新展示// ...
}

效果示意如下图。在second页面中,点击back后,即可从second页面返回到index页面,并在index页面中接收参数和进行页面刷新展示。 

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

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

相关文章

CART 算法【python,机器学习,算法】

CART(Classification and Regression Tree)分类回归树。使用基尼指数计算得到树的节点。基尼指数表示系统整体的不确定性&#xff0c; 不确定性越大&#xff0c;基尼指数越大&#xff0c;所以在决策树中&#xff0c;将加权基尼系数最小的特征作为树的决策节点。 公式推导 基尼…

28【Aseprite 作图】苹果——拆解

1 画苹果框架 左边:第一行 7 第二行 2 第三 四行1 竖着7行 竖着2行 竖着1 、1 行 横着2个 横着4个 苹果可以是左右对称的,完成上述后,水平翻转到右边 2 枝叶 第一行1 左边 2 3 4 行,各1 第5行,竖着4个 再横着3个 右边 竖着3个,然后斜着2个,然后斜着1个 最上面的,两个…

Java中的JSP与Servlet的详细解释

一、技术难点 在Java Web开发中&#xff0c;JSP&#xff08;Java Server Pages&#xff09;和Servlet是两个核心概念&#xff0c;它们各自有其技术难点。 JSP技术难点&#xff1a; JSP页面的生命周期管理&#xff1a;JSP页面在首次被访问时会被转换为Servlet&#xff0c;然后…

AI大模型下的微服务会有什么?

在人工智能领域&#xff0c;会使用到许多微服务来处理不同的任务。"微服务"指的是将一个大型应用拆分成一系列小的服务&#xff0c;每个服务运行在其独立的进程中&#xff0c;并通过轻量级的机制&#xff08;通常是HTTP RESTful API&#xff09;与其他服务通信。每个…

靶机Moonraker_1练习报告

Moonraker: 1靶机练习实践报告 一、安装靶机 靶机是.ova文件&#xff0c;需要用VirtualBox打开&#xff0c;但我习惯于使用VMWare,因此修改靶机文件&#xff0c;使其适用于VMWare打开。 解压ova文件&#xff0c;得到.ovf文件和.vmdk文件。 直接用VMWare打开.ovf文件即可。 …

webserver服务器从零搭建到上线(七)|Channel通道类和Poller抽象类

TcpServer是我们整个编写服务器的入口&#xff0c;其中有一个很重要的类&#xff1a;EventLoop事件分发器。 其实我们就可以把EventLoop当做我们的epoll_wait&#xff0c;它主要管理类一个Poller类&#xff0c;我们看名字就可以知道&#xff0c;Poller类应该封装了Epoll本身&a…

【服务器报错】Pycharm运行服务器代码提示 can‘t open file “本地文件路径“

1. 问题 Pycharm连接远程服务器&#xff0c;代码已经同步&#xff0c;运行时候报错 #模拟报错 bash: line 0: cd: G:/python/hhh/Hi: No such file or directory /home/hhh/anaconda3/envs/hard/bin/python: cant open file G:/python/hhh/hi/hei.py: [Errno 2] No such file…

顶级域名、主域名、子域名

在互联网上&#xff0c;域名系统(DNS)用于将人类可读的域名(如www.example.com映射到服务器的IP地址 域名可以分为多个部分&#xff0c;通常包括主域名(PrimaryDomain)和子域名(Subdomain)。 顶级域名 是域名系统的最高级别&#xff0c;通常代表特定的组织类型或国家 .com、…

springMVC工作流程

大家好&#xff0c;这里是教授.F 1.浏览器会先发送请求url&#xff0c;前端控制器/中央控制器/分发器&#xff08;也就是DispatcherServlet&#xff09;进行获取。 2.此时前端控制器会调用HandlerMapping处理器映射器&#xff0c;然后返回处理器执行器链&#xff08;HandlerExe…

Android Service 启动流程

在早些年学习Android的时候&#xff0c;对Service有过总结&#xff0c;但是主要是如何去使用&#xff0c;注意事项&#xff0c;startService和bindService的区别。 Android Service_public int onstartcommand(intent intent, int flags-CSDN博客 但是今天从源码来总结下fram…

论文笔记《基于深度学习模型的药物-靶标结合亲和力预测》

基于深度学习模型的药物-靶标结合亲和力预测 这是一篇二区的文章&#xff0c;算是一个综述&#xff0c;记录一下在阅读过程中遇到的问题。 文章目录 基于深度学习模型的药物-靶标结合亲和力预测前言一、蛋白质接触图谱二、为什么蛋白质图谱的准确性对DTA模型预测结果没有影响1…

使用Python类的构造函数和析构函数

1、问题背景 当使用Python类时&#xff0c;可以使用构造函数和析构函数来初始化和清理类实例。构造函数在创建类实例时自动调用&#xff0c;而析构函数在删除类实例时自动调用。 在上面的代码示例中&#xff0c;Person类具有一个构造函数__init__和一个析构函数__del__。构造…

【代码】自定义函数

你有没有听过 n! ? n!n(n-1)(n-2)21 你想不想有一个c函数 jc() 专门用来计算n!&#xff1f; 不好意思&#xff0c;没有&#xff01;c函数库说。没有咱自己可以造呀&#xff01; 哈喽大家好&#xff0c;我是学霸小羊&#xff0c;今天讲讲自定义函数。 自定义函数的定义格式…

网易面试:手撕定时器

概述&#xff1a; 本文使用STL容器-set以及Linux提供的timerfd来实现定时器组件 所谓定时器就是管理大量定时任务&#xff0c;使其能按照超时时间有序地被执行 需求分析&#xff1a; 1.数据结构的选择&#xff1a;存储定时任务 2.驱动方式&#xff1a;如何选择一个任务并执…

CSS,HTML,JS 以及Vue前端面试题八股文总结【看完你就变高手】

■ 符号说明 &#x1f498; 主题 &#x1f31f; 常见重要 &#x1f31b; 需要有印象的 &#x1f195; v3新特性 ■ 杂谈 &#x1f31b; SEO优化 合理的title、description、keywords&#xff1a;搜索对着三项的权重逐个减小&#xff0c;title值强调重点即可&#xff1b;descrip…

东软的第三个研发基地,为什么选择了武汉?

继沈阳、大连之后&#xff0c;东软集团在国内打造的第三个研发基地——武汉东软软件园&#xff0c;于2024年5月25日正式开园。 “占地面积158亩、建筑面积14万余平方米的武汉东软软件园&#xff0c;从开工到竣工仅仅用了18个月的时间。这样的建设速度&#xff0c;充分体现了武汉…

使用XMLHttpRequest对象进行网络请求的步骤

使用XMLHttpRequest对象进行网络请求的基本步骤如下: 1&#xff1a;创建XHR对象: const xhr new XMLHttpRequest();2&#xff1a;初始化请求: xhr.open(method, url, async);method: HTTP请求方法,如 GET, POST, PUT, DELETE 等。 url: 请求的目标URL地址。 async: 是否异步…

2.开发环境介绍

开发环境介绍三种&#xff1a;第一种是在线开发环境、第二种是Windows下的开发环境、第三种是Linux下的开发环境。 1.在线开发环境 2.Windows下的开发环境 用的比较多的是Devc&#xff0c;新手适合使用&#xff0c;上手快&#xff0c;简单&#xff0c;方便。 Devc使用&#x…

蓝桥杯练习系统(算法训练)ALGO-932 低阶行列式计算

资源限制 内存限制&#xff1a;64.0MB C/C时间限制&#xff1a;1.0s Java时间限制&#xff1a;3.0s Python时间限制&#xff1a;5.0s 问题描述 给出一个n阶行列式(1<n<9)&#xff0c;求出它的值。 输入格式 第一行给出两个正整数n,p&#xff1b;   接下来n行&…

Flutter 中的 SizedOverflowBox 小部件:全面指南

Flutter 中的 SizedOverflowBox 小部件&#xff1a;全面指南 在 Flutter 的布局世界中&#xff0c;SizedOverflowBox 是一个相对独特的小部件&#xff0c;它允许子组件溢出其父组件的界限&#xff0c;同时保持父组件的尺寸不变。这在某些特定的布局场景下非常有用&#xff0c;…